Part 4 — Coding overview diagram
Who: Hiren Part 4. Visual: SVG · 720 PNG Job: On-camera map of forms · functions · frontend · backend · API · DB — coding why/how that maps to the Part 3 architecture flow. Label: PROTOTYPE visual · not Quantic submit. No FR/NFR IDs on the diagram. Honesty: wiring from aea-interactive-design main. Folded into Stack. Architecture trio: Part 3 HLD + flow.
Spoken cue (one line)
“Coding map — pages and forms up top, Flask routes in the middle, modules under that, Postgres at the bottom. Static pages read the freeze; booking goes through slots and reservations.”
Diagram
Fallback raster: flow-coding-overview-720.png.
Honest wiring
| Layer | What | Connects how |
|---|---|---|
| Frontend pages | Home / Menu / Gallery / About | import @shared/freeze.json (+ menu-presentation) — not /api/menu |
| Images | Gallery / menu photos | GET /images/… |
| Reservations form | booking fields | GET /api/slots?date= → POST /api/reservations → Postgres |
| NewsletterForm | footer email | POST /api/newsletter → store-only |
| API | Flask routes | health · menu/site (exposed; FE uses freeze) · slots/reservations · newsletter · operator helper |
| Backend modules | reservations.py · newsletter.py · content/slots · db.py · validate.py | functions behind routes |
| DB | customers · reservations | unique slot+table · fail-closed without DB · full book → 409 |
On camera: cafe.artof.link = MSAIE staging (temporary). Staging database is on-box Postgres (MSAIE staging) — not a shared RDS. Newsletter is store-only.
Related
- Architecture trio: Part 3 HLD + Meghna FE/BE
- Part 4 NATURAL callouts: Part 4 natural script
- Meghna FE/BE: flow-part2-fe-be.svg
- Stack · Parts 3–5 materials · Local vs AWS
- ID map: Handoff mapping — not spoken on camera
Packed 2026-09-06 Europe/Berlin · PROTOTYPE · Part 4 coding overview.