# tuannancy/taskfolio architecture

> Architecture diagram of the GitHub repository tuannancy/taskfolio, 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/tuannancy/taskfolio
- Repository: https://github.com/tuannancy/taskfolio

## Overview

Todo-Tasks is a personal task manager with a React client, Express API, and MongoDB persistence. The main workflow is browser sign-in or registration, session restoration, then authenticated task creation, editing, completion, filtering, and pagination; the server scopes task queries to the current user. The graph also shows validation, persistence, health checks, and shared error handling. Several frontend implementation details and deployment components are not represented in the supplied tree or excerpts, so their links are limited to README-documented relationships.

Main entry points: [`backend/src/server.js`](https://github.com/tuannancy/taskfolio/blob/main/backend/src/server.js) (API startup), [`frontend/src/App.jsx`](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/App.jsx) (App and routes), [`backend/src/app.js`](https://github.com/tuannancy/taskfolio/blob/main/backend/src/app.js) (HTTP app), [`backend/src/controllers/tasksControllers.js`](https://github.com/tuannancy/taskfolio/blob/main/backend/src/controllers/tasksControllers.js) (Task operations)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["React client"]
  node_app["App and routes<br/>[App.jsx]"]
  node_authctx["Auth context<br/>[AuthContext.jsx]"]
  node_authpages["Login and registration"]
  node_protected["Protected route<br/>[ProtectedRoute.jsx]"]
  node_todo["Task interface<br/>[TodoApp.jsx]"]
  node_taskparts["Task controls"]
  node_taskquery["Task queries<br/>[useTasks.js]"]
  node_clientapi["Axios API client<br/>[api.js]"]
end

subgraph group_api["Express API"]
  node_server["API startup<br/>[server.js]"]
  node_appserver["HTTP app<br/>[app.js]"]
  node_authroutes["Auth routes<br/>[authRoutes.js]"]
  node_taskroutes["Task routes<br/>[tasksRouters.js]"]
  node_authmw["Session middleware<br/>[auth.js]"]
  node_errors["Error responses<br/>[errorHandler.js]"]
  node_config["Runtime config<br/>[env.js]"]
end

subgraph group_domain["Identity and tasks"]
  node_authctrl["Auth operations<br/>[authControllers.js]"]
  node_taskctrl["Task operations"]
  node_validation["Request validation<br/>[schemas.js]"]
end

subgraph group_storage["Persistence"]
  node_user["User model<br/>[User.js]"]
  node_task["Task model<br/>[Task.js]"]
  node_dbconfig["Database connection<br/>[db.js]"]
end

node_browser(("Browser user"))
node_mongodb[("MongoDB")]

node_browser -->|"uses"| node_app
node_app -->|"provides session"| node_authctx
node_app -->|"guards home"| node_protected
node_app -->|"renders home"| node_todo
node_app -->|"routes auth"| node_authpages
node_authctx -->|"restores session"| node_clientapi
node_todo -.->|"presents tasks"| node_taskparts
node_browser -.->|"requests tasks"| node_clientapi
node_clientapi -->|"calls API"| node_appserver
node_server -->|"loads config"| node_config
node_server -->|"connects database"| node_dbconfig
node_server -->|"waits for indexes"| node_user
node_server -->|"waits for indexes"| node_task
node_server -->|"starts app"| node_appserver
node_appserver -->|"mounts routes"| node_authroutes
node_appserver -->|"mounts routes"| node_taskroutes
node_appserver -->|"handles errors"| node_errors
node_authroutes -->|"dispatches auth"| node_authctrl
node_authroutes -->|"checks session"| node_authmw
node_taskroutes -->|"dispatches tasks"| node_taskctrl
node_taskroutes -->|"checks session"| node_authmw
node_authmw -->|"loads user"| node_user
node_authctrl -->|"reads and writes"| node_user
node_authctrl -->|"validates input"| node_validation
node_taskctrl -->|"queries and writes"| node_task
node_taskctrl -->|"validates input"| node_validation
node_taskctrl -->|"raises errors"| node_errors
node_dbconfig -.->|"connects"| node_mongodb
node_user -.->|"persists accounts"| node_mongodb
node_task -.->|"persists tasks"| node_mongodb

click node_app "https://github.com/tuannancy/taskfolio/blob/main/frontend/src/App.jsx"
click node_authctx "https://github.com/tuannancy/taskfolio/blob/main/frontend/src/context/AuthContext.jsx"
click node_authpages "https://github.com/tuannancy/taskfolio/tree/main/frontend/src/pages"
click node_protected "https://github.com/tuannancy/taskfolio/blob/main/frontend/src/components/ProtectedRoute.jsx"
click node_todo "https://github.com/tuannancy/taskfolio/blob/main/frontend/src/components/TodoApp.jsx"
click node_taskparts "https://github.com/tuannancy/taskfolio/tree/main/frontend/src/components"
click node_taskquery "https://github.com/tuannancy/taskfolio/blob/main/frontend/src/hooks/useTasks.js"
click node_clientapi "https://github.com/tuannancy/taskfolio/blob/main/frontend/src/services/api.js"
click node_server "https://github.com/tuannancy/taskfolio/blob/main/backend/src/server.js"
click node_appserver "https://github.com/tuannancy/taskfolio/blob/main/backend/src/app.js"
click node_authroutes "https://github.com/tuannancy/taskfolio/blob/main/backend/src/routes/authRoutes.js"
click node_taskroutes "https://github.com/tuannancy/taskfolio/blob/main/backend/src/routes/tasksRouters.js"
click node_authmw "https://github.com/tuannancy/taskfolio/blob/main/backend/src/middleware/auth.js"
click node_authctrl "https://github.com/tuannancy/taskfolio/blob/main/backend/src/controllers/authControllers.js"
click node_taskctrl "https://github.com/tuannancy/taskfolio/blob/main/backend/src/controllers/tasksControllers.js"
click node_validation "https://github.com/tuannancy/taskfolio/blob/main/backend/src/validation/schemas.js"
click node_errors "https://github.com/tuannancy/taskfolio/blob/main/backend/src/middleware/errorHandler.js"
click node_user "https://github.com/tuannancy/taskfolio/blob/main/backend/models/User.js"
click node_task "https://github.com/tuannancy/taskfolio/blob/main/backend/models/Task.js"
click node_dbconfig "https://github.com/tuannancy/taskfolio/blob/main/backend/src/config/db.js"
click node_config "https://github.com/tuannancy/taskfolio/blob/main/backend/src/config/env.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_authctx,node_authpages,node_protected,node_todo,node_taskparts,node_taskquery,node_clientapi,node_browser toneBlue
class node_server,node_appserver,node_authroutes,node_taskroutes,node_authmw,node_errors,node_config,node_mongodb toneAmber
class node_authctrl,node_taskctrl,node_validation toneMint
class node_user,node_task,node_dbconfig toneRose
```

## Components

### React client

- [App and routes](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Auth context](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/context/AuthContext.jsx): `frontend/src/context/AuthContext.jsx`
- [Login and registration](https://github.com/tuannancy/taskfolio/tree/main/frontend/src/pages): `frontend/src/pages`
- [Protected route](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/components/ProtectedRoute.jsx): `frontend/src/components/ProtectedRoute.jsx`
- [Task interface](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/components/TodoApp.jsx): `frontend/src/components/TodoApp.jsx`
- [Task controls](https://github.com/tuannancy/taskfolio/tree/main/frontend/src/components): `frontend/src/components`
- [Task queries](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/hooks/useTasks.js): `frontend/src/hooks/useTasks.js`
- [Axios API client](https://github.com/tuannancy/taskfolio/blob/main/frontend/src/services/api.js): `frontend/src/services/api.js`

### Express API

- [API startup](https://github.com/tuannancy/taskfolio/blob/main/backend/src/server.js): `backend/src/server.js`
- [HTTP app](https://github.com/tuannancy/taskfolio/blob/main/backend/src/app.js): `backend/src/app.js`
- [Auth routes](https://github.com/tuannancy/taskfolio/blob/main/backend/src/routes/authRoutes.js): `backend/src/routes/authRoutes.js`
- [Task routes](https://github.com/tuannancy/taskfolio/blob/main/backend/src/routes/tasksRouters.js): `backend/src/routes/tasksRouters.js`
- [Session middleware](https://github.com/tuannancy/taskfolio/blob/main/backend/src/middleware/auth.js): `backend/src/middleware/auth.js`
- [Error responses](https://github.com/tuannancy/taskfolio/blob/main/backend/src/middleware/errorHandler.js): `backend/src/middleware/errorHandler.js`
- [Runtime config](https://github.com/tuannancy/taskfolio/blob/main/backend/src/config/env.js): `backend/src/config/env.js`

### Identity and tasks

- [Auth operations](https://github.com/tuannancy/taskfolio/blob/main/backend/src/controllers/authControllers.js): `backend/src/controllers/authControllers.js`
- [Task operations](https://github.com/tuannancy/taskfolio/blob/main/backend/src/controllers/tasksControllers.js): `backend/src/controllers/tasksControllers.js`
- [Request validation](https://github.com/tuannancy/taskfolio/blob/main/backend/src/validation/schemas.js): `backend/src/validation/schemas.js`

### Persistence

- [User model](https://github.com/tuannancy/taskfolio/blob/main/backend/models/User.js): `backend/models/User.js`
- [Task model](https://github.com/tuannancy/taskfolio/blob/main/backend/models/Task.js): `backend/models/Task.js`
- [Database connection](https://github.com/tuannancy/taskfolio/blob/main/backend/src/config/db.js): `backend/src/config/db.js`

### Other components

- **Browser user**
- **MongoDB**

## Connections

- Browser user → App and routes: uses
- App and routes → Auth context: provides session (evidence: `frontend/src/App.jsx`)
- App and routes → Protected route: guards home (evidence: `frontend/src/App.jsx`)
- App and routes → Task interface: renders home (evidence: `frontend/src/App.jsx`)
- App and routes → Login and registration: routes auth (evidence: `frontend/src/App.jsx`)
- Auth context → Axios API client: restores session (evidence: `frontend/src/context/AuthContext.jsx`)
- Task interface → Task controls: presents tasks
- Browser user → Axios API client: requests tasks
- Axios API client → HTTP app: calls API
- API startup → Runtime config: loads config (evidence: `backend/src/server.js`)
- API startup → Database connection: connects database (evidence: `backend/src/server.js`)
- API startup → User model: waits for indexes (evidence: `backend/src/server.js`)
- API startup → Task model: waits for indexes (evidence: `backend/src/server.js`)
- API startup → HTTP app: starts app (evidence: `backend/src/server.js`)
- HTTP app → Auth routes: mounts routes (evidence: `backend/src/app.js`)
- HTTP app → Task routes: mounts routes (evidence: `backend/src/app.js`)
- HTTP app → Error responses: handles errors (evidence: `backend/src/app.js`)
- Auth routes → Auth operations: dispatches auth (evidence: `backend/src/routes/authRoutes.js`)
- Auth routes → Session middleware: checks session (evidence: `backend/src/routes/authRoutes.js`)
- Task routes → Task operations: dispatches tasks (evidence: `backend/src/routes/tasksRouters.js`)
- Task routes → Session middleware: checks session (evidence: `backend/src/routes/tasksRouters.js`)
- Session middleware → User model: loads user (evidence: `backend/src/middleware/auth.js`)
- Auth operations → User model: reads and writes (evidence: `backend/src/controllers/authControllers.js`)
- Auth operations → Request validation: validates input (evidence: `backend/src/controllers/authControllers.js`)
- Task operations → Task model: queries and writes (evidence: `backend/src/controllers/tasksControllers.js`)
- Task operations → Request validation: validates input (evidence: `backend/src/controllers/tasksControllers.js`)
- Task operations → Error responses: raises errors (evidence: `backend/src/controllers/tasksControllers.js`)
- Database connection → MongoDB: connects
- User model → MongoDB: persists accounts
- Task model → MongoDB: persists tasks