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

// src/pages/(admin)/layout.tsx
import { Outlet } from "react-router-dom"

export function Component() {
  return (
    <section>
      {/* Layout content */}
      <nav></nav>
      <Outlet />
    </section>
  )
}