Groupes de routes
Dans le répertoire app, les dossiers imbriqués sont normalement mappés sur des chemins d'URL. Cependant, vous pouvez marquer un dossier comme Groupe de routes pour éviter qu'il ne soit inclus dans le chemin d'URL de la route.
Cela vous permet d'organiser vos segments de route et vos fichiers de projet en groupes logiques sans affecter la structure du chemin d'URL.
Les groupes de routes sont utiles pour :
- Organiser les routes en groupes par exemple par section de site, intention ou équipe.
- Activer des layouts imbriqués au même niveau de segment de route :
Convention
Un groupe de routes peut être créé en encadrant le nom d'un dossier avec des parenthèses : (nomDuDossier)
Exemples
Organiser les routes sans affecter le chemin d'URL
Pour organiser les routes sans affecter l'URL, créez un groupe pour garder ensemble les routes associées. Les dossiers entre parenthèses seront omis de l'URL (par exemple (marketing) ou (shop)).
Même si les routes dans (marketing) et (shop) partagent la même hiérarchie d'URL, vous pouvez créer un layout différent pour chaque groupe en ajoutant un fichier layout.js dans leurs dossiers.
Inclure des segments spécifiques dans un layout
Pour inclure des routes spécifiques dans un layout, créez un nouveau groupe de routes (par exemple (shop)) et déplacez les routes qui partagent le même layout dans le groupe (par exemple account et cart). Les routes en dehors du groupe ne partageront pas le layout (par exemple checkout).
Créer plusieurs layouts racine
Pour créer plusieurs layouts racine, supprimez le fichier layout.js de niveau supérieur et ajoutez un fichier layout.js dans chaque groupe de routes. Ceci est utile pour partitionner une application en sections ayant une interface ou une expérience complètement différente. Les balises <html> et <body> doivent être ajoutées à chaque layout racine.
Dans l'exemple ci-dessus, (marketing) et (shop) ont chacun leur propre layout racine.
Bon à savoir :
- La dénomination des groupes de routes n'a pas de signification particulière autre que l'organisation. Elle n'affecte pas le chemin d'URL.
- Les routes incluant un groupe de routes ne doivent pas résoudre vers le même chemin d'URL que d'autres routes. Par exemple, comme les groupes de routes n'affectent pas la structure d'URL,
(marketing)/about/page.jset(shop)/about/page.jsrésoudraient tous deux vers/aboutet causeraient une erreur.- Si vous utilisez plusieurs layouts racine sans fichier
layout.jsde niveau supérieur, votre fichierpage.jsd'accueil doit être défini dans l'un des groupes de routes, par exemple :app/(marketing)/page.js.- Naviguer entre plusieurs layouts racine provoquera un rechargement complet de la page (par opposition à une navigation côté client). Par exemple, naviguer de
/cartqui utiliseapp/(shop)/layout.jsvers/blogqui utiliseapp/(marketing)/layout.jsprovoquera un rechargement complet. Ceci s'applique uniquement aux multiples layouts racine.