Photo Gallery — Intercepting Route Demo
사진을 클릭하면 모달로 열립니다 (인터셉트). URL을 직접 입력하면 전체 페이지로 열립니다.
파일 구조
gallery/
├── layout.tsx ← children + @modal 수신
├── page.tsx ← 사진 그리드 (이 페이지)
├── default.tsx ← children fallback
├── @modal/
│ ├── default.tsx ← 비어있음 (모달 없음)
│ └── (.)photo/
│ └── [id]/
│ └── page.tsx ← 모달 뷰 (인터셉트)
└── photo/
└── [id]/
└── page.tsx ← 전체 페이지 뷰 (직접 URL)(.)photo — 같은 레벨 인터셉트
(.)photo는 같은 레벨의 photo 세그먼트를 인터셉트합니다. Link 클릭(소프트 내비게이션) 시 @modal 슬롯에서 모달로 렌더링되고, URL 직접 입력(하드 내비게이션) 시 원래 photo/[id]/page.tsx가 전체 페이지로 렌더링됩니다.