고급 라우팅 적용 전에는 서버/클라이언트 경계와 fallback 파일을 먼저 점검한다
겉보기 폴더 구조가 맞아도 params, client hook, default.tsx, 접근성 설계를 놓치면 실제 앱에서 깨진다.
| 점검 항목 | 확인할 코드 | 놓치면 생기는 문제 | A급 구현 기준 |
|---|---|---|---|
| params 사용 | page props의 params | Next 최신 App Router 문법과 불일치 | 서버 page에서 params Promise를 await |
| client hook | useRouter, onClick | 서버 컴포넌트에 이벤트 핸들러를 섞음 | Client 컴포넌트로 분리하거나 Link로 단순화 |
| slot fallback | @slot/default.tsx | 직접 접근/새로고침에서 슬롯이 비어 깨짐 | 각 슬롯에 default.tsx를 둠 |
| modal accessibility | focus, ESC, scroll lock | 모달은 보이지만 사용성이 낮음 | 닫기 경로와 포커스 이동을 명시 |
| URL collision | (auth)/login + (admin)/login | 같은 최종 URL로 빌드 오류 | 라우트 그룹별 최종 URL 표를 먼저 작성 |
| data boundary | slot 간 공유 데이터 | 한 패널 실패가 전체 화면 실패로 번짐 | 슬롯별 loading/error와 데이터 조회 범위 분리 |