Partes del sitio en el diseño principal en NextJS
Echemos un vistazo a nuestro diseño de sitio. Actualmente, contiene el comando para insertar el contenido variable de la página:
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<main>
{children}
</main>
</body>
</html>
);
}
Sin embargo, un sitio usualmente también tiene otras partes que permanecen sin cambios para diferentes páginas. Por ejemplo, pueden ser el encabezado y el pie de página. Agreguémoslos a nuestro diseño:
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<header>
header
</header>
<main>
{children}
</main>
<footer>
footer
</footer>
</body>
</html>
);
}
Agrega al diseño de tu proyecto bloques para el encabezado, pie de página, así como para las barras laterales izquierda y derecha.