라우팅 구조 지도

폴더 표기법 UI 책임

`(group)`, `@slot`, `(.)` 계열 표기는 서로 다른 문제를 풉니다. 같은 폴더 구조 안에서도 목적을 분리해 읽어야 합니다.

1 (marketing)

Route Groups

URL에 나타나지 않는 폴더로 페이지를 논리적으로 묶고, 그룹별 layout을 적용합니다.

목적

폴더 정리와 layout 분리

URL

괄호 이름은 경로에서 제외

폴더 표기 책임

최종 URL 충돌을 피함

2 @analytics

Parallel Routes

하나의 layout이 여러 슬롯을 받아 독립 패널을 동시에 렌더링합니다. 패널별 loading, error, default를 나눌 수 있습니다.

목적

독립 UI 스트림 구성

파일

default.tsx 준비

폴더 표기 책임

슬롯 간 의존도 축소

3 (..)photo

Intercepting Routes

현재 화면의 컨텍스트를 유지한 채 다른 route를 모달이나 오버레이로 보여주고, 직접 접근용 전체 페이지도 유지합니다.

목적

목록 위 상세 모달

파일

원본 상세 route 유지

폴더 표기 책임

깊이 표기와 접근성 확인

layout

props 이름 확인

슬롯 폴더 이름이 layout props와 일치해야 합니다.

default

새로고침 대비

병렬 슬롯과 모달 슬롯은 빈 상태 파일을 준비합니다.

URL

충돌 경로 제거

서로 다른 그룹이 같은 최종 경로를 만들지 않게 봅니다.

a11y

모달 동작 점검

포커스, ESC, 배경 스크롤 잠금을 함께 설계합니다.