Parti del sito nel layout principale in NextJS
Diamo un'occhiata al layout del nostro sito. Al momento è specificato il comando per l'inserimento del contenuto variabile della pagina:
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<main>
{children}
</main>
</body>
</html>
);
}
Tuttavia, di solito un sito ha anche altre parti che rimangono invariate per le diverse pagine. Ad esempio, potrebbero esserci l'header e il footer. Aggiungiamoli al nostro layout:
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<header>
header
</header>
<main>
{children}
</main>
<footer>
footer
</footer>
</body>
</html>
);
}
Aggiungi al layout del tuo progetto un blocco con l'header, il footer, e anche con le sidebar destra e sinistra.
