Qu'est-ce que Next.js et qu'ajoute-t-il par rapport à React ?

Question

Accepted Answer

**Next.js** est un **framework** React full-stack. React en lui-même n'est qu'une bibliothèque UI — il affiche des composants mais laisse le routing, la récupération de données, le rendu serveur et les outils de build à votre charge. Next.js fournit tout cela prêt à l'emploi, plus un runtime serveur. ## Pourquoi c'est important ```text React (library) → Next.js (framework) adds: ────────────────────────────────────────────────── UI rendering only → File-based routing (folders = routes) Client-side rendering → Server rendering (SSR), static generation (SSG), ISR You wire data fetching → Built-in data fetching + caching No backend → API routes / Route Handlers (full-stack) Manual bundling → Zero-config build, code splitting, optimization Manual → next/image (auto-optimized images), next/font ``` ## Un exemple concret : une route n'est qu'un fichier ```tsx // app/about/page.tsx → automatically served at /about export default function About() { return

About us

; } ``` Dans React pur, vous devriez installer un routeur, configurer les routes et mettre en place un build. Dans Next.js, créer le fichier *est* la route. ## Pourquoi les équipes la choisissent - **SEO & performance** — le HTML rendu serveur signifie que le contenu est dans la réponse initiale (bon pour les crawlers et le premier affichage rapide), contrairement à une SPA React côté client uniquement qui envoie une page vide puis s'hydrate. - **Full-stack dans un seul projet** — le frontend et le backend (API routes, Server Actions) coexistent. - **Defaults prêts pour la production** — code splitting automatique, optimisation des images/polices, caching. ## Pourquoi c'est important Next.js est le framework React le plus populaire car il transforme React d'une bibliothèque UI en une plateforme applicative complète — gérant la stratégie de rendu, le routing, les données et un backend pour que vous vous concentriez sur les fonctionnalités au lieu de l'infrastructure. C'est le choix par défaut quand vous avez besoin de SEO, de performance ou de logique côté serveur avec React.