Next.js 14 시작하기 #1 Routing

강의 5번

Routing

• next.js는 라우팅 메커니즘에 기반한 파일 시스템을 가지고 있음
• 유저들이 브라우저를 통해 access 가능한 URL paths는 내 codebase가 있는 파일이나 폴더에 의해 정의됨

Routing Convention(라우팅 규칙)

• 모든 라우트는 app 폴더 내에 존재
• 라우트에 해당하는 모든 파일은 page.js나 page.tsx로 이름 지어져야 한다
• 모든 폴더는 브라우저 URL의 특정 위치로 해당되어진다 (폴더 이름에 따라 /폴더이름 과 같이 URL 라우팅이 된다는 뜻)

예시

• Scenario 1
  
  localhost:3000/ 페이지는
  
  src/app에 page.js 파일이 있어야 함
  layout.js 파일은 삭제하더라도 root route를 로드할때 자동으로 다시 생겨남

• Scenario 2
  
  localhost:3000/about 과 localhost:3000/profile URL에 각각 접근시 해당 페이지가 뜨도록 하려면
  
  src/app/about과 src/app/profile에 page.js 파일 있어야 함

  폴더 디렉토리 구조를 정리해보면 다음과 같음