# ucup-pristel/perpustakaan architecture

> Architecture diagram of the GitHub repository ucup-pristel/perpustakaan, 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/ucup-pristel/perpustakaan
- Repository: https://github.com/ucup-pristel/perpustakaan

## Overview

Ucup Edu Lib is a digital learning library organized around career and interest fields. Learners browse fields, search for materials, open available PDFs, and use account features; admins manage the catalog. The frontend calls a REST API, with authentication and catalog operations backed by a relational database. The sampled code directly shows home and search requests, login and registration, and server-side synonym search. Other route capabilities are represented from their module paths; their internal call wiring was not sampled.

Main entry points: [`backend/server.js`](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/server.js) (REST Server), [`backend/models/db.js`](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/models/db.js) (DB Connection), [`frontend/src/App.jsx`](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/App.jsx) (App Router), [`frontend/src/lib/api.js`](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/lib/api.js) (API Client)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Learner Web App"]
  node_app["App Router<br/>[App.jsx]"]
  node_home["Field Browser<br/>[Home.jsx]"]
  node_searchui["Search Results<br/>[SearchResults.jsx]"]
  node_authui["Auth State<br/>[AuthContext.jsx]"]
  node_contentui["Content Pages"]
  node_apiclient["API Client<br/>[api.js]"]
end

subgraph group_api["Backend API"]
  node_server["REST Server<br/>[server.js]"]
  node_authroutes["Account Routes<br/>[auth.js]"]
  node_contentroutes["Content Routes<br/>[contents.js]"]
  node_fieldroutes["Field Routes<br/>[fields.js]"]
  node_subfieldroutes["Subfield Routes<br/>[subfields.js]"]
  node_progressroutes["Reading Progress<br/>[progress.js]"]
  node_activityroutes["Activity Routes<br/>[activity.js]"]
  node_adminroutes["Admin Routes<br/>[admin.js]"]
  node_authmw["Access Control<br/>[auth.js]"]
end

subgraph group_domain["Library Services"]
  node_queryparser["Query Variants<br/>[queryParser.js]"]
  node_uploader["Object Uploader<br/>[r2Uploader.js]"]
end

subgraph group_state["Persistent State"]
  node_dbclient["DB Connection<br/>[db.js]"]
  node_catalogdb[("Library Database<br/>[schema.sql]")]
end

node_learner(("Learner"))
node_admin(("Administrator"))
node_objectstore[("R2 Storage")]

node_learner -->|"uses"| node_app
node_admin -->|"uses"| node_app
node_app -->|"routes"| node_home
node_app -->|"routes"| node_searchui
node_app -->|"provides auth"| node_authui
node_app -->|"routes"| node_contentui
node_home -->|"requests fields"| node_apiclient
node_searchui -->|"requests search"| node_apiclient
node_authui -->|"requests auth"| node_apiclient
node_apiclient -->|"HTTP requests"| node_server
node_server -->|"mounts"| node_authroutes
node_server -->|"mounts"| node_contentroutes
node_server -->|"mounts"| node_fieldroutes
node_server -->|"mounts"| node_subfieldroutes
node_server -->|"mounts"| node_progressroutes
node_server -->|"mounts"| node_activityroutes
node_server -->|"mounts"| node_adminroutes
node_server -->|"expands queries"| node_queryparser
node_server -->|"searches catalog"| node_dbclient
node_authroutes -->|"reads/writes users"| node_dbclient
node_authroutes -->|"issues tokens"| node_authmw
node_contentroutes -->|"accesses content"| node_dbclient
node_fieldroutes -->|"accesses fields"| node_dbclient
node_subfieldroutes -->|"accesses subfields"| node_dbclient
node_progressroutes -->|"stores progress"| node_dbclient
node_activityroutes -->|"accesses activity"| node_dbclient
node_adminroutes -->|"checks access"| node_authmw
node_dbclient -->|"reads/writes"| node_catalogdb
node_uploader -.->|"uploads files"| node_objectstore

