# hexagondigitalservices/expensetracker architecture

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

- Interactive diagram: https://gitdiagram.com/hexagondigitalservices/expensetracker
- Repository: https://github.com/hexagondigitalservices/expensetracker

## Overview

This repository implements a personal-finance tracker for recording income and expenses, reviewing transactions over time, and viewing financial summaries. The main workflow runs from the browser through the React application: users manage transactions in the income or expense views, while the shared layout fetches and refreshes transaction lists. The backend controllers provide transaction and overview operations, with MongoDB models defining income and expense records. Dashboard calculations and export/chart capabilities are represented where supported by the supplied excerpts; backend routing and authentication implementation were not present in the sampled files.

Main entry points: [`frontend/src/components/Layout.jsx`](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Layout.jsx) (Transaction workspace), [`frontend/src/App.jsx`](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/App.jsx) (App and auth state), [`frontend/src/pages/Income.jsx`](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Income.jsx) (Income management), [`frontend/src/pages/Expense.jsx`](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Expense.jsx) (Expense management)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_ui["Web application"]
  node_app["App and auth state<br/>[App.jsx]"]
  node_layout["Transaction workspace<br/>[Layout.jsx]"]
  node_dashboard["Dashboard summaries<br/>[Dashboard.jsx]"]
  node_income_ui["Income management<br/>[Income.jsx]"]
  node_expense_ui["Expense management<br/>[Expense.jsx]"]
  node_profile["Profile view<br/>[Profile.jsx]"]
  node_login["Login<br/>[Login.jsx]"]
  node_signup["Signup<br/>[Signup.jsx]"]
  node_timeframe["Timeframe controls<br/>[TimeFrame.jsx]"]
  node_transaction_item["Transaction display"]
  node_helpers["Date and chart helpers<br/>[Helpers.jsx]"]
end

subgraph group_api["Finance backend"]
  node_dashboard_api["Dashboard calculations"]
  node_income_api["Income operations"]
  node_expense_api["Expense operations"]
  node_date_filter["Date range selection<br/>[dateFilter.js]"]
end

subgraph group_data["Transaction storage"]
  node_income_model[("Income records<br/>[incomeModel.js]")]
  node_expense_model[("Expense records<br/>[expenseModel.js]")]
end

node_person(("Finance user"))

node_person -->|"uses"| node_app
node_app -->|"hosts workspace"| node_layout
node_app -->|"presents login"| node_login
node_app -->|"presents signup"| node_signup
node_layout -->|"shows summaries"| node_dashboard
node_layout -->|"routes to"| node_income_ui
node_layout -->|"routes to"| node_expense_ui
node_layout -->|"routes to"| node_profile
node_layout -->|"fetches income"| node_income_api
node_layout -->|"fetches expenses"| node_expense_api
node_income_ui -->|"requests operations"| node_income_api
node_expense_ui -->|"requests operations"| node_expense_api
node_dashboard -->|"requests summary"| node_dashboard_api
node_income_ui -->|"selects range"| node_timeframe
node_expense_ui -->|"selects range"| node_timeframe
node_income_ui -->|"builds chart points"| node_helpers
node_expense_ui -->|"builds chart points"| node_helpers
node_layout -->|"renders transactions"| node_transaction_item
node_income_api -->|"reads and writes"| node_income_model
node_expense_api -->|"reads and writes"| node_expense_model
node_expense_api -->|"selects date range"| node_date_filter
node_dashboard_api -->|"aggregates income"| node_income_model
node_dashboard_api -->|"aggregates expenses"| node_expense_model

click node_app "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/App.jsx"
click node_layout "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Layout.jsx"
click node_dashboard "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Dashboard.jsx"
click node_income_ui "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Income.jsx"
click node_expense_ui "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Expense.jsx"
click node_profile "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Profile.jsx"
click node_login "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Login.jsx"
click node_signup "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Signup.jsx"
click node_timeframe "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/TimeFrame.jsx"
click node_transaction_item "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/TransactionItem.jsx"
click node_helpers "https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Helpers.jsx"
click node_dashboard_api "https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/controllers/dashboardController.js"
click node_income_api "https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/controllers/incomeController.js"
click node_expense_api "https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/controllers/expenseController.js"
click node_date_filter "https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/utils/dateFilter.js"
click node_income_model "https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/models/incomeModel.js"
click node_expense_model "https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/models/expenseModel.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_layout,node_dashboard,node_income_ui,node_expense_ui,node_profile,node_login,node_signup,node_timeframe,node_transaction_item,node_helpers,node_person toneBlue
class node_dashboard_api,node_income_api,node_expense_api,node_date_filter toneAmber
class node_income_model,node_expense_model toneMint
```

## Components

### Web application

- [App and auth state](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Transaction workspace](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Layout.jsx): `frontend/src/components/Layout.jsx`
- [Dashboard summaries](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Dashboard.jsx): `frontend/src/pages/Dashboard.jsx`
- [Income management](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Income.jsx): `frontend/src/pages/Income.jsx`
- [Expense management](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Expense.jsx): `frontend/src/pages/Expense.jsx`
- [Profile view](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/pages/Profile.jsx): `frontend/src/pages/Profile.jsx`
- [Login](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Login.jsx): `frontend/src/components/Login.jsx`
- [Signup](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Signup.jsx): `frontend/src/components/Signup.jsx`
- [Timeframe controls](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/TimeFrame.jsx): `frontend/src/components/TimeFrame.jsx`
- [Transaction display](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/TransactionItem.jsx): `frontend/src/components/TransactionItem.jsx`
- [Date and chart helpers](https://github.com/hexagondigitalservices/expensetracker/blob/main/frontend/src/components/Helpers.jsx): `frontend/src/components/Helpers.jsx`

### Finance backend

- [Dashboard calculations](https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/controllers/dashboardController.js): `backend/controllers/dashboardController.js`
- [Income operations](https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/controllers/incomeController.js): `backend/controllers/incomeController.js`
- [Expense operations](https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/controllers/expenseController.js): `backend/controllers/expenseController.js`
- [Date range selection](https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/utils/dateFilter.js): `backend/utils/dateFilter.js`

### Transaction storage

- [Income records](https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/models/incomeModel.js): `backend/models/incomeModel.js`
- [Expense records](https://github.com/hexagondigitalservices/expensetracker/blob/main/backend/models/expenseModel.js): `backend/models/expenseModel.js`

### Other components

- **Finance user**

## Connections

- Finance user → App and auth state: uses
- App and auth state → Transaction workspace: hosts workspace
- App and auth state → Login: presents login
- App and auth state → Signup: presents signup
- Transaction workspace → Dashboard summaries: shows summaries
- Transaction workspace → Income management: routes to
- Transaction workspace → Expense management: routes to
- Transaction workspace → Profile view: routes to
- Transaction workspace → Income operations: fetches income
- Transaction workspace → Expense operations: fetches expenses
- Income management → Income operations: requests operations
- Expense management → Expense operations: requests operations
- Dashboard summaries → Dashboard calculations: requests summary
- Income management → Timeframe controls: selects range
- Expense management → Timeframe controls: selects range
- Income management → Date and chart helpers: builds chart points
- Expense management → Date and chart helpers: builds chart points
- Transaction workspace → Transaction display: renders transactions
- Income operations → Income records: reads and writes
- Expense operations → Expense records: reads and writes
- Expense operations → Date range selection: selects date range
- Dashboard calculations → Income records: aggregates income
- Dashboard calculations → Expense records: aggregates expenses