# arm1991/full-stack-todo-list architecture

> Architecture diagram of the GitHub repository arm1991/full-stack-todo-list, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-25). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/arm1991/full-stack-todo-list
- Repository: https://github.com/arm1991/full-stack-todo-list

## Overview

This repository implements a browser-based todo application with account registration, sign-in, token refresh, and per-user todo management. The user enters through the React app; authentication gates the content, while frontend service modules make API requests to the Express router. The backend routes authentication and todo requests to controllers, which delegate to services for validation, token handling, and user/todo operations persisted through MongoDB models. The sampled sources establish the backend call paths; several frontend component and Redux internals were not sampled, so their wiring is shown only where directly evident.

Main entry points: [`backend/services/user-service.js`](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/user-service.js) (User service), [`frontend/src/App.jsx`](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/App.jsx) (App), [`backend/router/index.js`](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/router/index.js) (API router), [`backend/controllers/todo-controller.js`](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/controllers/todo-controller.js) (Todo controller)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Frontend application"]
  node_app["App<br/>[App.jsx]"]
  node_auth_ui["Auth UI<br/>[Auth.jsx]"]
  node_content_ui["Content UI<br/>[Content.jsx]"]
  node_main_ui["Main view<br/>[Main.jsx]"]
  node_todo_ui["Todo view<br/>[Todo.jsx]"]
  node_auth_service["Auth client<br/>[AuthService.js]"]
  node_todo_service_client["Todo client<br/>[TodoService.js]"]
  node_api_client["API client<br/>[index.js]"]
end

subgraph group_backend["Backend API"]
  node_server["API server<br/>[index.js]"]
  node_router["API router<br/>[index.js]"]
  node_auth_middleware["Auth middleware<br/>[auth-middleware.js]"]
end

subgraph group_identity["Identity services"]
  node_user_controller["User controller<br/>[user-controller.js]"]
  node_user_service["User service<br/>[user-service.js]"]
  node_token_service["Token service<br/>[token-service.js]"]
  node_user_model["User model<br/>[user-model.js]"]
  node_token_model["Token model<br/>[token-model.js]"]
end

subgraph group_todos["Todo services"]
  node_todo_controller["Todo controller<br/>[todo-controller.js]"]
  node_todo_service["Todo service<br/>[todo-service.js]"]
end

node_user(("User"))
node_mongo[("MongoDB")]

node_user -->|"uses"| node_app
node_app -->|"renders when signed out"| node_auth_ui
node_app -->|"renders when signed in"| node_content_ui
node_app -->|"content composition"| node_main_ui
node_user -->|"submits credentials"| node_auth_service
node_user -->|"manages todos"| node_todo_ui
node_auth_service -->|"sends auth requests"| node_api_client
node_todo_service_client -->|"sends todo requests"| node_api_client
node_api_client -->|"HTTP requests"| node_server
node_server -->|"mounts API routes"| node_router
node_router -->|"dispatches auth routes"| node_user_controller
node_router -->|"guards todo routes"| node_auth_middleware
node_router -->|"dispatches todo routes"| node_todo_controller
node_user_controller -->|"calls identity operations"| node_user_service
node_user_service -->|"reads and writes users"| node_user_model
node_user_service -->|"manages tokens"| node_token_service
node_user_service -->|"creates default todo"| node_todo_service
node_todo_controller -->|"creates todos"| node_todo_service
node_todo_controller -->|"updates user todos"| node_user_service
node_token_service -->|"stores refresh tokens"| node_token_model
node_user_model -->|"persists users"| node_mongo
node_token_model -->|"persists tokens"| node_mongo

click node_app "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/App.jsx"
click node_auth_ui "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/Auth.jsx"
click node_content_ui "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/Content.jsx"
click node_main_ui "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/main/Main.jsx"
click node_todo_ui "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/sections/section-two/todo/Todo.jsx"
click node_auth_service "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/services/AuthService.js"
click node_todo_service_client "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/services/TodoService.js"
click node_api_client "https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/api/index.js"
click node_server "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/index.js"
click node_router "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/router/index.js"
click node_user_controller "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/controllers/user-controller.js"
click node_user_service "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/user-service.js"
click node_token_service "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/token-service.js"
click node_user_model "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/models/user-model.js"
click node_token_model "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/models/token-model.js"
click node_todo_controller "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/controllers/todo-controller.js"
click node_todo_service "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/todo-service.js"
click node_auth_middleware "https://github.com/arm1991/full-stack-todo-list/blob/main/backend/middlewares/auth-middleware.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_auth_ui,node_content_ui,node_main_ui,node_todo_ui,node_auth_service,node_todo_service_client,node_api_client,node_user toneBlue
class node_server,node_router,node_auth_middleware,node_mongo toneAmber
class node_user_controller,node_user_service,node_token_service,node_user_model,node_token_model toneMint
class node_todo_controller,node_todo_service toneRose
```

## Components

### Frontend application

- [App](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Auth UI](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/Auth.jsx): `frontend/src/components/Auth.jsx`
- [Content UI](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/Content.jsx): `frontend/src/components/Content.jsx`
- [Main view](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/main/Main.jsx): `frontend/src/components/main/Main.jsx`
- [Todo view](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/components/sections/section-two/todo/Todo.jsx): `frontend/src/components/sections/section-two/todo/Todo.jsx`
- [Auth client](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/services/AuthService.js): `frontend/src/services/AuthService.js`
- [Todo client](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/services/TodoService.js): `frontend/src/services/TodoService.js`
- [API client](https://github.com/arm1991/full-stack-todo-list/blob/main/frontend/src/api/index.js): `frontend/src/api/index.js`

### Backend API

- [API server](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/index.js): `backend/index.js`
- [API router](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/router/index.js): `backend/router/index.js`
- [Auth middleware](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/middlewares/auth-middleware.js): `backend/middlewares/auth-middleware.js`

### Identity services

- [User controller](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/controllers/user-controller.js): `backend/controllers/user-controller.js`
- [User service](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/user-service.js): `backend/services/user-service.js`
- [Token service](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/token-service.js): `backend/services/token-service.js`
- [User model](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/models/user-model.js): `backend/models/user-model.js`
- [Token model](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/models/token-model.js): `backend/models/token-model.js`

### Todo services

- [Todo controller](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/controllers/todo-controller.js): `backend/controllers/todo-controller.js`
- [Todo service](https://github.com/arm1991/full-stack-todo-list/blob/main/backend/services/todo-service.js): `backend/services/todo-service.js`

### Other components

- **User**
- **MongoDB**

## Connections

- User → App: uses
- App → Auth UI: renders when signed out
- App → Content UI: renders when signed in
- App → Main view: content composition
- User → Auth client: submits credentials
- User → Todo view: manages todos
- Auth client → API client: sends auth requests
- Todo client → API client: sends todo requests
- API client → API server: HTTP requests
- API server → API router: mounts API routes
- API router → User controller: dispatches auth routes
- API router → Auth middleware: guards todo routes
- API router → Todo controller: dispatches todo routes
- User controller → User service: calls identity operations
- User service → User model: reads and writes users
- User service → Token service: manages tokens
- User service → Todo service: creates default todo
- Todo controller → Todo service: creates todos
- Todo controller → User service: updates user todos
- Token service → Token model: stores refresh tokens
- User model → MongoDB: persists users
- Token model → MongoDB: persists tokens