Learn

LEARN / NEXT.JS

Next.js

Parcours en huit modules — autour du App Router et de Next.js 16.2 — du projet vide jusqu’au déploiement.

Modules

  1. Module 1 — Installation et structure

    Créer un projet avec npx create-next-app@16.2, puis parcourir app/, public/, src/ (optionnel), next.config, package.json et .env.

  2. Module 2 — Routage basique

    Fichiers spéciaux : page.tsx, layout.tsx, loading.tsx, error.tsx. Routes statiques du type /blog/page.tsx.

  3. Module 3 — Routes avancées

    Segments dynamiques [slug], catch-all [...slug], groupes de routes (group) (URL inchangée), dossiers privés _components/.

  4. Module 4 — Composants et colocation

    Colocaliser composants et utilitaires sous app/ (ex. _lib/data.ts). Ordre : layout → template → error → loading → page. UI partagée.

  5. Module 5 — Métadonnées et SEO

    favicon.ico, opengraph-image.png, sitemap.xml, robots.txt — y compris générés en code (fichiers .tsx).

  6. Module 6 — Nouveautés Next.js 16.2

    Turbopack par défaut, Server Fast Refresh (HMR serveur), SRI, tree-shaking des dynamic imports, postcss.config.ts.

  7. Module 7 — Organisation projet

    Fichiers hors app/, découpage par feature, route groups pour plusieurs layouts. Pistes avec monorepo / Turborepo.

  8. Module 8 — Déploiement et bonnes pratiques

    next.config.js (ex. turbopack.ignoreIssue), ESLint / TypeScript, variables d'environnement, déploiement sur Vercel.