본문 바로가기

Parallel Routes2

[next 14 공식문서 부시기] 2.8 Parallel Routes(병렬 경로) Parallel Routes (병렬 경로) 병렬 경로를 사용하면 동일한 레이아웃 내에서 하나 이상의 페이지를 동시에 또는 조건부로 렌더링할 수 있습니다. 이는 대시보드 및 소셜 사이트의 피드와 같이 앱의 매우 동적인 섹션에 유용합니다. Slots 병렬 경로는 @folder 와 같은 형식으로 정의되는 slots 을 통해 생성됩니다. 슬롯은 공유 상위 레이아웃에 props 으로 전달됩니다. 아래의 예에서 app/layout.js 의 component 는 @analytics 및 @team 슬롯 props 을 받아 이를 children props 과 함께 병렬로 렌더링할 수 있습니다. ※ 그러나 슬롯은 경로 세그먼트가 아니며 URL 구조에 영향을 주지 않습니다. 예를 들어 /dashboard/@analytics.. 2024. 2. 5.
[next 14 공식문서 부시기] 2. Next.js 라우팅 맛보기 App 라우터 13 버전부터 Next.js는 공유 레이아웃, 중첩 라우팅, 로딩 상태, 오류 처리 등을 지원하는 React Server Components 를 기반으로 구축된 새로운 App Router를 도입했습니다. App Router 는 app이라는 새 디렉토리에서 작동합니다. app 디렉토리는 pages 디렉토리와 함께 작동하여 점진적인 채택을 허용합니다. Pages Router 문서 참조 기본적으로 앱 내부의 구성 요소는 React Server Components입니다. 이는 성능 최적화에 유리하고 Client Components도 사용할 수 있습니다.App 라우팅 관련 파일 layout : 공통적으로 감싸지는 ui 파일page : 페이지 관련 ui 파일loading : 로딩시 보여질 대체 ui .. 2024. 1. 12.