# rudra20-04/taskflow architecture

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

- Interactive diagram: https://gitdiagram.com/rudra20-04/taskflow
- Repository: https://github.com/rudra20-04/taskflow

## Overview

TaskFlow is a full-stack task manager. Users sign up or log in, then use a protected dashboard to create, update, complete, filter, search, and reorder their tasks; task data is scoped to the authenticated user. The graph separates the React experience, API routing and authentication, task operations, and persistence. Dashboard analytics, theme support, and other README-described capabilities are retained, though some implementation details were not sampled; dashed links mark documented or unverified integrations.

Main entry points: [`frontend/src/App.jsx`](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/App.jsx) (App routing), [`frontend/src/api/api.js`](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/api/api.js) (HTTP client), [`backend/index.js`](https://github.com/rudra20-04/taskflow/blob/main/backend/index.js) (Express API), [`backend/routes/taskRoutes.js`](https://github.com/rudra20-04/taskflow/blob/main/backend/routes/taskRoutes.js) (Task routes)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["React application"]
  node_app["App routing<br/>[App.jsx]"]
  node_navbar["Navigation<br/>[Navbar.jsx]"]
  node_login["Login page<br/>[Login.jsx]"]
  node_signup["Signup page<br/>[Signup.jsx]"]
  node_dashboard["Task dashboard<br/>[Dashboard.jsx]"]
  node_theme["Theme bootstrap<br/>[main.jsx]"]
  node_client["HTTP client<br/>[api.js]"]
end

subgraph group_identity["Authentication"]
  node_api["Express API<br/>[index.js]"]
  node_authroutes["Auth routes<br/>[authRoutes.js]"]
  node_authcontroller["Signup and login<br/>[authController.js]"]
  node_authguard["JWT guard<br/>[authMiddleware.js]"]
end

subgraph group_tasks["Task management"]
  node_taskroutes["Task routes<br/>[taskRoutes.js]"]
  node_taskcontroller["Task operations<br/>[taskController.js]"]
end

subgraph group_data["Persistence"]
  node_taskmodel["Task schema<br/>[Task.js]"]
  node_usermodel["User schema<br/>[User.js]"]
  node_dbconfig["Database connection<br/>[db.js]"]
end

node_user(("Task manager user"))
node_mongo[("MongoDB")]

node_user -->|"uses"| node_app
node_app -->|"renders"| node_navbar
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_signup
node_app -->|"protects route"| node_dashboard
node_theme -->|"bootstraps"| node_app
node_login -->|"submits credentials"| node_client
node_signup -->|"submits registration"| node_client
node_dashboard -->|"requests tasks"| node_client
node_client -->|"sends API requests"| node_api
node_api -->|"mounts routes"| node_authroutes
node_api -->|"mounts routes"| node_taskroutes
node_authroutes -->|"dispatches"| node_authcontroller
node_taskroutes -->|"guards tasks"| node_authguard
node_taskroutes -->|"dispatches"| node_taskcontroller
node_authcontroller -->|"reads and creates users"| node_usermodel
node_taskcontroller -->|"reads and writes tasks"| node_taskmodel
node_authguard -.->|"verifies JWTs issued by"| node_authcontroller
node_dbconfig -->|"connects"| node_mongo
node_taskmodel -.->|"persists task records"| node_mongo
node_usermodel -.->|"persists user records"| node_mongo

click node_app "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/App.jsx"
click node_navbar "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/components/Navbar.jsx"
click node_login "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/pages/Login.jsx"
click node_signup "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/pages/Signup.jsx"
click node_dashboard "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/pages/Dashboard.jsx"
click node_theme "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/main.jsx"
click node_client "https://github.com/rudra20-04/taskflow/blob/main/frontend/src/api/api.js"
click node_api "https://github.com/rudra20-04/taskflow/blob/main/backend/index.js"
click node_authroutes "https://github.com/rudra20-04/taskflow/blob/main/backend/routes/authRoutes.js"
click node_authcontroller "https://github.com/rudra20-04/taskflow/blob/main/backend/controllers/authController.js"
click node_authguard "https://github.com/rudra20-04/taskflow/blob/main/backend/middleware/authMiddleware.js"
click node_taskroutes "https://github.com/rudra20-04/taskflow/blob/main/backend/routes/taskRoutes.js"
click node_taskcontroller "https://github.com/rudra20-04/taskflow/blob/main/backend/controllers/taskController.js"
click node_taskmodel "https://github.com/rudra20-04/taskflow/blob/main/backend/models/Task.js"
click node_usermodel "https://github.com/rudra20-04/taskflow/blob/main/backend/models/User.js"
click node_dbconfig "https://github.com/rudra20-04/taskflow/blob/main/backend/config/db.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_navbar,node_login,node_signup,node_dashboard,node_theme,node_client toneBlue
class node_api,node_authroutes,node_authcontroller,node_authguard,node_mongo toneAmber
class node_taskroutes,node_taskcontroller toneMint
class node_taskmodel,node_usermodel,node_dbconfig,node_user toneRose
```

## Components

### React application

- [App routing](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Navigation](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/components/Navbar.jsx): `frontend/src/components/Navbar.jsx`
- [Login page](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/pages/Login.jsx): `frontend/src/pages/Login.jsx`
- [Signup page](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/pages/Signup.jsx): `frontend/src/pages/Signup.jsx`
- [Task dashboard](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/pages/Dashboard.jsx): `frontend/src/pages/Dashboard.jsx`
- [Theme bootstrap](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/main.jsx): `frontend/src/main.jsx`
- [HTTP client](https://github.com/rudra20-04/taskflow/blob/main/frontend/src/api/api.js): `frontend/src/api/api.js`

### Authentication

- [Express API](https://github.com/rudra20-04/taskflow/blob/main/backend/index.js): `backend/index.js`
- [Auth routes](https://github.com/rudra20-04/taskflow/blob/main/backend/routes/authRoutes.js): `backend/routes/authRoutes.js`
- [Signup and login](https://github.com/rudra20-04/taskflow/blob/main/backend/controllers/authController.js): `backend/controllers/authController.js`
- [JWT guard](https://github.com/rudra20-04/taskflow/blob/main/backend/middleware/authMiddleware.js): `backend/middleware/authMiddleware.js`

### Task management

- [Task routes](https://github.com/rudra20-04/taskflow/blob/main/backend/routes/taskRoutes.js): `backend/routes/taskRoutes.js`
- [Task operations](https://github.com/rudra20-04/taskflow/blob/main/backend/controllers/taskController.js): `backend/controllers/taskController.js`

### Persistence

- [Task schema](https://github.com/rudra20-04/taskflow/blob/main/backend/models/Task.js): `backend/models/Task.js`
- [User schema](https://github.com/rudra20-04/taskflow/blob/main/backend/models/User.js): `backend/models/User.js`
- [Database connection](https://github.com/rudra20-04/taskflow/blob/main/backend/config/db.js): `backend/config/db.js`

### Other components

- **Task manager user**
- **MongoDB**

## Connections

- Task manager user → App routing: uses (evidence: `README.md`)
- App routing → Navigation: renders (evidence: `frontend/src/App.jsx`)
- App routing → Login page: routes to (evidence: `frontend/src/App.jsx`)
- App routing → Signup page: routes to (evidence: `frontend/src/App.jsx`)
- App routing → Task dashboard: protects route (evidence: `frontend/src/App.jsx`)
- Theme bootstrap → App routing: bootstraps (evidence: `frontend/src/main.jsx`)
- Login page → HTTP client: submits credentials (evidence: `frontend/src/pages/Login.jsx`)
- Signup page → HTTP client: submits registration (evidence: `frontend/src/pages/Signup.jsx`)
- Task dashboard → HTTP client: requests tasks (evidence: `frontend/src/pages/Dashboard.jsx`)
- HTTP client → Express API: sends API requests (evidence: `frontend/src/api/api.js`)
- Express API → Auth routes: mounts routes (evidence: `backend/index.js`)
- Express API → Task routes: mounts routes (evidence: `backend/index.js`)
- Auth routes → Signup and login: dispatches (evidence: `backend/routes/authRoutes.js`)
- Task routes → JWT guard: guards tasks (evidence: `backend/routes/taskRoutes.js`)
- Task routes → Task operations: dispatches (evidence: `backend/routes/taskRoutes.js`)
- Signup and login → User schema: reads and creates users (evidence: `backend/controllers/authController.js`)
- Task operations → Task schema: reads and writes tasks (evidence: `backend/controllers/taskController.js`)
- JWT guard → Signup and login: verifies JWTs issued by
- Database connection → MongoDB: connects (evidence: `backend/config/db.js`)
- Task schema → MongoDB: persists task records
- User schema → MongoDB: persists user records