Définition des routes

Nous recommandons de lire la page Fondamentaux du routage avant de continuer.

Cette page vous guidera dans la définition et l'organisation des routes dans votre application Next.js.

Création de routes

Next.js utilise un routeur basé sur le système de fichiers où les dossiers sont utilisés pour définir les routes.

Chaque dossier représente un segment de route qui correspond à un segment d'URL. Pour créer une route imbriquée, vous pouvez imbriquer des dossiers les uns dans les autres.

Un fichier spécial page.js est utilisé pour rendre les segments de route accessibles publiquement.

Dans cet exemple, le chemin d'URL /dashboard/analytics n'est pas accessible publiquement car il ne possède pas de fichier page.js correspondant. Ce dossier pourrait être utilisé pour stocker des composants, des feuilles de style, des images ou d'autres fichiers colocalisés.

Bon à savoir : Les extensions de fichier .js, .jsx ou .tsx peuvent être utilisées pour les fichiers spéciaux.

Création d'interface utilisateur

Des conventions de fichiers spéciaux sont utilisées pour créer l'interface utilisateur de chaque segment de route. Les plus courantes sont les pages pour afficher une interface spécifique à une route, et les mises en page pour afficher une interface partagée entre plusieurs routes.

Par exemple, pour créer votre première page, ajoutez un fichier page.js dans le répertoire app et exportez un composant React :

export default function Page() {
  return <h1>Hello, Next.js!</h1>
}

export default function Page() {
  return <h1>Hello, Next.js!</h1>
}