What is root layout?
The root layout is defined at the top level of the app directory and applies to all routes. This layout enables you to modify the initial HTML returned from the server.
The app directory must include a root layout.
The root layout must define <html> and <body> tags since Next.js does not automatically create them.
Only the root layout can contain <html> and <body> tags.
You can use the built-in SEO support to manage <head> HTML elements, for example, the <title> element.
You can use route groups to create multiple root layouts. See an example here.
The root layout is a Server Component by default and can not be set to a Client Component.
The root layout replaces the _app.js and _document.js files.