# mustafa-fathur/prd-maker-with-llm architecture

> Architecture diagram of the GitHub repository mustafa-fathur/prd-maker-with-llm, 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/mustafa-fathur/prd-maker-with-llm
- Repository: https://github.com/mustafa-fathur/prd-maker-with-llm

## Overview

PRD Maker takes project details from an authenticated user, sends them through the Express API to the Flask LLM service, and persists the generated structured PRD for review and editing. Users can also manage PRDs and personnel, archive or delete documents, and request a styled PDF. The README documents Cloud SQL and Cloud Storage deployment integrations, but sampled source does not establish their wiring; the graph therefore shows only the evidenced model persistence and PDF generation. The LLM service calls OpenAI, as shown in its source.

Main entry points: [`Cloud_Computing/frontend/src/utils/api.js`](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/utils/api.js) (API client), [`Cloud_Computing/backend/controllers/prdController.js`](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/prdController.js) (PRD controller), [`Cloud_Computing/frontend/src/App.jsx`](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/App.jsx) (App routes), [`Cloud_Computing/backend/server.js`](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/server.js) (Express server)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["User Interface"]
  node_app["App routes<br/>[App.jsx]"]
  node_authui["Auth screens<br/>[Login.jsx]"]
  node_prdforms["PRD forms<br/>[PRDForm.jsx]"]
  node_prdviews["PRD views<br/>[PRDList.jsx]"]
  node_personilui["Personnel UI<br/>[Personil.jsx]"]
  node_authhook["Auth state<br/>[useAuth.js]"]
  node_api_client["API client<br/>[api.js]"]
end

subgraph group_api["Express API"]
  node_express["Express server<br/>[server.js]"]
  node_authroutes["Auth routes<br/>[authRoutes.js]"]
  node_authcontroller["Auth controller<br/>[authController.js]"]
  node_authmiddleware["Auth middleware<br/>[authMiddleware.js]"]
  node_prdroutes["PRD routes<br/>[prdRoutes.js]"]
  node_prdcontroller["PRD controller<br/>[prdController.js]"]
  node_personilroutes["Personnel routes<br/>[personilRoutes.js]"]
  node_personilcontroller["Personnel controller"]
end

subgraph group_data["PRD Data"]
  node_models["PRD models<br/>[index.js]"]
  node_relationaldb[("Relational store")]
end

subgraph group_generation["PRD Generation"]
  node_flask["Flask endpoint<br/>[main.py]"]
  node_generator["PRD generator<br/>[llm.py]"]
end

subgraph group_output["Document Output"]
  node_pdf["PDF renderer<br/>[puppeteer.js]"]
end

node_user(("User"))
node_openai{{"OpenAI API"}}

node_user -->|"uses"| node_app
node_app -->|"routes"| node_authui
node_app -->|"routes"| node_prdforms
node_app -->|"routes"| node_prdviews
node_app -->|"routes"| node_personilui
node_authui -->|"requests"| node_api_client
node_prdforms -->|"submits"| node_api_client
node_prdviews -->|"requests"| node_api_client
node_personilui -->|"requests"| node_api_client
node_authhook -->|"checks token"| node_api_client
node_api_client -->|"HTTP requests"| node_express
node_express -->|"dispatches"| node_authroutes
node_express -->|"dispatches"| node_prdroutes
node_express -->|"dispatches"| node_personilroutes
node_authroutes -->|"dispatches"| node_authcontroller
node_authroutes -->|"guards logout"| node_authmiddleware
node_authcontroller -->|"reads/writes users"| node_models
node_prdroutes -->|"guards requests"| node_authmiddleware
node_prdroutes -->|"dispatches"| node_prdcontroller
node_prdcontroller -->|"reads/writes PRDs"| node_models
node_prdcontroller -->|"posts inputs"| node_flask
node_flask -->|"generates PRD"| node_generator
node_generator -->|"requests completion"| node_openai
node_openai -->|"returns JSON"| node_generator
node_flask -->|"returns PRD"| node_prdcontroller
node_personilroutes -->|"guards requests"| node_authmiddleware
node_personilroutes -->|"dispatches"| node_personilcontroller
node_personilcontroller -->|"reads/writes personnel"| node_models
node_models -->|"persists records"| node_relationaldb
node_prdcontroller -->|"renders document"| node_pdf
node_prdcontroller -->|"returns PDF URL"| node_api_client

