Parties du site dans la mise en page principale dans NextJS
Regardons notre mise en page de site. Actuellement, elle contient la commande pour insérer le contenu variable de la page :
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<main>
{children}
</main>
</body>
</html>
);
}
Cependant, un site web a généralement d'autres parties qui restent inchangées pour les différentes pages. Par exemple, il peut y avoir un en-tête et un pied de page. Ajoutons-les à notre mise en page :
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<header>
header
</header>
<main>
{children}
</main>
<footer>
footer
</footer>
</body>
</html>
);
}
Ajoutez à la mise en page de votre projet un bloc avec l'en-tête, le pied de page, ainsi que les barres latérales droite et gauche.