Not many websites consist of completely independent pages. For instance, this very guide (which was made with Rakkas, of course - so meta!) has a header, a footer, and a navigation menu that are common to all pages. Rakkas provides a nested layout system to handle this use case. If you create a file named
tsx) that default exports a React component, pages in the same directory and pages or nested layouts in its subdirectories will be wrapped by the layout.
Sometimes you want pages that don't share a common URL prefix to share a layout. You can group such pages under a directory with a name that starts with an underscore. The directory name will not be part of the URL path. For example you could have a directory structure like this:
layout.jsx(the root layout, common to all pages)
_app/(thematic group for most pages)
layout.jsx(common layout for most pages)
_admin(thematic group for admin pages)
layout.jsx(common layout for admin pages)