click node_app "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/App.jsx"
click node_authui "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Guest/Login.jsx"
click node_prdforms "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Users/PRDForm.jsx"
click node_prdviews "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Users/PRDList.jsx"
click node_personilui "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Users/Personil.jsx"
click node_authhook "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/hooks/useAuth.js"
click node_api_client "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/utils/api.js"
click node_express "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/server.js"
click node_authroutes "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/routes/authRoutes.js"
click node_authcontroller "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/authController.js"
click node_authmiddleware "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/middleware/authMiddleware.js"
click node_prdroutes "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/routes/prdRoutes.js"
click node_prdcontroller "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/prdController.js"
click node_personilroutes "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/routes/personilRoutes.js"
click node_personilcontroller "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/personilController.js"
click node_models "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/models/index.js"
click node_flask "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Machine_Learning/app/main.py"
click node_generator "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Machine_Learning/app/llm.py"
click node_pdf "https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/config/puppeteer.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_authui,node_prdforms,node_prdviews,node_personilui,node_authhook,node_api_client,node_user toneBlue
class node_express,node_authroutes,node_authcontroller,node_authmiddleware,node_prdroutes,node_prdcontroller,node_personilroutes,node_personilcontroller toneAmber
class node_models,node_relationaldb,node_openai toneMint
class node_flask,node_generator toneRose
class node_pdf toneIndigo
```

## Components

### User Interface

- [App routes](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/App.jsx): `Cloud_Computing/frontend/src/App.jsx`
- [Auth screens](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Guest/Login.jsx): `Cloud_Computing/frontend/src/components/Guest/Login.jsx`
- [PRD forms](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Users/PRDForm.jsx): `Cloud_Computing/frontend/src/components/Users/PRDForm.jsx`
- [PRD views](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Users/PRDList.jsx): `Cloud_Computing/frontend/src/components/Users/PRDList.jsx`
- [Personnel UI](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/components/Users/Personil.jsx): `Cloud_Computing/frontend/src/components/Users/Personil.jsx`
- [Auth state](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/hooks/useAuth.js): `Cloud_Computing/frontend/src/hooks/useAuth.js`
- [API client](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/frontend/src/utils/api.js): `Cloud_Computing/frontend/src/utils/api.js`

### Express API

- [Express server](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/server.js): `Cloud_Computing/backend/server.js`
- [Auth routes](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/routes/authRoutes.js): `Cloud_Computing/backend/routes/authRoutes.js`
- [Auth controller](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/authController.js): `Cloud_Computing/backend/controllers/authController.js`
- [Auth middleware](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/middleware/authMiddleware.js): `Cloud_Computing/backend/middleware/authMiddleware.js`
- [PRD routes](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/routes/prdRoutes.js): `Cloud_Computing/backend/routes/prdRoutes.js`
- [PRD controller](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/prdController.js): `Cloud_Computing/backend/controllers/prdController.js`
- [Personnel routes](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/routes/personilRoutes.js): `Cloud_Computing/backend/routes/personilRoutes.js`
- [Personnel controller](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/controllers/personilController.js): `Cloud_Computing/backend/controllers/personilController.js`

### PRD Data

- [PRD models](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/models/index.js): `Cloud_Computing/backend/models/index.js`
- **Relational store**

### PRD Generation

- [Flask endpoint](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Machine_Learning/app/main.py): `Machine_Learning/app/main.py`
- [PRD generator](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Machine_Learning/app/llm.py): `Machine_Learning/app/llm.py`

### Document Output

- [PDF renderer](https://github.com/mustafa-fathur/prd-maker-with-llm/blob/main/Cloud_Computing/backend/config/puppeteer.js): `Cloud_Computing/backend/config/puppeteer.js`

### Other components

- **User**
- **OpenAI API**

## Connections

- User → App routes: uses
- App routes → Auth screens: routes
- App routes → PRD forms: routes
- App routes → PRD views: routes
- App routes → Personnel UI: routes
- Auth screens → API client: requests
- PRD forms → API client: submits
- PRD views → API client: requests
- Personnel UI → API client: requests
- Auth state → API client: checks token
- API client → Express server: HTTP requests
- Express server → Auth routes: dispatches
- Express server → PRD routes: dispatches
- Express server → Personnel routes: dispatches
- Auth routes → Auth controller: dispatches
- Auth routes → Auth middleware: guards logout
- Auth controller → PRD models: reads/writes users
- PRD routes → Auth middleware: guards requests
- PRD routes → PRD controller: dispatches
- PRD controller → PRD models: reads/writes PRDs
- PRD controller → Flask endpoint: posts inputs
- Flask endpoint → PRD generator: generates PRD
- PRD generator → OpenAI API: requests completion
- OpenAI API → PRD generator: returns JSON
- Flask endpoint → PRD controller: returns PRD
- Personnel routes → Auth middleware: guards requests
- Personnel routes → Personnel controller: dispatches
- Personnel controller → PRD models: reads/writes personnel
- PRD models → Relational store: persists records
- PRD controller → PDF renderer: renders document
- PRD controller → API client: returns PDF URL