click node_app "https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/App.jsx"
click node_home "https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/components/Home.jsx"
click node_searchui "https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/pages/SearchResults.jsx"
click node_authui "https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/context/AuthContext.jsx"
click node_contentui "https://github.com/ucup-pristel/perpustakaan/tree/main/frontend/src/pages"
click node_apiclient "https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/lib/api.js"
click node_server "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/server.js"
click node_authroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/auth.js"
click node_contentroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/contents.js"
click node_fieldroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/fields.js"
click node_subfieldroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/subfields.js"
click node_progressroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/progress.js"
click node_activityroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/activity.js"
click node_adminroutes "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/admin.js"
click node_authmw "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/middleware/auth.js"
click node_queryparser "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/helpers/queryParser.js"
click node_uploader "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/utils/r2Uploader.js"
click node_dbclient "https://github.com/ucup-pristel/perpustakaan/blob/main/backend/models/db.js"
click node_catalogdb "https://github.com/ucup-pristel/perpustakaan/blob/main/database/schema.sql"

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_searchui,node_authui,node_contentui,node_apiclient toneBlue
class node_server,node_authroutes,node_contentroutes,node_fieldroutes,node_subfieldroutes,node_progressroutes,node_activityroutes,node_adminroutes,node_authmw,node_objectstore toneAmber
class node_queryparser,node_uploader toneMint
class node_dbclient,node_catalogdb toneRose
class node_learner,node_admin toneIndigo
```

## Components

### Learner Web App

- [App Router](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Field Browser](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/components/Home.jsx): `frontend/src/components/Home.jsx`
- [Search Results](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/pages/SearchResults.jsx): `frontend/src/pages/SearchResults.jsx`
- [Auth State](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/context/AuthContext.jsx): `frontend/src/context/AuthContext.jsx`
- [Content Pages](https://github.com/ucup-pristel/perpustakaan/tree/main/frontend/src/pages): `frontend/src/pages`
- [API Client](https://github.com/ucup-pristel/perpustakaan/blob/main/frontend/src/lib/api.js): `frontend/src/lib/api.js`

### Backend API

- [REST Server](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/server.js): `backend/server.js`
- [Account Routes](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/auth.js): `backend/routes/auth.js`
- [Content Routes](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/contents.js): `backend/routes/contents.js`
- [Field Routes](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/fields.js): `backend/routes/fields.js`
- [Subfield Routes](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/subfields.js): `backend/routes/subfields.js`
- [Reading Progress](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/progress.js): `backend/routes/progress.js`
- [Activity Routes](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/activity.js): `backend/routes/activity.js`
- [Admin Routes](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/routes/admin.js): `backend/routes/admin.js`
- [Access Control](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/middleware/auth.js): `backend/middleware/auth.js`

### Library Services

- [Query Variants](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/helpers/queryParser.js): `backend/helpers/queryParser.js`
- [Object Uploader](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/utils/r2Uploader.js): `backend/utils/r2Uploader.js`

### Persistent State

- [DB Connection](https://github.com/ucup-pristel/perpustakaan/blob/main/backend/models/db.js): `backend/models/db.js`
- [Library Database](https://github.com/ucup-pristel/perpustakaan/blob/main/database/schema.sql): `database/schema.sql`

### Other components

- **Learner**
- **Administrator**
- **R2 Storage**

## Connections

- Learner → App Router: uses
- Administrator → App Router: uses
- App Router → Field Browser: routes
- App Router → Search Results: routes
- App Router → Auth State: provides auth
- App Router → Content Pages: routes
- Field Browser → API Client: requests fields
- Search Results → API Client: requests search
- Auth State → API Client: requests auth
- API Client → REST Server: HTTP requests
- REST Server → Account Routes: mounts
- REST Server → Content Routes: mounts
- REST Server → Field Routes: mounts
- REST Server → Subfield Routes: mounts
- REST Server → Reading Progress: mounts
- REST Server → Activity Routes: mounts
- REST Server → Admin Routes: mounts
- REST Server → Query Variants: expands queries
- REST Server → DB Connection: searches catalog
- Account Routes → DB Connection: reads/writes users
- Account Routes → Access Control: issues tokens
- Content Routes → DB Connection: accesses content
- Field Routes → DB Connection: accesses fields
- Subfield Routes → DB Connection: accesses subfields
- Reading Progress → DB Connection: stores progress
- Activity Routes → DB Connection: accesses activity
- Admin Routes → Access Control: checks access
- DB Connection → Library Database: reads/writes
- Object Uploader → R2 Storage: uploads files