# dizza19/frontend-project-11 architecture

> Architecture diagram of the GitHub repository dizza19/frontend-project-11, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/dizza19/frontend-project-11
- Repository: https://github.com/dizza19/frontend-project-11

## Overview

The repository describes an RSS-reader SPA. The intended workflow in `src/app.js` is URL submission, RSS retrieval and parsing, state updates, then feed/post rendering; `src/updater.js` separately implements periodic refresh. The sampled files do not establish how these modules are wired into the page: `src/main.js` imports a state initializer not present in the sampled `src/state.js`. The README also mentions Yup validation, but the sampled code uses a duplicate check instead. The graph shows supported module behavior, not a verified running entry-point flow.

Main entry points: [`src/api.js`](https://github.com/dizza19/frontend-project-11/blob/main/src/api.js) (RSS fetch API), [`src/app.js`](https://github.com/dizza19/frontend-project-11/blob/main/src/app.js) (Submission handler), [`src/updater.js`](https://github.com/dizza19/frontend-project-11/blob/main/src/updater.js) (Periodic updater), [`src/state.js`](https://github.com/dizza19/frontend-project-11/blob/main/src/state.js) (Watched state)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_submission["Feed submission"]
  node_controller["Submission handler<br/>[app.js]"]
end

subgraph group_content["RSS retrieval"]
  node_updater["Periodic updater<br/>[updater.js]"]
  node_api["RSS fetch API<br/>[api.js]"]
  node_parser["XML parser<br/>[parser.js]"]
  node_proxy["CORS proxy"]
end

subgraph group_presentation["State and presentation"]
  node_state["Watched state<br/>[state.js]"]
  node_view["Feed and post views<br/>[view.js]"]
  node_i18n["Translation setup<br/>[i18n.js]"]
  node_english["English strings<br/>[en.json]"]
  node_russian["Russian strings<br/>[ru.json]"]
end

node_reader(("Reader"))
node_feedhost["RSS feed hosts"]

node_reader -->|"submits URL"| node_controller
node_controller -->|"requests feed"| node_api
node_api -->|"fetches through"| node_proxy
node_proxy -->|"retrieves feed"| node_feedhost
node_proxy -->|"returns XML"| node_api
node_api -->|"parses with"| node_parser
node_parser -->|"returns feed data"| node_api
node_api -->|"returns parsed data"| node_controller
node_controller -->|"adds feeds and posts"| node_state
node_state -->|"renders changes"| node_view
node_updater -->|"reads and updates"| node_state
node_updater -->|"refetches feeds"| node_api
node_updater -->|"renders new posts"| node_view
node_i18n -->|"loads strings"| node_english
node_i18n -->|"loads strings"| node_russian

click node_controller "https://github.com/dizza19/frontend-project-11/blob/main/src/app.js"
click node_state "https://github.com/dizza19/frontend-project-11/blob/main/src/state.js"
click node_view "https://github.com/dizza19/frontend-project-11/blob/main/src/view.js"
click node_updater "https://github.com/dizza19/frontend-project-11/blob/main/src/updater.js"
click node_api "https://github.com/dizza19/frontend-project-11/blob/main/src/api.js"
click node_parser "https://github.com/dizza19/frontend-project-11/blob/main/src/parser.js"
click node_i18n "https://github.com/dizza19/frontend-project-11/blob/main/src/i18n.js"
click node_english "https://github.com/dizza19/frontend-project-11/blob/main/src/locales/en.json"
click node_russian "https://github.com/dizza19/frontend-project-11/blob/main/src/locales/ru.json"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_controller toneBlue
class node_updater,node_api,node_parser,node_proxy toneAmber
class node_state,node_view,node_i18n,node_english,node_russian toneMint
class node_reader,node_feedhost toneIndigo
```

## Components

### Feed submission

- [Submission handler](https://github.com/dizza19/frontend-project-11/blob/main/src/app.js): `src/app.js`

### RSS retrieval

- [Periodic updater](https://github.com/dizza19/frontend-project-11/blob/main/src/updater.js): `src/updater.js`
- [RSS fetch API](https://github.com/dizza19/frontend-project-11/blob/main/src/api.js): `src/api.js`
- [XML parser](https://github.com/dizza19/frontend-project-11/blob/main/src/parser.js): `src/parser.js`
- **CORS proxy**

### State and presentation

- [Watched state](https://github.com/dizza19/frontend-project-11/blob/main/src/state.js): `src/state.js`
- [Feed and post views](https://github.com/dizza19/frontend-project-11/blob/main/src/view.js): `src/view.js`
- [Translation setup](https://github.com/dizza19/frontend-project-11/blob/main/src/i18n.js): `src/i18n.js`
- [English strings](https://github.com/dizza19/frontend-project-11/blob/main/src/locales/en.json): `src/locales/en.json`
- [Russian strings](https://github.com/dizza19/frontend-project-11/blob/main/src/locales/ru.json): `src/locales/ru.json`

### Other components

- **Reader**
- **RSS feed hosts**

## Connections

- Reader → Submission handler: submits URL
- Submission handler → RSS fetch API: requests feed
- RSS fetch API → CORS proxy: fetches through
- CORS proxy → RSS feed hosts: retrieves feed
- CORS proxy → RSS fetch API: returns XML
- RSS fetch API → XML parser: parses with
- XML parser → RSS fetch API: returns feed data
- RSS fetch API → Submission handler: returns parsed data
- Submission handler → Watched state: adds feeds and posts
- Watched state → Feed and post views: renders changes
- Periodic updater → Watched state: reads and updates
- Periodic updater → RSS fetch API: refetches feeds
- Periodic updater → Feed and post views: renders new posts
- Translation setup → English strings: loads strings
- Translation setup → Russian strings: loads strings