Partes do site no layout principal no NextJS
Vamos dar uma olhada no layout do nosso site. Atualmente, ele contém o comando para inserir o conteúdo variável da página:
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<main>
{children}
</main>
</body>
</html>
);
}
No entanto, um site geralmente também tem outras partes que permanecem inalteradas em diferentes páginas. Por exemplo, podem ser o cabeçalho (header) e o rodapé (footer). Vamos adicioná-los ao nosso layout:
export default function RootLayout({children}) {
return (
<html lang="en">
<body>
<header>
header
</header>
<main>
{children}
</main>
<footer>
footer
</footer>
</body>
</html>
);
}
Adicione ao layout do seu projeto um bloco com o cabeçalho (header), o rodapé (footer), assim como as barras laterais (sidebars) direita e esquerda.
