Next.js
Next.js [Route]
주인알라코
2023. 1. 8. 17:18
Next.js = React + Express.js + React-Router-Dom + Sever Side Rendering 기능들이 내재화 되어 있다고 생각.
Next.js 설치
개발환경 세팅
npx create-next-app@latest test => test 폴더에 개발환경 세팅
개발환경실행 : npm run dev
배포 파일 생성 : npm run build
서비스 시작 : npm run start
pages 폴더 안 index.js 가 페이지를 보여주는 곳
우리가 애플리케이션을 만들 때 늘 따져보는 것이 Route 인데 url에 따라서 ui를 어떻게 응답할 것인가를 결정하게 하는 행위가 되게 된다.
pages/index.js => http://localhost:3000/
pages/sub/index.js => http://localhost:3000/sub
pages/sub/about.js => http://localhost:3000/sub/about
디렉토리 명 안에 컴포넌트 이름이 url 이름이 된다.
API Route
Next.js 의 중요한 특징 중 하나는 CRS, SRR 의 기능을 둘 다 가지고 있는 올인원 솔루션이라는 것인데 SRR 기술 쪽을 API Route 라고 부른다. 서버로부터 데이터를 받아야 하기 때문에 사용.