2️라우팅
Last updated
Part 3 - Next.js로 나만의 블로그 만들기
Last updated
동적으로 경로를 지정하는 방식입니다. 대괄호로 묶어서 파일 이름([slug].tsx)을 지정하면, 그 이름으로 된 변수가 생기고, 그 변수를 페이지를 동적으로 그리는 단서로 활용하는 기법이죠.
리액트 서버 컴포넌트(RSC: React Server Component)를 적극적으로 활용하는 라우터. 다시 말해, 페이지 단위가 아니라 컴포넌트 단위로 서버에서 미리 렌더링하는 방식을 기본하는 라우터가 App Router입니다. pages라는 폴더 아래에 파일을 만들던 방식을 Pages Router라고 이름 붙이고 새로운 방식을 App Router라고 부르고 있습니다.
App Router는 처음 베타로 나왔을 때는 App Directory라고 불렸어요. 13.2 버전부터 App Router라고 불리고 있습니다.
경로들을 묶어서 관리하게 만드는 기법입니다. 괄호로 감싸서 폴더명을 지으면 그 아래에 있는 다른 폴더들, 다른 경로들이 하나의 레이아웃(layout.tsx)을 공유하는 구조입니다.
(marketing) 폴더 아래에 있는 blog, promotion은 같은 layout.js 파일을 공유하게 됩니다. (shop)/cart와 (shop)/account는 (shop)/layout.js 파일을 공유하게 되겠죠.
실제 서비스의 URL은 service.domain.com/blog, service.domain.com/promotion, service.domain.com/cart, service.domain.com/account 과 같이 사용됩니다. 괄호로 묶은 폴더는 경로에서 생략합니다.
