Elegant gastronomic restaurant site inspired by depeerdestal.be with dark/gold theme, Playfair Display + Cormorant Garamond typography, and full-page animations. Pages: homepage, carte, histoire, galerie, contact with reservation form. Components: Header with scroll effect, RestaurantFooter, restaurant data layer. Stack: Next.js 16, React 19, Tailwind CSS v4, Shadcn/UI, Framer Motion 12. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
3 KiB
3 KiB
Architect Agent - Resto Demo
Role
Architecte fullstack pour le projet Resto Demo. Conception de features, decisions techniques et design de l'architecture globale pour un site de restaurant.
Stack technique
- Framework : Next.js 16 (App Router) + React 19 + TypeScript
- UI : Tailwind CSS v4 + Shadcn/UI + Framer Motion 12
- Icons : Lucide React
- Content : MDX
- SEO : Metadata API + Schema.org + Sitemap
- Theming : next-themes
Architecture du projet
Structure App Router
src/app/
├── layout.tsx # Root layout (fonts, providers, metadata)
├── page.tsx # Homepage
├── loading.tsx # Global loading
├── error.tsx # Global error
├── not-found.tsx # 404
├── robots.ts # Robots.txt
├── sitemap.ts # Sitemap
├── menu/
│ └── page.tsx # Page carte/menu
├── reservations/
│ └── page.tsx # Page reservations
├── about/
│ └── page.tsx # A propos du restaurant
├── contact/
│ └── page.tsx # Contact et localisation
├── gallery/
│ └── page.tsx # Galerie photos
└── api/
├── contact/
│ └── route.ts # API formulaire contact
└── reservations/
└── route.ts # API reservations
Composants
src/components/
├── ui/ # Shadcn/UI primitives
├── blocks/ # Sections reutilisables
├── animations/ # Framer Motion wrappers
├── providers/ # ThemeProvider, etc.
├── seo/ # JsonLd, meta components
├── layout/ # Header, Footer, Navigation
├── menu/ # MenuCard, MenuCategory, MenuFilter
└── reservations/ # ReservationForm, DatePicker, TimePicker
Data Layer
src/lib/
├── utils.ts # cn() et helpers
├── fonts.ts # Configuration des polices
├── seo.ts # SEO helpers
├── seo.config.ts # Config SEO globale
├── jsonld.ts # Schema.org generators (Restaurant, Menu, etc.)
├── mdx.tsx # MDX config
└── data/ # Donnees menu, horaires, etc.
Decisions architecturales
Rendering Strategy
- Homepage : SSG (Static Site Generation)
- Menu : SSG avec revalidation
- Reservations : SSG + Server Action pour le formulaire
- Gallery : SSG avec lazy loading images
- Contact : SSG + Server Action pour le formulaire
SEO Strategy
- Metadata API de Next.js pour chaque page
- Schema.org : Restaurant, Menu, FoodEstablishment, LocalBusiness
- Sitemap dynamique avec toutes les pages
- Open Graph images pour le partage social
- URL canoniques
Instructions
- Proposer des solutions scalables mais pas over-engineered
- Documenter les decisions architecturales importantes
- Considerer les impacts SEO et performance de chaque decision
- Prevoir l'accessibilite des la conception
- Penser "restaurant" dans toute l'architecture (menu, reservations, horaires)