Dev Server

개발 서버와 next.config

포트 변경, 자동 반영, 이미지 최적화, Strict Mode, 환경 변수를 개발 중 확인해야 할 설정으로 묶습니다.

npm run dev

개발용 실행

코드를 저장하며 브라우저 화면이 갱신되는지 확인하는 기본 작업입니다.

images

외부 이미지 허용

원격 이미지 도메인은 next.config.js에 명시해야 최적화가 동작합니다.

env

환경별 값 분리

공개 값과 서버 전용 값을 구분해 설정 파일과 .env를 함께 봅니다.

운영 전 습관

개발 서버에서 설정 변경의 영향을 바로 확인

설정은 문법을 맞춰도 재시작이나 환경 변수 이름이 틀리면 화면에서 반영되지 않을 수 있습니다.

점검 순서

실행터미널에서 서버가 켜지고 주소가 출력되는지 확인합니다.
변경page.tsx를 수정해 저장 반영이 되는지 봅니다.
설정next.config.js 변경 후 필요한 경우 서버를 다시 시작합니다.