kayjaydee
c8dac9ac88
- Corrected the name in various files including CLAUDE.md, README.md, and configuration files to reflect the updated branding. - Ensured consistency in the use of the new name throughout the project, enhancing brand identity. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
4.6 KiB
4.6 KiB
Portfolio Killian' DAL-CIN — Migration Nuxt 4
What This Is
Migration complète d'un portfolio freelance de Vue 3 SPA vers Nuxt 4 avec SSR complet. Le site présente les projets, services et compétences de Killian' DAL-CIN, développeur freelance, avec support bilingue FR/EN. L'objectif est un SEO parfait et un développement rapide via des composants prêts à l'emploi (Nuxt UI v3).
Core Value
Chaque page du portfolio doit être crawlable par les moteurs de recherche sans JavaScript côté client — le SSR est la raison d'être de cette migration.
Requirements
Validated
(None yet — ship to validate)
Active
- SSR complet — chaque route crawlable sans JS client
- i18n FR/EN — détection navigateur + switch manuel + persistance cookie (SSR-safe)
- Dark/light mode — persistance cookie SSR-safe via @nuxtjs/color-mode, pas de FOUC
- SEO par route — useSeoMeta(), og:image auto, JSON-LD page home
- Sitemap.xml généré automatiquement (@nuxtjs/sitemap)
- Galerie modale images projets — UModal de Nuxt UI v3
- Formulaire contact — UForm + UInput + UTextarea (Nuxt UI), envoi EmailJS
- Performance — lazy load images (NuxtImg), fonts locales, preload hero
- Migration page Landing (hero + projets vedettes + services + CTA)
- Migration page Projects (liste avec filtres)
- Migration page Project Detail (détail + galerie modale)
- Migration page About (bio)
- Migration page Contact (formulaire)
- Migration page Fiverr (landing services)
- Migration page Formation (formations)
- Migration données statiques (projets, témoignages, FAQ, tech stack)
- Migration composables (useProjects → useAsyncData, useSiteConfig → useAppConfig, useGallery → UModal)
- Dockerfile production optimisé (multi-stage, node:22-alpine)
- TypeScript strict partout
- ESLint + Prettier (@nuxt/eslint)
Out of Scope
- Umami Analytics — self-hosted, hors scope de cette migration
- AdSense — script externe simple à injecter via app.head, pas un module
- Backend custom — formulaire contact via EmailJS/Formspree uniquement
- @nuxt/content — données statiques en fichiers TS, pas besoin de CMS markdown
- Tests automatisés — migration d'abord, tests ensuite si nécessaire
Context
- Portfolio freelance existant en production (Vue 3 SPA)
- Le site actuel fonctionne mais le SPA nuit au SEO (pas de SSR)
- Données statiques dans
src/data/(projets, témoignages, FAQ, tech stack) — format TS avec textes FR/EN - Composables existants : useProjects(), useSiteConfig(), useGallery()
- i18n actuel via vue-i18n standalone avec persistance localStorage (non SSR-safe)
- Thème actuel via class CSS
darkavec persistance localStorage (FOUC au chargement) - Déploiement Docker existant (Node 22 build → nginx serve static)
- Google Analytics 4 hardcodé dans index.html (à migrer vers nuxt-gtag)
Constraints
- Stack: Nuxt 4 + Nuxt UI v3 + Tailwind v4 — dernières versions stables
- Coût: Zéro dépendance payante
- Composants: Nuxt UI v3 en priorité sur le custom (80% suffit)
- TypeScript: Mode strict partout
- Déploiement: Docker node:22-alpine, nuxt build (SSR) ou nuxt generate (SSG) selon stratégie
- i18n/Theme: Persistance cookie uniquement (SSR-safe), pas de localStorage
Key Decisions
| Decision | Rationale | Outcome |
|---|---|---|
| Nuxt 4 plutôt que Nuxt 3 | Dernière version stable, meilleure DX et perf | — Pending |
| Nuxt UI v3 plutôt que composants custom | Vitesse de dev, composants production-ready | — Pending |
| EmailJS pour le contact | Pas de backend à maintenir | — Pending |
| Cookie plutôt que localStorage pour i18n/theme | SSR-safe, pas de flash/hydration mismatch | — Pending |
| Données statiques en TS plutôt que @nuxt/content | Simplicité, pas besoin de CMS | — Pending |
Evolution
This document evolves at phase transitions and milestone boundaries.
After each phase transition (via /gsd-transition):
- Requirements invalidated? → Move to Out of Scope with reason
- Requirements validated? → Move to Validated with phase reference
- New requirements emerged? → Add to Active
- Decisions to log? → Add to Key Decisions
- "What This Is" still accurate? → Update if drifted
After each milestone (via /gsd-complete-milestone):
- Full review of all sections
- Core Value check — still the right priority?
- Audit Out of Scope — reasons still valid?
- Update Context with current state
Last updated: 2026-04-08 — Phase 1 (Foundation) complete: Nuxt 4 scaffold, modules, types, data migration done