Route Group
Reference Next.js Route Groups
In the pages
directory, we can use (folderName)
to implement route groups.
This is often used for:
- Organizing routes into groups, such as by page purpose, type, etc.
- Sharing layouts
IMPORTANT
In the pages
directory, the files under (folderName)
directory will be considered as route groups
Layout
Route group layout can be placed in (folderName)/layout.tsx
tsx
// src/pages/(admin)/layout.tsx
import { Outlet } from "react-router-dom"
export function Component() {
return (
<section>
{/* Layout content */}
<nav></nav>
<Outlet />
</section>
)
}