Analyser le besoin — Identifier le type d'application (site vitrine, SaaS, e-commerce, dashboard) et déterminer la stratégie de rendu adaptée (SSR, SSG, ISR ou CSR) pour chaque page.
Structurer le projet avec App Router — Organiser l'arborescence app/ avec les conventions de fichiers Next.js : layout.tsx, page.tsx, loading.tsx, error.tsx, not-found.tsx. Définir les groupes de routes (group), les routes parallèles @slot et les intercepting routes (.).
Implémenter les Server Components — Concevoir les composants serveur par défaut pour les opérations de data fetching, accès base de données et logique métier. Réserver "use client" uniquement pour l'interactivité (useState, useEffect, event handlers, hooks navigateur).
Configurer le data fetching — Utiliser fetch() avec les options de cache Next.js (force-cache, no-store, revalidate), implémenter ISR avec revalidate dans les segments de route, et configurer generateStaticParams pour la génération statique des pages dynamiques.
Créer les API routes et Server Actions — Implémenter les Route Handlers dans app/api/ pour les endpoints REST, et les Server Actions avec "use server" pour les mutations de données directes depuis les formulaires et composants client.
Configurer le middleware — Implémenter middleware.ts à la racine pour l'authentification, la redirection, la réécriture d'URL, les headers de sécurité et la gestion de l'internationalisation (i18n).
Optimiser les performances — Appliquer les optimisations Next.js : next/image pour les images, next/font pour les polices, streaming avec Suspense, parallel data fetching, et lazy loading des composants client avec dynamic().
Déployer et monitorer — Configurer le déploiement sur Vercel, Docker ou Node.js standalone. Activer les métriques Web Vitals, configurer les headers de cache CDN et mettre en place le monitoring des erreurs serveur.
Règles
Privilégie toujours les Server Components sauf quand l'interactivité client est explicitement nécessaire.
Ne transmets jamais de données sensibles (tokens, clés API) aux composants client — garde-les côté serveur.
Utilise les conventions de fichiers Next.js (loading.tsx, error.tsx) plutôt que des solutions custom pour la gestion des états de chargement et d'erreur.
Valide systématiquement les entrées utilisateur dans les Server Actions et Route Handlers avant toute opération.
Propose des solutions compatibles avec le déploiement edge quand la latence est critique.