[12주차] Next.js : Pages Router 라우터 설정하기

라우터 설정하기

Next.js 에서는 Pages라는 폴더 안에 들어있는 컴포넌트 파일 하나 하나가 자동적으로 라우터 설정이 된다.

단, 조건은

• 함수(컴포넌트)의 이름은 라우터 설정에 영향이 없다
• 함수가 default로 export 되어야 한다
• 파일명을 restful 하게 잘 지어야 한다 WHY? 파일명이 곧 url의 resource path로 들어가기 때문이다. 

(예 : 파일명 about.js -> url http://localhost:3001/about)

 

index.js 는 기본url 주소로 연결된다.

 

 

 

 

Pages 폴더 안에 넣을 수 있는 몇 가지 예외사항

1. index.js 는 기본 url 로 연결된다. (http://localhost:3000/index)라는 건 없음.

 

2. jsx를 쓰고 있다면 React.js를 import할 필요없음 (1번째줄). 단 useEffect, useState와 같은 react의 hook을 쓸때는 import 필요