Begrip: Layout route
Een layout route is een bestand met de naam layout.tsx dat een gedeelde layout bevat voor alle onderliggende pagina's. Dit betekent dat de layout in /src/app/layout.tsx toegepast wordt op alle pagina's in de applicatie. Er kan maximaal layout per subdirectory van de /src/app folder toegevoegd worden.
Layout routes worden niet herladen als de gebruiker navigeert tussen de verschillende geneste pagina's die onder dezelfde layout route vallen. Voor de root-layout betekent dit dus dat deze nooit herladen wordt, tenzij deze pagina expliciet geĂŻnvalideerd wordt.
De layout route op het root niveau moet een geldig HTML5 document bevatten, inclusief de <html>, <head> en <body> tags. Onderstaande code toont een minimaal voorbeeld.
const RootLayout: FunctionComponent<PropsWithChildren> = ({children}) => {
return (
<html>
<head>
<title>My App</title>
</head>
<body>{children}</body>
</html>
)
}
export default RootLayout:::