Skip to main content

Route groups

같은 URL 계층에서 폴더 구조를 논리적으로 분리할 때 route group을 사용합니다.

파일 구조

route-groups/
├── page.tsx
├── (marketing)/about/page.tsx     → /about
└── (shop)/products/page.tsx       → /products

핵심 파일 코드

// (marketing)/layout.tsx
const Layout = (props: { children: React.ReactNode }) => {
  return <div className="bg-highlight-blue-bg p-3">{props.children}</div>;
};

// (shop)/layout.tsx
const Layout = (props: { children: React.ReactNode }) => {
  return <div className="bg-highlight-green-bg p-3">{props.children}</div>;
};