6. Technical Architecture
6.1 High-Level Architecture
┌─────────────────────────────────────────────────────────────────┐
│ CLIENT (Browser) │
│ Next.js (React) App │
│ Auth state (JWT), API calls, Stripe.js / Checkout │
└───────────────────────────────┬─────────────────────────────────┘
│ HTTPS
▼
┌─────────────────────────────────────────────────────────────────┐
│ BACKEND (FastAPI) │
│ REST API │ JWT auth │ Business logic │ Stripe Connect │ Webhooks│
└─────┬─────────────────────────────────┬─────────────────────────┘
│ │
▼ ▼
┌──────────────┐ ┌──────────────────┐
│ PostgreSQL │ │ Image Storage │
│ (Alembic) │ │ (e.g. Supabase) │
└──────────────┘ └──────────────────┘
│
│ Payouts / Payments
▼
┌──────────────┐
│ Stripe │
│ (Connect) │
└──────────────┘
6.2 Deployment (Conceptual)
- Frontend: Vercel (or similar) for Next.js.
- Backend: Single FastAPI app (e.g. Railway, Render, or a VPS); same app serves API and Stripe webhooks.
- Database: Managed PostgreSQL (e.g. Supabase, Neon, or Railway).
- Storage: Supabase Storage or Cloudinary for profile images (see §9).