Next.js
Définition
Framework React de référence pour la production : routing par fichiers, SSR/SSG/ISR, optimisation des images, SEO natif. Maintenu par Vercel.
Qu'est-ce que Next.js
Next.js est le framework React de référence pour la production, édité par Vercel. Il ajoute à React tout ce qui manque pour un vrai site : routing par système de fichiers, rendu serveur (SSR, SSG, ISR), optimisation automatique des images via next/image, gestion native du SEO via la metadata API, Server Components et Server Actions. Là où React seul demande de tout configurer (Webpack, routing, SSR, deploy), Next.js livre une stack opinionée qui marche d'emblée et tient la production. C'est devenu le défaut sur les nouveaux projets React depuis 2022.
Les modes de rendu
Next.js permet de mélanger SSG, ISR et SSR au sein d'une même app, route par route. Une page d'accueil ultra-rapide en SSG, un catalogue avec ISR qui se met à jour toutes les heures, un dashboard utilisateur en SSR : tout cohabite dans le même projet, sans changer de framework ni de configuration. C'est l'un des arguments les plus forts du framework. Sur un projet qui mélange contenu public (SEO) et application connectée (dynamique), on n'a pas besoin de monter deux stacks séparées.
App Router et Server Components
Depuis Next.js 13, le framework propose l'App Router avec Server Components par défaut. Chaque composant tourne sur le serveur sauf déclaration explicite "use client". Le bundle JavaScript envoyé au navigateur diminue radicalement, ce qui améliore LCP et INP. On peut interroger directement la base ou appeler des APIs privées dans un composant, sans monter de route intermédiaire. C'est l'évolution la plus importante de React et Next.js depuis dix ans, et la direction prise par tous les nouveaux projets.
Next.js et Vercel
Vercel, qui édite Next.js, propose la plateforme de déploiement associée. Chaque commit déclenche un build et une URL de preview unique, prête à partager. L'edge runtime mondial sert vos pages au plus près des utilisateurs. Le monitoring (Vercel Analytics, Speed Insights, Logs) est intégré. La combinaison Next.js + Vercel est devenue un standard pour les SaaS, les sites SEO et les apps interactives, parce qu'elle élimine l'essentiel du travail DevOps tout en gardant des performances de niveau professionnel.
À quoi ça sert
Next.js convient autant à un site vitrine ultra-rapide qu'à un SaaS B2B complet, en passant par un e-commerce custom ou un blog éditorial. Sa modularité permet de cibler chaque besoin avec la bonne stratégie de rendu sans changer d'outil. On l'utilise sur des projets de toutes tailles : une landing page solo en quelques jours, un SaaS multi-tenant à plusieurs développeurs, un site de 10 000 pages SEO programmatiques. Pour la plupart des nouveaux projets web, c'est le bon défaut.
Quand ne pas l'utiliser
Next.js n'est pas toujours le bon outil. Pour un site purement statique de cinq pages sans interactivité, Astro ou même un HTML manuel coûtent moins. Pour une app native mobile, on regarde React Native ou Expo, qui partagent React mais pas Next.js. Pour un back-end pur sans interface (API à fort trafic, microservices), on préfère Express, Fastify, Hono ou NestJS sans le poids du framework front. Pour un site WordPress migré au moindre coût, garder WordPress fait sens. Next.js brille sur les projets qui mélangent rendu serveur, interactivité et besoin SEO ou performance.
L'écosystème
Next.js bénéficie de l'écosystème React complet plus ses propres briques : next/image pour les images, next/font pour les fonts, next/og pour les images Open Graph dynamiques, next-intl pour l'i18n, next-themes pour le dark mode. Côté UI, shadcn/ui s'est imposé comme standard. Côté base, Drizzle et Prisma sont les ORM dominants. Côté déploiement, Vercel reste le premier choix, mais Netlify, Cloudflare, Railway et l'auto-hébergement sont des options viables selon les contraintes de coût et de souveraineté.