# mdsakifhossain/llm-tracker architecture

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

- Interactive diagram: https://gitdiagram.com/mdsakifhossain/llm-tracker
- Repository: https://github.com/mdsakifhossain/llm-tracker

## Overview

llm-tracker is a web app for recording and reviewing local LLM models, including architecture, load status, performance, and evaluation details. Users can browse the model list, submit a model through a secret-protected form, or view prompt/settings material. The browser loads model records through shared client state; submissions pass through the API’s validation and persistence flow. Source excerpts establish the form and API paths, but not the internals of the home/list rendering, so that wiring is left unspecified.

Main entry points: [`client/src/main.jsx`](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/main.jsx) (Client entry and routes), [`api/routes/models.js`](https://github.com/mdsakifhossain/llm-tracker/blob/main/api/routes/models.js) (Model API routes), [`client/src/pages/AddModel.jsx`](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/AddModel.jsx) (Add model form), [`client/src/contexts/ModelsContext.jsx`](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/contexts/ModelsContext.jsx) (Models context)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web client"]
  node_entry["Client entry and routes<br/>[main.jsx]"]
  node_root["Root layout<br/>[Root.jsx]"]
  node_header["Navigation header<br/>[Header.jsx]"]
  node_switcher["Page switcher<br/>[PageSwitcher.jsx]"]
  node_home["Model home<br/>[HomePage.jsx]"]
  node_render["Model rendering<br/>[RenderModels.jsx]"]
  node_add["Add model form<br/>[AddModel.jsx]"]
  node_notes["Prompt reference<br/>[Notes.jsx]"]
  node_context["Models context<br/>[ModelsContext.jsx]"]
  node_message["Message display<br/>[MessageBox.jsx]"]
  node_theme["Theme switcher<br/>[ThemeSwitcher.jsx]"]
end

subgraph group_api["API service"]
  node_server["Express app<br/>[index.js]"]
  node_routes["Model API routes<br/>[models.js]"]
  node_validator["Model validation<br/>[modelsValidator.js]"]
end

subgraph group_persistence["Model persistence"]
  node_dbmodule["Mongo connection<br/>[db.js]"]
  node_collection[("Models collection<br/>[db.js]")]
end

node_user(("User"))
node_mongodb[("MongoDB")]

node_user -->|"opens app"| node_entry
node_entry -->|"routes to"| node_root
node_entry -->|"provides state"| node_context
node_root -->|"renders"| node_header
node_header -->|"renders"| node_switcher
node_entry -->|"routes to"| node_home
node_entry -->|"routes to"| node_add
node_entry -->|"routes to"| node_notes
node_context -->|"fetches models"| node_routes
node_add -->|"posts model"| node_routes
node_add -->|"updates state"| node_context
node_server -->|"connects on start"| node_dbmodule
node_server -->|"mounts routes"| node_routes
node_routes -->|"validates payload"| node_validator
node_routes -->|"uses collection"| node_dbmodule
node_dbmodule -->|"connects to"| node_mongodb
node_routes -->|"reads and writes"| node_collection

click node_entry "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/main.jsx"
click node_root "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/layouts/Root.jsx"
click node_header "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/Header.jsx"
click node_switcher "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/PageSwitcher.jsx"
click node_home "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/HomePage.jsx"
click node_render "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/RenderModels.jsx"
click node_add "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/AddModel.jsx"
click node_notes "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/Notes.jsx"
click node_context "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/contexts/ModelsContext.jsx"
click node_message "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/MessageBox.jsx"
click node_theme "https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/ThemeSwitcher.jsx"
click node_server "https://github.com/mdsakifhossain/llm-tracker/blob/main/api/index.js"
click node_routes "https://github.com/mdsakifhossain/llm-tracker/blob/main/api/routes/models.js"
click node_validator "https://github.com/mdsakifhossain/llm-tracker/blob/main/api/validators/modelsValidator.js"
click node_dbmodule "https://github.com/mdsakifhossain/llm-tracker/blob/main/api/db.js"
click node_collection "https://github.com/mdsakifhossain/llm-tracker/blob/main/api/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_entry,node_root,node_header,node_switcher,node_home,node_render,node_add,node_notes,node_context,node_message,node_theme,node_user toneBlue
class node_server,node_routes,node_validator,node_mongodb toneAmber
class node_dbmodule,node_collection toneMint
```

## Components

### Web client

- [Client entry and routes](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/main.jsx): `client/src/main.jsx`
- [Root layout](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/layouts/Root.jsx): `client/src/layouts/Root.jsx`
- [Navigation header](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/Header.jsx): `client/src/components/Header.jsx`
- [Page switcher](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/PageSwitcher.jsx): `client/src/components/PageSwitcher.jsx`
- [Model home](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/HomePage.jsx): `client/src/pages/HomePage.jsx`
- [Model rendering](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/RenderModels.jsx): `client/src/components/RenderModels.jsx`
- [Add model form](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/AddModel.jsx): `client/src/pages/AddModel.jsx`
- [Prompt reference](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/pages/Notes.jsx): `client/src/pages/Notes.jsx`
- [Models context](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/contexts/ModelsContext.jsx): `client/src/contexts/ModelsContext.jsx`
- [Message display](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/MessageBox.jsx): `client/src/components/MessageBox.jsx`
- [Theme switcher](https://github.com/mdsakifhossain/llm-tracker/blob/main/client/src/components/ThemeSwitcher.jsx): `client/src/components/ThemeSwitcher.jsx`

### API service

- [Express app](https://github.com/mdsakifhossain/llm-tracker/blob/main/api/index.js): `api/index.js`
- [Model API routes](https://github.com/mdsakifhossain/llm-tracker/blob/main/api/routes/models.js): `api/routes/models.js`
- [Model validation](https://github.com/mdsakifhossain/llm-tracker/blob/main/api/validators/modelsValidator.js): `api/validators/modelsValidator.js`

### Model persistence

- [Mongo connection](https://github.com/mdsakifhossain/llm-tracker/blob/main/api/db.js): `api/db.js`
- [Models collection](https://github.com/mdsakifhossain/llm-tracker/blob/main/api/db.js): `api/db.js`

### Other components

- **User**
- **MongoDB**

## Connections

- User → Client entry and routes: opens app
- Client entry and routes → Root layout: routes to
- Client entry and routes → Models context: provides state
- Root layout → Navigation header: renders
- Navigation header → Page switcher: renders
- Client entry and routes → Model home: routes to
- Client entry and routes → Add model form: routes to
- Client entry and routes → Prompt reference: routes to
- Models context → Model API routes: fetches models
- Add model form → Model API routes: posts model
- Add model form → Models context: updates state
- Express app → Mongo connection: connects on start
- Express app → Model API routes: mounts routes
- Model API routes → Model validation: validates payload
- Model API routes → Mongo connection: uses collection
- Mongo connection → MongoDB: connects to
- Model API routes → Models collection: reads and writes