Next.js에서 환경 변수를 사용할 때 NEXT_PUBLIC_ 접두사는 무엇을 의미하나요?

Next.js에서 NEXT_PUBLIC_ 접두사가 붙은 환경 변수는 클라이언트 번들에 포함될 수 있음을 의미합니다. 즉 브라우저에서 누구나 볼 수 있는 값으로 취급해야 합니다.

예시

DATABASE_URL=postgres://...          # 서버 전용
NEXT_PUBLIC_ANALYTICS_ID=G-XXXX      # 클라이언트 노출 가능

console.log(process.env.NEXT_PUBLIC_ANALYTICS_ID);

중요한 보안 원칙

API secret, DB password, private key, OAuth client secret은 절대 NEXT_PUBLIC_로 두면 안 됩니다. 빌드된 JavaScript를 열어보면 값이 노출될 수 있습니다.

빌드 시점 주의

클라이언트에 포함되는 환경 변수는 보통 빌드 시점에 값이 박힙니다. 컨테이너를 한 번 빌드해 여러 환경에 배포할 때 staging 값이 production에 남는 문제가 생길 수 있습니다.

실무 구분

• 서버 전용: DB URL, secret key, internal API token
• 공개 가능: analytics id, public API base URL, feature flag 중 민감하지 않은 값
• 애매하면 서버 Route Handler를 통해 감싸고 클라이언트에는 직접 노출하지 않습니다.

면접 답변 포인트

NEXT_PUBLIC_은 브라우저 노출을 허용한다는 표시입니다. 비밀값에는 사용하면 안 되고, 빌드 시점 주입 특성도 고려해야 한다고 답하면 됩니다.