넥스트js
[next.js] 개발모드 vs 빌드모드🤔
민ズl
2024. 12. 12. 01:40
✔️개발모드
npm run dev
- 실시간 코드 반영
- 서버 렌더링(모든 페이지를 서버에서 요청 시점에 렌더링, 정적 페이지도 요청시 즉성 생성)
- 설정이 완벽하지 않아도(예: getStaticPaths를 작성하지 않아도) 동작하도록 Next.js가 도와줌
- 페이지를 즉시 렌더링하지만, 빌드 최적화는 적용x
- 개발중에 사용
✔️빌드모드
npm run build // 빌드 파일 생성
npm run start // 실행
- getStaticProps와 getStaticPaths를 통해 빌드 타임에 필요한 정적 페이지를 미리 생성
- 페이지와 코드가 압축되고, 성능 최적화가 적용
- 개발모드에서는 문제없이 작동하던 코드도 빌드 타임에 에러가 발생할 수 있음
- 생성된 정적 파일을 사용하므로 요청에 대한 응답이 매우 빠름
- 실제 서버에 배포하기 전에 사용