Architecture Overview

┌─────────────────────────────────────────────────────────────┐
│                         Client Layer                         │
│  React 18 + TypeScript + Vite + TailwindCSS + Tanstack Query│
└────────────────────────┬────────────────────────────────────┘
                         │
                         │ HTTP/REST
                         │
┌────────────────────────▼────────────────────────────────────┐
│                      Backend Layer                           │
│              Express 4 + Node.js + TypeScript                │
│  ┌─────────────┐  ┌──────────────┐  ┌──────────────┐       │
│  │   Auth      │  │   Projects   │  │   Contact    │       │
│  │ Middleware  │  │   Routes     │  │   Routes     │       │
│  └─────────────┘  └──────────────┘  └──────────────┘       │
└────────────────────────┬────────────────────────────────────┘
                         │
           ┌─────────────┼─────────────┐
           │             │             │
┌──────────▼──────┐  ┌──▼────────┐  ┌▼─────────────┐
│   PostgreSQL    │  │  Resend   │  │    Static    │
│   + Prisma      │  │   Email   │  │    Assets    │
└─────────────────┘  └───────────┘  └──────────────┘

1. User requests https://andreruperto.dev/
2. Express serves static index.html from backend/dist/
3. Browser loads React bundle and initializes app
4. React Router renders Index page
5. Components mount and fetch data from /api/projects
6. Backend queries PostgreSQL via Prisma
7. JSON response rendered in UI

1. User fills contact form (ContactSection component)
2. React Hook Form validates with Zod schema
3. POST /api/contact with rate limiting (5 requests/hour)
4. Backend validates: email format, required fields, length limits
5. Resend API sends notification email to André
6. Resend API sends confirmation email to user
7. Success response displayed via Sonner toast

1. Admin navigates to /admin/login
2. AdminLogin page renders with password form
3. POST /api/auth/login with rate limiting (5 attempts/15 min)
4. Backend validates password against ADMIN_PASSWORD env var
5. JWT token generated (24h expiry) using JWT_SECRET
6. Token stored in client and sent in Authorization header
7. Protected routes verify token via authMiddleware

// backend/src/server.js:12-14
const envFile = process.env.NODE_ENV === 'production' 
  ? '.env.production' 
  : '.env';
dotenv.config({ path: envFile });

~/workspace/source/
├── src/                    # Frontend React application
│   ├── components/         # React components
│   ├── pages/             # Route pages
│   ├── hooks/             # Custom React hooks
│   ├── lib/               # Utilities
│   └── assets/            # Static assets
├── backend/
│   ├── src/
│   │   └── server.js      # Express server
│   ├── prisma/
│   │   └── schema.prisma  # Database schema
│   └── scripts/
│       └── seed.ts        # Database seeding
├── public/                # Public static files
└── scripts/
    └── copy-images.js     # Build script