Next.js

환경 변수 설정

환경 변수(Environment Variables)는 배포 환경별 설정과 비밀값을 코드에서 분리합니다. Next.js에서는 빌드 시점에 고정되는 값과 서버 런타임에서만 읽어야 하는 값을 구분하지 않으면 클라이언트 번들에 비밀이 섞일 수 있습니다.

공개 변수와 서버 전용 변수를 구분하고 빌드 및 런타임 노출 범위를 기준으로 환경 변수를 설정합니다.

환경 변수 설정 흐름

1

환경 변수 경계 설정

환경별 값은 이름과 노출 범위를 먼저 정합니다.

2

Next.js에서 환경 변수 설정하기

Next.js는 .env 파일을 통한 로컬 환경 변수 관리와 Vercel 플랫폼을 통한 클라우드 환경 변수 관리를 모두 지원합니다.

3

Vercel을 이용한 클라우드 환경 변수 설정

Vercel 환경 변수는 환경별로 암호화해 런타임에 주입합니다.

4

환경 변수 관리 모범 사례 및 보안 팁

NEXT_PUBLIC_는 브라우저 공개 값에만 씁니다.