148 lines
6.3 KiB
Markdown
148 lines
6.3 KiB
Markdown
# Requirements: Portfolio Killian Dalcin — Nuxt 4 Migration
|
|
|
|
**Defined:** 2026-04-07
|
|
**Core Value:** Chaque page du portfolio doit être crawlable par les moteurs de recherche sans JavaScript côté client
|
|
|
|
## v1 Requirements
|
|
|
|
### SSR Foundation
|
|
|
|
- [ ] **SSR-01**: Chaque route retourne du HTML complet côté serveur, crawlable sans JS client
|
|
- [ ] **SSR-02**: Le projet utilise Nuxt 4 avec la structure `app/` et les auto-imports
|
|
- [ ] **SSR-03**: `nuxt.config.ts` configure tous les modules (UI, i18n, color-mode, SEO, gtag, image)
|
|
|
|
### Internationalization
|
|
|
|
- [x] **I18N-01**: Le site supporte FR et EN avec stratégie `prefix_except_default` (FR à `/`, EN à `/en/*`)
|
|
- [x] **I18N-02**: La locale est détectée depuis le navigateur au premier accès et persistée en cookie
|
|
- [x] **I18N-03**: L'utilisateur peut changer de langue via un switcher dans le header
|
|
- [x] **I18N-04**: Le serveur lit le cookie et rend la bonne langue sans hydration mismatch
|
|
- [x] **I18N-05**: Les fichiers de traduction FR/EN sont migrés depuis les locales existantes
|
|
|
|
### Theme
|
|
|
|
- [x] **THEME-01**: L'utilisateur peut basculer entre dark et light mode via un toggle dans le header
|
|
- [x] **THEME-02**: Le thème est persisté en cookie SSR-safe (pas localStorage)
|
|
- [x] **THEME-03**: Aucun FOUC au chargement — le serveur rend le bon thème dès la première requête
|
|
|
|
### SEO
|
|
|
|
- [x] **SEO-01**: Chaque page a un `<title>`, `<meta description>`, `og:title`, `og:description` uniques via `useSeoMeta()`
|
|
- [x] **SEO-02**: La page d'accueil inclut du JSON-LD structuré (Person / CreativeWork)
|
|
- [x] **SEO-03**: Le sitemap.xml est généré automatiquement avec les alternates i18n (hreflang)
|
|
- [x] **SEO-04**: Les og:image utilisent des URLs absolues et sont présentes sur chaque page
|
|
|
|
### Pages
|
|
|
|
- [x] **PAGE-01**: Page Landing `/` — hero, projets vedettes, services, CTA
|
|
- [x] **PAGE-02**: Page Projects `/projects` — liste de projets avec filtres (recherche + catégorie)
|
|
- [x] **PAGE-03**: Page Project Detail `/project/[id]` — détail projet avec galerie modale d'images
|
|
- [x] **PAGE-04**: Page About `/about` — biographie, tech stack badges
|
|
- [x] **PAGE-05**: Page Contact `/contact` — formulaire avec validation + envoi EmailJS
|
|
- [x] **PAGE-06**: Page Fiverr `/fiverr` — landing services, cards, FAQ accordion, CTA
|
|
- [ ] **PAGE-07**: Page Formation `/formation` — page formations/cours
|
|
- [x] **PAGE-08**: Page 404 — `error.vue` avec redirection vers home
|
|
|
|
### Components
|
|
|
|
- [x] **COMP-01**: Galerie modale d'images — UModal + UCarousel avec navigation clavier (flèches + Escape)
|
|
- [x] **COMP-02**: Formulaire contact — UForm + UFormField + UInput + UTextarea + validation Zod + envoi EmailJS
|
|
- [x] **COMP-03**: FAQ accordion — UAccordion pour la page Fiverr, localisé FR/EN
|
|
- [x] **COMP-04**: Section témoignages clients — UCard pour chaque témoignage
|
|
- [x] **COMP-05**: Header avec navigation desktop (UNavigationMenu) + mobile (UDrawer) + toggles langue/thème
|
|
- [x] **COMP-06**: Footer avec liens et informations
|
|
|
|
### Data
|
|
|
|
- [ ] **DATA-01**: Données projets migrées depuis `src/data/` vers `data/` avec interfaces TypeScript
|
|
- [ ] **DATA-02**: Données témoignages migrées avec interfaces TypeScript
|
|
- [ ] **DATA-03**: Données FAQ migrées avec support FR/EN et interfaces TypeScript
|
|
- [ ] **DATA-04**: Données tech stack migrées avec interfaces TypeScript
|
|
- [ ] **DATA-05**: Composable `useProjects()` migré — filtrage, recherche, findById
|
|
|
|
### Infrastructure
|
|
|
|
- [x] **INFRA-01**: Dockerfile production multi-stage (node:22-alpine build → node:22-alpine runtime, copie `.output/` uniquement)
|
|
- [ ] **INFRA-02**: TypeScript en mode strict avec interfaces pour toutes les données
|
|
- [ ] **INFRA-03**: ESLint + Prettier configurés via @nuxt/eslint
|
|
- [x] **INFRA-04**: Google Analytics 4 via nuxt-gtag, actif uniquement en production
|
|
|
|
## v2 Requirements
|
|
|
|
### Performance avancée
|
|
|
|
- **PERF-01**: Preload hero image via useHead link preload
|
|
- **PERF-02**: Fonts locales (pas Google Fonts) pour éviter FOUT
|
|
- **PERF-03**: NuxtImg avec optimisation WebP automatique pour toutes les images projet
|
|
|
|
### SEO avancé
|
|
|
|
- **SEOV2-01**: og:image générée dynamiquement par route via nuxt-og-image
|
|
- **SEOV2-02**: robots.txt optimisé avec directives spécifiques
|
|
|
|
## Out of Scope
|
|
|
|
| Feature | Reason |
|
|
|---------|--------|
|
|
| Umami Analytics | Self-hosted, infrastructure hors scope |
|
|
| AdSense | Script externe simple, pas un module Nuxt |
|
|
| Backend custom | Formulaire contact via EmailJS uniquement |
|
|
| @nuxt/content | Données statiques en TS, pas besoin de CMS markdown |
|
|
| Blog / articles | Pas dans le scope, maintenance contenu supplémentaire |
|
|
| Animation library (GSAP) | CSS transitions suffisantes, poids JS inutile |
|
|
| i18n > 2 langues | FR/EN uniquement, scope creep |
|
|
| CMS admin panel | Données statiques modifiées via code |
|
|
| Tests automatisés | Migration d'abord, tests ensuite si nécessaire |
|
|
|
|
## Traceability
|
|
|
|
| Requirement | Phase | Status |
|
|
|-------------|-------|--------|
|
|
| SSR-01 | Phase 1 | Pending |
|
|
| SSR-02 | Phase 1 | Pending |
|
|
| SSR-03 | Phase 1 | Pending |
|
|
| DATA-01 | Phase 1 | Pending |
|
|
| DATA-02 | Phase 1 | Pending |
|
|
| DATA-03 | Phase 1 | Pending |
|
|
| DATA-04 | Phase 1 | Pending |
|
|
| DATA-05 | Phase 1 | Pending |
|
|
| INFRA-02 | Phase 1 | Pending |
|
|
| INFRA-03 | Phase 1 | Pending |
|
|
| I18N-01 | Phase 2 | Complete |
|
|
| I18N-02 | Phase 2 | Complete |
|
|
| I18N-03 | Phase 2 | Complete |
|
|
| I18N-04 | Phase 2 | Complete |
|
|
| I18N-05 | Phase 2 | Complete |
|
|
| THEME-01 | Phase 2 | Complete |
|
|
| THEME-02 | Phase 2 | Complete |
|
|
| THEME-03 | Phase 2 | Complete |
|
|
| SEO-01 | Phase 2 | Complete |
|
|
| SEO-02 | Phase 2 | Complete |
|
|
| SEO-03 | Phase 2 | Complete |
|
|
| SEO-04 | Phase 2 | Complete |
|
|
| COMP-05 | Phase 2 | Complete |
|
|
| COMP-06 | Phase 2 | Complete |
|
|
| PAGE-01 | Phase 3 | Complete |
|
|
| PAGE-02 | Phase 3 | Complete |
|
|
| PAGE-03 | Phase 3 | Complete |
|
|
| PAGE-04 | Phase 3 | Complete |
|
|
| PAGE-05 | Phase 3 | Complete |
|
|
| PAGE-06 | Phase 3 | Complete |
|
|
| PAGE-07 | Phase 3 | Pending |
|
|
| PAGE-08 | Phase 3 | Complete |
|
|
| COMP-01 | Phase 3 | Complete |
|
|
| COMP-02 | Phase 3 | Complete |
|
|
| COMP-03 | Phase 3 | Complete |
|
|
| COMP-04 | Phase 3 | Complete |
|
|
| INFRA-01 | Phase 3 | Complete |
|
|
| INFRA-04 | Phase 3 | Complete |
|
|
|
|
**Coverage:**
|
|
- v1 requirements: 38 total
|
|
- Mapped to phases: 38
|
|
- Unmapped: 0 ✓
|
|
|
|
---
|
|
*Requirements defined: 2026-04-07*
|
|
*Last updated: 2026-04-07 after roadmap creation*
|