# aihades/metrics-raspberry-api architecture

> Architecture diagram of the GitHub repository aihades/metrics-raspberry-api, 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/aihades/metrics-raspberry-api
- Repository: https://github.com/aihades/metrics-raspberry-api

## Overview

This is a Linux system-metrics dashboard. A browser loads the metrics page, opens a WebSocket, and receives periodic temperature, battery, memory, and disk readings that the frontend displays. The backend gathers readings through psutil, packages them in a schema, and serves the page and static assets. The tree and sampled source support this main workflow; no README was provided, and unsampled details are omitted.

Main entry points: [`backend/api/routers/metrics_router.py`](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/api/routers/metrics_router.py) (Metrics routes), [`backend/main.py`](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/main.py) (FastAPI app), [`backend/metrics.py`](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/metrics.py) (Metrics collector), [`frontend/static/js/mainpage.js`](https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/static/js/mainpage.js) (Dashboard behavior)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Browser UI"]
  node_template["Dashboard template<br/>[index.html]"]
  node_javascript["Dashboard behavior<br/>[mainpage.js]"]
  node_styles["Dashboard styles<br/>[mainpage.css]"]
end

subgraph group_api["Web API"]
  node_app["FastAPI app<br/>[main.py]"]
  node_router["Metrics routes<br/>[metrics_router.py]"]
  node_settings["Frontend paths<br/>[config.py]"]
  node_schema["Metrics schema<br/>[metrics.py]"]
end

subgraph group_collect["Metric Collection"]
  node_collector["Metrics collector<br/>[metrics.py]"]
end

node_browser(("Browser"))
node_psutil["psutil system readings"]

node_app -->|"registers routes"| node_router
node_browser -->|"requests root"| node_app
node_app -->|"redirects to metrics"| node_browser
node_browser -->|"requests page"| node_router
node_router -->|"reads paths"| node_settings
node_router -->|"renders page"| node_template
node_router -->|"serves page"| node_browser
node_browser -->|"opens WebSocket"| node_router
node_router -->|"reads metrics"| node_collector
node_collector -->|"queries system"| node_psutil
node_collector -->|"returns readings"| node_router
node_router -->|"builds payload"| node_schema
node_router -->|"sends JSON"| node_browser
node_browser -->|"runs script"| node_javascript
node_javascript -->|"updates display"| node_browser
node_router -->|"serves static asset"| node_javascript
node_router -->|"serves static asset"| node_styles

click node_app "https://github.com/aihades/metrics-raspberry-api/blob/master/backend/main.py"
click node_router "https://github.com/aihades/metrics-raspberry-api/blob/master/backend/api/routers/metrics_router.py"
click node_settings "https://github.com/aihades/metrics-raspberry-api/blob/master/backend/src/config.py"
click node_schema "https://github.com/aihades/metrics-raspberry-api/blob/master/backend/src/schemas/metrics.py"
click node_collector "https://github.com/aihades/metrics-raspberry-api/blob/master/backend/metrics.py"
click node_template "https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/templates/index.html"
click node_javascript "https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/static/js/mainpage.js"
click node_styles "https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/static/css/mainpage.css"

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_template,node_javascript,node_styles,node_browser toneBlue
class node_app,node_router,node_settings,node_schema toneAmber
class node_collector toneMint
class node_psutil toneIndigo
```

## Components

### Browser UI

- [Dashboard template](https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/templates/index.html): `frontend/templates/index.html`
- [Dashboard behavior](https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/static/js/mainpage.js): `frontend/static/js/mainpage.js`
- [Dashboard styles](https://github.com/aihades/metrics-raspberry-api/blob/master/frontend/static/css/mainpage.css): `frontend/static/css/mainpage.css`

### Web API

- [FastAPI app](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/main.py): `backend/main.py`
- [Metrics routes](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/api/routers/metrics_router.py): `backend/api/routers/metrics_router.py`
- [Frontend paths](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/src/config.py): `backend/src/config.py`
- [Metrics schema](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/src/schemas/metrics.py): `backend/src/schemas/metrics.py`

### Metric Collection

- [Metrics collector](https://github.com/aihades/metrics-raspberry-api/blob/master/backend/metrics.py): `backend/metrics.py`

### Other components

- **Browser**
- **psutil system readings**

## Connections

- FastAPI app → Metrics routes: registers routes
- Browser → FastAPI app: requests root
- FastAPI app → Browser: redirects to metrics
- Browser → Metrics routes: requests page
- Metrics routes → Frontend paths: reads paths
- Metrics routes → Dashboard template: renders page
- Metrics routes → Browser: serves page
- Browser → Metrics routes: opens WebSocket
- Metrics routes → Metrics collector: reads metrics
- Metrics collector → psutil system readings: queries system
- Metrics collector → Metrics routes: returns readings
- Metrics routes → Metrics schema: builds payload
- Metrics routes → Browser: sends JSON
- Browser → Dashboard behavior: runs script
- Dashboard behavior → Browser: updates display
- Metrics routes → Dashboard behavior: serves static asset
- Metrics routes → Dashboard styles: serves static asset