Introduction
Bienvenue dans la documentation Next.js !
Qu'est-ce que Next.js ?
Next.js est un framework React pour construire des applications web full-stack. Vous utilisez des composants React pour créer des interfaces utilisateur, et Next.js pour des fonctionnalités et optimisations supplémentaires.
Sous le capot, Next.js abstrait et configure automatiquement les outils nécessaires pour React, comme le bundling, la compilation, et plus encore. Cela vous permet de vous concentrer sur la construction de votre application plutôt que de passer du temps sur la configuration.
Que vous soyez un développeur individuel ou membre d'une équipe plus large, Next.js peut vous aider à construire des applications React interactives, dynamiques et rapides.
Fonctionnalités principales
Voici quelques-unes des principales fonctionnalités de Next.js :
Fonctionnalité | Description |
---|---|
Routage | Un système de routage basé sur le système de fichiers, construit sur les composants serveur, qui prend en charge les layouts, le routage imbriqué, les états de chargement, la gestion d'erreurs, etc. |
Rendu | Rendu côté client (CSR) et côté serveur (SSR) avec des composants client et serveur. Optimisé avec le rendu statique et dynamique côté serveur avec Next.js. Streaming sur les runtimes Edge et Node.js. |
Récupération de données | Récupération simplifiée des données avec async/await dans les composants serveur, et une API fetch étendue pour la mémoïsation des requêtes, la mise en cache et la revalidation des données. |
Stylisation | Prise en charge de vos méthodes de stylisation préférées, y compris les CSS Modules, Tailwind CSS et CSS-in-JS |
Optimisations | Optimisations d'images, polices et scripts pour améliorer les Core Web Vitals et l'expérience utilisateur de votre application. |
TypeScript | Meilleure prise en charge de TypeScript, avec un typage plus strict et une compilation plus efficace, ainsi qu'un plugin TypeScript personnalisé et un vérificateur de types. |
Comment utiliser cette documentation
Sur le côté gauche de l'écran, vous trouverez la barre de navigation de la documentation. Les pages sont organisées séquentiellement, des bases aux concepts avancés, pour que vous puissiez les suivre étape par étape lors de la construction de votre application. Cependant, vous pouvez les lire dans n'importe quel ordre ou sauter aux pages correspondant à votre cas d'usage.
Sur le côté droit de l'écran, vous verrez une table des matières qui facilite la navigation entre les sections d'une page. Si vous avez besoin de trouver rapidement une page, vous pouvez utiliser la barre de recherche en haut ou le raccourci de recherche (Ctrl+K
ou Cmd+K
).
Pour commencer, consultez le guide Installation.
Routeur App vs Routeur Pages
Next.js propose deux routeurs différents : le routeur App et le routeur Pages. Le routeur App est un nouveau routeur qui vous permet d'utiliser les dernières fonctionnalités de React, comme les composants serveur et le streaming. Le routeur Pages est le routeur original de Next.js, qui permet de construire des applications React rendues côté serveur et continue d'être pris en charge pour les anciennes applications Next.js.
En haut de la barre latérale, vous remarquerez un menu déroulant qui vous permet de basculer entre les fonctionnalités du routeur App et du routeur Pages. Comme certaines fonctionnalités sont spécifiques à chaque répertoire, il est important de vérifier quel onglet est sélectionné.
Le fil d'Ariane en haut de la page indiquera également si vous consultez la documentation du routeur App ou du routeur Pages.
Prérequis
Bien que notre documentation soit conçue pour être accessible aux débutants, nous devons établir une base commune pour que la documentation puisse rester concentrée sur les fonctionnalités de Next.js. Nous nous assurerons de fournir des liens vers la documentation pertinente chaque fois que nous introduirons un nouveau concept.
Pour tirer le meilleur parti de notre documentation, il est recommandé d'avoir une compréhension de base du HTML, CSS et React. Si vous avez besoin de rafraîchir vos connaissances en React, consultez notre cours Next.js Foundations, qui vous présentera les fondamentaux.
Accessibilité
Pour une accessibilité optimale lors de l'utilisation d'un lecteur d'écran, nous recommandons d'utiliser Firefox avec NVDA, ou Safari avec VoiceOver.
Rejoignez notre communauté
Si vous avez des questions sur Next.js, vous êtes toujours les bienvenus dans notre communauté sur GitHub Discussions, Discord, Twitter et Reddit.