# iolanta-pushchayenka/wiki-app architecture

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

- Interactive diagram: https://gitdiagram.com/iolanta-pushchayenka/wiki-app
- Repository: https://github.com/iolanta-pushchayenka/wiki-app

## Overview

Wiki App lets users browse, create, edit, and delete articles, with attachment management and live notifications. The React pages initiate HTTP requests to an Express API; article records are JSON files and uploaded attachments are stored separately. The README also describes PostgreSQL configuration and migrations, but the sampled runtime article controllers use filesystem storage, so the graph does not assert a database connection. Several frontend and routing relationships are supported by the source index; unsampled behavior is not expanded beyond those references.

Main entry points: [`backend/src/app.js`](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/app.js) (Express API), [`frontend/src/App.jsx`](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/App.jsx) (React routes), [`backend/src/controllers/attachmentsController.js`](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/attachmentsController.js) (Attachment operations), [`frontend/src/pages/ArticlePage.jsx`](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/ArticlePage.jsx) (Article reader)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Wiki interface"]
  node_app["React routes<br/>[App.jsx]"]
  node_home["Article listing<br/>[HomePage.jsx]"]
  node_article_page["Article reader<br/>[ArticlePage.jsx]"]
  node_edit_page["Article editor<br/>[ArticleEdit.jsx]"]
  node_create_page["Create article<br/>[ArticleForm.jsx]"]
  node_attach_page["Attachment manager<br/>[AttachPage.jsx]"]
  node_article_list["Article list UI<br/>[ArticleList.jsx]"]
  node_article_menu["Article actions<br/>[ArticleMenu.jsx]"]
  node_article_view["Article display<br/>[ArticleView.jsx]"]
  node_attachment_list["Attachment list<br/>[AttachmentList.jsx]"]
  node_uploader["Attachment uploader"]
  node_header["Navigation header<br/>[Header.jsx]"]
  node_toast["Notification toast"]
end

subgraph group_backend["API and runtime"]
  node_api["Express API<br/>[app.js]"]
  node_article_routes["Article routes<br/>[articles.js]"]
  node_attachment_routes["Attachment routes<br/>[attachments.js]"]
  node_article_controller["Article operations"]
  node_attachment_controller["Attachment operations"]
  node_upload["Upload handling<br/>[fileUpload.js]"]
  node_server["HTTP server<br/>[server.js]"]
end

subgraph group_content["Article and file storage"]
  node_config["Storage paths<br/>[config.js]"]
  node_article_files[("Article JSON files")]
  node_attachment_files[("Uploaded files")]
end

subgraph group_realtime["Live notifications"]
  node_ws["WebSocket broadcaster<br/>[websocket.js]"]
end

node_user(("Wiki user"))

node_user -->|"uses"| node_app
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_article_page
node_app -->|"routes to"| node_create_page
node_app -->|"routes to"| node_edit_page
node_home -->|"renders"| node_article_list
node_home -.->|"fetches articles"| node_api
node_article_page -->|"renders"| node_article_view
node_article_page -->|"renders"| node_attachment_list
node_article_page -.->|"fetches article"| node_api
node_edit_page -->|"embeds"| node_attach_page
node_edit_page -->|"updates article"| node_api
node_create_page -.->|"creates article"| node_api
node_attach_page -->|"renders"| node_uploader
node_attach_page -->|"renders"| node_attachment_list
node_article_list -->|"renders"| node_article_menu
node_article_list -.->|"navigates to"| node_article_page
node_app -->|"renders"| node_toast
node_api -->|"mounts"| node_article_routes
node_api -->|"mounts"| node_attachment_routes
node_article_routes -->|"routes to"| node_article_controller
node_attachment_routes -->|"routes to"| node_attachment_controller
node_attachment_routes -->|"configures"| node_upload
node_server -->|"serves"| node_api
node_server -->|"initializes"| node_ws
node_article_controller -->|"reads paths"| node_config
node_attachment_controller -->|"reads paths"| node_config
node_upload -->|"uses paths"| node_config
node_article_controller -->|"reads and writes"| node_article_files
node_attachment_controller -->|"reads and writes"| node_article_files
node_attachment_controller -->|"writes and deletes"| node_attachment_files
node_article_controller -->|"notifies"| node_ws
node_attachment_controller -->|"notifies"| node_ws
node_toast -.->|"receives updates"| node_ws

