# nnanna-1/budget-app architecture

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

- Interactive diagram: https://gitdiagram.com/nnanna-1/budget-app
- Repository: https://github.com/nnanna-1/budget-app

## Overview

Budget App is a personal-finance tracker. Users register or log in, set a budget profile during onboarding, then view goals and transaction activity on the dashboard; they can add and delete transactions. The React client calls a FastAPI API that authenticates users and persists profiles and transactions in PostgreSQL. The README also lists subscription tracking and what-if planning, but their implementation is not visible in the sampled source, so those capabilities are shown without asserted runtime connections. Connections between frontend requests and backend routes are not directly evidenced in the excerpts.

Main entry points: [`frontend/src/App.jsx`](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/App.jsx) (Route application), [`frontend/src/pages/Dashboard.jsx`](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Dashboard.jsx) (Dashboard), [`backend/app/database.py`](https://github.com/nnanna-1/budget-app/blob/main/backend/app/database.py) (Database session), [`frontend/src/api.js`](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/api.js) (API client)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web client"]
  node_app["Route application<br/>[App.jsx]"]
  node_authctx["Auth context<br/>[AuthContext.jsx]"]
  node_api_client["API client<br/>[api.js]"]
  node_login["Login<br/>[Login.jsx]"]
  node_register["Registration<br/>[Register.jsx]"]
  node_onboarding["Onboarding<br/>[Onboarding.jsx]"]
  node_dashboard["Dashboard<br/>[Dashboard.jsx]"]
  node_add_transaction["Add transaction<br/>[AddTransaction.jsx]"]
  node_goal_progress["Goal progress<br/>[GoalProgress.jsx]"]
  node_spending_chart["Spending chart<br/>[SpendingChart.jsx]"]
end

subgraph group_api["API and identity"]
  node_api_entry["FastAPI entry<br/>[main.py]"]
  node_auth_routes["Authentication routes<br/>[auth.py]"]
  node_token_auth["JWT verification<br/>[oauth2.py]"]
end

subgraph group_domain["Finance domain"]
  node_subscriptions["Subscription tracker"]
  node_planner["Scenario planner"]
  node_profile_routes["Profile routes<br/>[budget_profile.py]"]
  node_transaction_routes["Transaction routes<br/>[transaction.py]"]
end

subgraph group_persistence["Persistence"]
  node_user_model["User model<br/>[user.py]"]
  node_profile_model["Budget profile model<br/>[budget_profile.py]"]
  node_transaction_model["Transaction model<br/>[transaction.py]"]
  node_database["Database session<br/>[database.py]"]
  node_postgres[("PostgreSQL")]
end

node_user(("Budget user"))

node_user -->|"uses"| node_app
node_app -->|"reads auth"| node_authctx
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_register
node_app -->|"routes to"| node_onboarding
node_app -->|"routes to"| node_dashboard
node_login -->|"updates session"| node_authctx
node_login -->|"requests auth"| node_api_client
node_register -->|"submits details"| node_api_client
node_onboarding -->|"submits profile"| node_api_client
node_dashboard -->|"loads data"| node_api_client
node_dashboard -->|"renders"| node_add_transaction
node_dashboard -->|"renders"| node_goal_progress
node_dashboard -->|"renders"| node_spending_chart
node_add_transaction -->|"submits transaction"| node_api_client
node_api_entry -->|"mounts routes"| node_auth_routes
node_api_entry -->|"mounts routes"| node_profile_routes
node_api_entry -->|"mounts routes"| node_transaction_routes
node_auth_routes -->|"uses identity"| node_token_auth
node_token_auth -->|"looks up user"| node_user_model
node_auth_routes -->|"queries and creates"| node_user_model
node_profile_routes -->|"requires identity"| node_token_auth
node_profile_routes -->|"reads and writes"| node_profile_model
node_transaction_routes -->|"reads and writes"| node_transaction_model
node_transaction_routes -->|"requires identity"| node_token_auth
node_user_model -->|"uses ORM base"| node_database
node_profile_model -->|"uses ORM base"| node_database
node_transaction_model -->|"uses ORM base"| node_database
node_api_entry -->|"creates tables"| node_database
node_database -->|"connects"| node_postgres
node_user -.->|"tracks subscriptions"| node_subscriptions
node_user -.->|"models scenarios"| node_planner

click node_app "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/App.jsx"
click node_authctx "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/context/AuthContext.jsx"
click node_api_client "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/api.js"
click node_login "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Login.jsx"
click node_register "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Register.jsx"
click node_onboarding "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Onboarding.jsx"
click node_dashboard "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Dashboard.jsx"
click node_add_transaction "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/components/AddTransaction.jsx"
click node_goal_progress "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/components/GoalProgress.jsx"
click node_spending_chart "https://github.com/nnanna-1/budget-app/blob/main/frontend/src/components/SpendingChart.jsx"
click node_subscriptions "https://github.com/nnanna-1/budget-app/tree/main/frontend/src"
click node_planner "https://github.com/nnanna-1/budget-app/tree/main/frontend/src"
click node_api_entry "https://github.com/nnanna-1/budget-app/blob/main/backend/app/main.py"
click node_auth_routes "https://github.com/nnanna-1/budget-app/blob/main/backend/app/routers/auth.py"
click node_token_auth "https://github.com/nnanna-1/budget-app/blob/main/backend/app/oauth2.py"
click node_profile_routes "https://github.com/nnanna-1/budget-app/blob/main/backend/app/routers/budget_profile.py"
click node_transaction_routes "https://github.com/nnanna-1/budget-app/blob/main/backend/app/routers/transaction.py"
click node_user_model "https://github.com/nnanna-1/budget-app/blob/main/backend/app/models/user.py"
click node_profile_model "https://github.com/nnanna-1/budget-app/blob/main/backend/app/models/budget_profile.py"
click node_transaction_model "https://github.com/nnanna-1/budget-app/blob/main/backend/app/models/transaction.py"
click node_database "https://github.com/nnanna-1/budget-app/blob/main/backend/app/database.py"

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_api_client,node_login,node_register,node_onboarding,node_dashboard,node_add_transaction,node_goal_progress,node_spending_chart,node_user toneBlue
class node_api_entry,node_auth_routes,node_token_auth toneAmber
class node_subscriptions,node_planner,node_profile_routes,node_transaction_routes toneMint
class node_user_model,node_profile_model,node_transaction_model,node_database,node_postgres toneRose
```

## Components

### Web client

- [Route application](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Auth context](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/context/AuthContext.jsx): `frontend/src/context/AuthContext.jsx`
- [API client](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/api.js): `frontend/src/api.js`
- [Login](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Login.jsx): `frontend/src/pages/Login.jsx`
- [Registration](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Register.jsx): `frontend/src/pages/Register.jsx`
- [Onboarding](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Onboarding.jsx): `frontend/src/pages/Onboarding.jsx`
- [Dashboard](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/pages/Dashboard.jsx): `frontend/src/pages/Dashboard.jsx`
- [Add transaction](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/components/AddTransaction.jsx): `frontend/src/components/AddTransaction.jsx`
- [Goal progress](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/components/GoalProgress.jsx): `frontend/src/components/GoalProgress.jsx`
- [Spending chart](https://github.com/nnanna-1/budget-app/blob/main/frontend/src/components/SpendingChart.jsx): `frontend/src/components/SpendingChart.jsx`

### API and identity

- [FastAPI entry](https://github.com/nnanna-1/budget-app/blob/main/backend/app/main.py): `backend/app/main.py`
- [Authentication routes](https://github.com/nnanna-1/budget-app/blob/main/backend/app/routers/auth.py): `backend/app/routers/auth.py`
- [JWT verification](https://github.com/nnanna-1/budget-app/blob/main/backend/app/oauth2.py): `backend/app/oauth2.py`

### Finance domain

- [Subscription tracker](https://github.com/nnanna-1/budget-app/tree/main/frontend/src): `frontend/src`
- [Scenario planner](https://github.com/nnanna-1/budget-app/tree/main/frontend/src): `frontend/src`
- [Profile routes](https://github.com/nnanna-1/budget-app/blob/main/backend/app/routers/budget_profile.py): `backend/app/routers/budget_profile.py`
- [Transaction routes](https://github.com/nnanna-1/budget-app/blob/main/backend/app/routers/transaction.py): `backend/app/routers/transaction.py`

### Persistence

- [User model](https://github.com/nnanna-1/budget-app/blob/main/backend/app/models/user.py): `backend/app/models/user.py`
- [Budget profile model](https://github.com/nnanna-1/budget-app/blob/main/backend/app/models/budget_profile.py): `backend/app/models/budget_profile.py`
- [Transaction model](https://github.com/nnanna-1/budget-app/blob/main/backend/app/models/transaction.py): `backend/app/models/transaction.py`
- [Database session](https://github.com/nnanna-1/budget-app/blob/main/backend/app/database.py): `backend/app/database.py`
- **PostgreSQL**

### Other components

- **Budget user**

## Connections

- Budget user → Route application: uses (evidence: `frontend/src/App.jsx`)
- Route application → Auth context: reads auth (evidence: `frontend/src/App.jsx`)
- Route application → Login: routes to (evidence: `frontend/src/App.jsx`)
- Route application → Registration: routes to (evidence: `frontend/src/App.jsx`)
- Route application → Onboarding: routes to (evidence: `frontend/src/App.jsx`)
- Route application → Dashboard: routes to (evidence: `frontend/src/App.jsx`)
- Login → Auth context: updates session (evidence: `frontend/src/pages/Login.jsx`)
- Login → API client: requests auth (evidence: `frontend/src/pages/Login.jsx`)
- Registration → API client: submits details (evidence: `frontend/src/pages/Register.jsx`)
- Onboarding → API client: submits profile (evidence: `frontend/src/pages/Onboarding.jsx`)
- Dashboard → API client: loads data (evidence: `frontend/src/pages/Dashboard.jsx`)
- Dashboard → Add transaction: renders (evidence: `frontend/src/pages/Dashboard.jsx`)
- Dashboard → Goal progress: renders (evidence: `frontend/src/pages/Dashboard.jsx`)
- Dashboard → Spending chart: renders (evidence: `frontend/src/pages/Dashboard.jsx`)
- Add transaction → API client: submits transaction (evidence: `frontend/src/components/AddTransaction.jsx`)
- FastAPI entry → Authentication routes: mounts routes (evidence: `backend/app/main.py`)
- FastAPI entry → Profile routes: mounts routes (evidence: `backend/app/main.py`)
- FastAPI entry → Transaction routes: mounts routes (evidence: `backend/app/main.py`)
- Authentication routes → JWT verification: uses identity (evidence: `backend/app/routers/auth.py`)
- JWT verification → User model: looks up user (evidence: `backend/app/oauth2.py`)
- Authentication routes → User model: queries and creates (evidence: `backend/app/routers/auth.py`)
- Profile routes → JWT verification: requires identity (evidence: `backend/app/routers/budget_profile.py`)
- Profile routes → Budget profile model: reads and writes (evidence: `backend/app/routers/budget_profile.py`)
- Transaction routes → Transaction model: reads and writes (evidence: `backend/app/routers/transaction.py`)
- Transaction routes → JWT verification: requires identity (evidence: `backend/app/routers/transaction.py`)
- User model → Database session: uses ORM base (evidence: `backend/app/models/user.py`)
- Budget profile model → Database session: uses ORM base (evidence: `backend/app/models/budget_profile.py`)
- Transaction model → Database session: uses ORM base (evidence: `backend/app/models/transaction.py`)
- FastAPI entry → Database session: creates tables (evidence: `backend/app/main.py`)
- Database session → PostgreSQL: connects (evidence: `backend/app/database.py`)
- Budget user → Subscription tracker: tracks subscriptions (evidence: `README.md`)
- Budget user → Scenario planner: models scenarios (evidence: `README.md`)