Next.js layout

What is a layout?

A layout in Next.js is UI that’s shared between multiple pages. On navigation layouts preserve state, remain interactive and don’t re-render.

How to create a layout?

Create a layout.tsx file that exports a React component and accepts a children prop. The children prop can be a page or another layout.