click node_app "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/App.jsx"
click node_home "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/HomePage.jsx"
click node_article_page "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/ArticlePage.jsx"
click node_edit_page "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleEdit.jsx"
click node_create_page "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleForm.jsx"
click node_attach_page "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/AttachPage.jsx"
click node_article_list "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleList.jsx"
click node_article_menu "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleMenu.jsx"
click node_article_view "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleView.jsx"
click node_attachment_list "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/AttachmentList.jsx"
click node_uploader "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/AttachmentUploader.jsx"
click node_header "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/Header.jsx"
click node_toast "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/NotificationToast.jsx"
click node_api "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/app.js"
click node_article_routes "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/routes/articles.js"
click node_attachment_routes "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/routes/attachments.js"
click node_article_controller "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/articlesController.js"
click node_attachment_controller "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/attachmentsController.js"
click node_upload "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/utils/fileUpload.js"
click node_server "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/server.js"
click node_config "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/config.js"
click node_article_files "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/articlesController.js"
click node_attachment_files "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/attachmentsController.js"
click node_ws "https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/utils/websocket.js"

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_app,node_home,node_article_page,node_edit_page,node_create_page,node_attach_page,node_article_list,node_article_menu,node_article_view,node_attachment_list,node_uploader,node_header,node_toast,node_user toneBlue
class node_api,node_article_routes,node_attachment_routes,node_article_controller,node_attachment_controller,node_upload,node_server toneAmber
class node_config,node_article_files,node_attachment_files toneMint
class node_ws toneRose
```

## Components

### Wiki interface

- [React routes](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Article listing](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/HomePage.jsx): `frontend/src/pages/HomePage.jsx`
- [Article reader](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/ArticlePage.jsx): `frontend/src/pages/ArticlePage.jsx`
- [Article editor](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleEdit.jsx): `frontend/src/components/ArticleEdit.jsx`
- [Create article](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleForm.jsx): `frontend/src/components/ArticleForm.jsx`
- [Attachment manager](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/pages/AttachPage.jsx): `frontend/src/pages/AttachPage.jsx`
- [Article list UI](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleList.jsx): `frontend/src/components/ArticleList.jsx`
- [Article actions](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleMenu.jsx): `frontend/src/components/ArticleMenu.jsx`
- [Article display](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/ArticleView.jsx): `frontend/src/components/ArticleView.jsx`
- [Attachment list](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/AttachmentList.jsx): `frontend/src/components/AttachmentList.jsx`
- [Attachment uploader](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/AttachmentUploader.jsx): `frontend/src/components/AttachmentUploader.jsx`
- [Navigation header](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/Header.jsx): `frontend/src/components/Header.jsx`
- [Notification toast](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/frontend/src/components/NotificationToast.jsx): `frontend/src/components/NotificationToast.jsx`

### API and runtime

- [Express API](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/app.js): `backend/src/app.js`
- [Article routes](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/routes/articles.js): `backend/src/routes/articles.js`
- [Attachment routes](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/routes/attachments.js): `backend/src/routes/attachments.js`
- [Article operations](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/articlesController.js): `backend/src/controllers/articlesController.js`
- [Attachment operations](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/attachmentsController.js): `backend/src/controllers/attachmentsController.js`
- [Upload handling](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/utils/fileUpload.js): `backend/src/utils/fileUpload.js`
- [HTTP server](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/server.js): `backend/src/server.js`

### Article and file storage

- [Storage paths](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/config.js): `backend/src/config.js`
- [Article JSON files](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/articlesController.js): `backend/src/controllers/articlesController.js`
- [Uploaded files](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/controllers/attachmentsController.js): `backend/src/controllers/attachmentsController.js`

### Live notifications

- [WebSocket broadcaster](https://github.com/iolanta-pushchayenka/wiki-app/blob/hw2-api/backend/src/utils/websocket.js): `backend/src/utils/websocket.js`

### Other components

- **Wiki user**

## Connections

- Wiki user → React routes: uses (evidence: `frontend/src/App.jsx`)
- React routes → Article listing: routes to (evidence: `frontend/src/App.jsx`)
- React routes → Article reader: routes to (evidence: `frontend/src/App.jsx`)
- React routes → Create article: routes to (evidence: `frontend/src/App.jsx`)
- React routes → Article editor: routes to (evidence: `frontend/src/App.jsx`)
- Article listing → Article list UI: renders (evidence: `frontend/src/pages/HomePage.jsx`)
- Article listing → Express API: fetches articles
- Article reader → Article display: renders (evidence: `frontend/src/pages/ArticlePage.jsx`)
- Article reader → Attachment list: renders (evidence: `frontend/src/pages/ArticlePage.jsx`)
- Article reader → Express API: fetches article
- Article editor → Attachment manager: embeds (evidence: `frontend/src/components/ArticleEdit.jsx`)
- Article editor → Express API: updates article (evidence: `frontend/src/components/ArticleEdit.jsx`)
- Create article → Express API: creates article
- Attachment manager → Attachment uploader: renders (evidence: `frontend/src/pages/AttachPage.jsx`)
- Attachment manager → Attachment list: renders (evidence: `frontend/src/pages/AttachPage.jsx`)
- Article list UI → Article actions: renders (evidence: `frontend/src/components/ArticleList.jsx`)
- Article list UI → Article reader: navigates to
- React routes → Notification toast: renders (evidence: `frontend/src/App.jsx`)
- Express API → Article routes: mounts (evidence: `backend/src/app.js`)
- Express API → Attachment routes: mounts (evidence: `backend/src/app.js`)
- Article routes → Article operations: routes to (evidence: `backend/src/routes/articles.js`)
- Attachment routes → Attachment operations: routes to (evidence: `backend/src/routes/attachments.js`)
- Attachment routes → Upload handling: configures (evidence: `backend/src/routes/attachments.js`)
- HTTP server → Express API: serves (evidence: `backend/src/server.js`)
- HTTP server → WebSocket broadcaster: initializes (evidence: `backend/src/server.js`)
- Article operations → Storage paths: reads paths (evidence: `backend/src/controllers/articlesController.js`)
- Attachment operations → Storage paths: reads paths (evidence: `backend/src/controllers/attachmentsController.js`)
- Upload handling → Storage paths: uses paths (evidence: `backend/src/utils/fileUpload.js`)
- Article operations → Article JSON files: reads and writes (evidence: `backend/src/controllers/articlesController.js`)
- Attachment operations → Article JSON files: reads and writes (evidence: `backend/src/controllers/attachmentsController.js`)
- Attachment operations → Uploaded files: writes and deletes (evidence: `backend/src/controllers/attachmentsController.js`)
- Article operations → WebSocket broadcaster: notifies (evidence: `backend/src/controllers/articlesController.js`)
- Attachment operations → WebSocket broadcaster: notifies (evidence: `backend/src/controllers/attachmentsController.js`)
- Notification toast → WebSocket broadcaster: receives updates