# rinka-mod/jdm-legends-app architecture

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

- Interactive diagram: https://gitdiagram.com/rinka-mod/jdm-legends-app
- Repository: https://github.com/rinka-mod/jdm-legends-app

## Overview

JDM LEGENDS is a full-stack digital library for Japanese performance cars, with historical and cultural content, account-based favorites, and an FAQ assistant. Visitors browse and filter the library, open car profiles, and explore eras and culture; registered users can save cars to a synced garage, while newsletter and assistant actions use content APIs. The React app calls the Express API, whose route handlers query SQLite through shared persistence code. Some feature wiring is represented from the README because its route and page implementations were not sampled.

Main entry points: [`client/src/lib/api.ts`](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/lib/api.ts) (API Client), [`client/src/App.tsx`](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/App.tsx) (App Routing), [`server/src/index.ts`](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/index.ts) (Express API), [`client/src/lib/auth.tsx`](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/lib/auth.tsx) (Auth Context)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_browse["Explore JDM"]
  node_app["App Routing<br/>[App.tsx]"]
  node_home["Home Experience<br/>[HomePage.tsx]"]
  node_library["Car Library<br/>[Library.tsx]"]
  node_filters["Library Filters"]
  node_carpage["Car Profiles<br/>[CarPage.tsx]"]
end

subgraph group_account["Accounts and Garage"]
  node_garageui["Garage and Newsletter<br/>[GarageSection.tsx]"]
  node_authpages["Account Pages<br/>[LoginPage.tsx]"]
  node_garagepage["Personal Garage<br/>[MyGaragePage.tsx]"]
  node_authstate["Auth Context<br/>[auth.tsx]"]
end

subgraph group_content["Editorial Content"]
  node_heritage["Timeline and Culture<br/>[Heritage.tsx]"]
  node_assistant["FAQ Assistant<br/>[ChatAssistant.tsx]"]
end

subgraph group_backend["API and Storage"]
  node_clientapi["API Client<br/>[api.ts]"]
  node_server["Express API<br/>[index.ts]"]
  node_caroutes["Car Routes<br/>[cars.ts]"]
  node_contentroutes["Content Routes<br/>[content.ts]"]
  node_authroutes["Auth Routes<br/>[auth.ts]"]
  node_garageroutes["Garage Routes<br/>[garage.ts]"]
  node_repository["Query Repository<br/>[repository.ts]"]
  node_database[("SQLite Database<br/>[db.ts]")]
end

node_visitor(("Visitor"))

node_visitor -->|"uses"| node_app
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_carpage
node_app -->|"routes to"| node_authpages
node_app -->|"routes to"| node_garagepage
node_home -->|"renders"| node_library
node_home -->|"presents"| node_heritage
node_library -->|"uses"| node_filters
node_filters -->|"fetches cars"| node_clientapi
node_carpage -->|"loads profile"| node_clientapi
node_assistant -->|"asks FAQ"| node_clientapi
node_garageui -->|"submits email"| node_clientapi
node_authpages -->|"signs in"| node_authstate
node_garagepage -->|"reads session"| node_authstate
node_garageui -->|"reads favorites"| node_authstate
node_authstate -->|"authenticates"| node_clientapi
node_clientapi -->|"sends API requests"| node_server
node_server -->|"dispatches"| node_caroutes
node_server -->|"dispatches"| node_contentroutes
node_server -->|"dispatches"| node_authroutes
node_server -->|"dispatches"| node_garageroutes
node_caroutes -->|"queries cars"| node_repository
node_contentroutes -->|"queries content"| node_repository
node_garageroutes -->|"loads car details"| node_repository
node_garageroutes -->|"reads and writes favorites"| node_database
node_authroutes -->|"reads and writes accounts"| node_database
node_repository -->|"queries"| node_database

click node_app "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/App.tsx"
click node_home "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/HomePage.tsx"
click node_library "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/Library.tsx"
click node_filters "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/library/useLibraryFilters.ts"
click node_carpage "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/CarPage.tsx"
click node_heritage "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/Heritage.tsx"
click node_assistant "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/ChatAssistant.tsx"
click node_garageui "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/GarageSection.tsx"
click node_authpages "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/LoginPage.tsx"
click node_garagepage "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/MyGaragePage.tsx"
click node_authstate "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/lib/auth.tsx"
click node_clientapi "https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/lib/api.ts"
click node_server "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/index.ts"
click node_caroutes "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/cars.ts"
click node_contentroutes "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/content.ts"
click node_authroutes "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/auth.ts"
click node_garageroutes "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/garage.ts"
click node_repository "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/repository.ts"
click node_database "https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/db.ts"

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_home,node_library,node_filters,node_carpage toneBlue
class node_garageui,node_authpages,node_garagepage,node_authstate toneAmber
class node_heritage,node_assistant toneMint
class node_clientapi,node_server,node_caroutes,node_contentroutes,node_authroutes,node_garageroutes,node_repository,node_database toneRose
class node_visitor toneIndigo
```

## Components

### Explore JDM

- [App Routing](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/App.tsx): `client/src/App.tsx`
- [Home Experience](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/HomePage.tsx): `client/src/pages/HomePage.tsx`
- [Car Library](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/Library.tsx): `client/src/components/Library.tsx`
- [Library Filters](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/library/useLibraryFilters.ts): `client/src/components/library/useLibraryFilters.ts`
- [Car Profiles](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/CarPage.tsx): `client/src/pages/CarPage.tsx`

### Accounts and Garage

- [Garage and Newsletter](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/GarageSection.tsx): `client/src/components/GarageSection.tsx`
- [Account Pages](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/LoginPage.tsx): `client/src/pages/LoginPage.tsx`
- [Personal Garage](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/pages/MyGaragePage.tsx): `client/src/pages/MyGaragePage.tsx`
- [Auth Context](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/lib/auth.tsx): `client/src/lib/auth.tsx`

### Editorial Content

- [Timeline and Culture](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/Heritage.tsx): `client/src/components/Heritage.tsx`
- [FAQ Assistant](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/components/ChatAssistant.tsx): `client/src/components/ChatAssistant.tsx`

### API and Storage

- [API Client](https://github.com/rinka-mod/jdm-legends-app/blob/main/client/src/lib/api.ts): `client/src/lib/api.ts`
- [Express API](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/index.ts): `server/src/index.ts`
- [Car Routes](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/cars.ts): `server/src/routes/cars.ts`
- [Content Routes](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/content.ts): `server/src/routes/content.ts`
- [Auth Routes](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/auth.ts): `server/src/routes/auth.ts`
- [Garage Routes](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/routes/garage.ts): `server/src/routes/garage.ts`
- [Query Repository](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/repository.ts): `server/src/repository.ts`
- [SQLite Database](https://github.com/rinka-mod/jdm-legends-app/blob/main/server/src/db.ts): `server/src/db.ts`

### Other components

- **Visitor**

## Connections

- Visitor → App Routing: uses
- App Routing → Home Experience: routes to
- App Routing → Car Profiles: routes to
- App Routing → Account Pages: routes to
- App Routing → Personal Garage: routes to
- Home Experience → Car Library: renders
- Home Experience → Timeline and Culture: presents
- Car Library → Library Filters: uses
- Library Filters → API Client: fetches cars
- Car Profiles → API Client: loads profile
- FAQ Assistant → API Client: asks FAQ
- Garage and Newsletter → API Client: submits email
- Account Pages → Auth Context: signs in
- Personal Garage → Auth Context: reads session
- Garage and Newsletter → Auth Context: reads favorites
- Auth Context → API Client: authenticates
- API Client → Express API: sends API requests
- Express API → Car Routes: dispatches
- Express API → Content Routes: dispatches
- Express API → Auth Routes: dispatches
- Express API → Garage Routes: dispatches
- Car Routes → Query Repository: queries cars
- Content Routes → Query Repository: queries content
- Garage Routes → Query Repository: loads car details
- Garage Routes → SQLite Database: reads and writes favorites
- Auth Routes → SQLite Database: reads and writes accounts
- Query Repository → SQLite Database: queries