42kitrun Blog

개발 환경 vs 프로덕션 환경, 무엇이 다른가?

6 min read

개발 환경 vs 프로덕션 환경, 무엇이 다른가?

소프트웨어는 만드는 곳(dev) 과 실제 사용하는 곳(prod) 이 분리된다.
공식 문서에서 두 버전을 따로 설명하는 이유가 있다 — 목적이 근본적으로 다르기 때문이다.

1. 두 환경의 목적

[ 개발 환경 ]                     [ 프로덕션 환경 ]
  목적: 빠른 개발 · 디버깅           목적: 안정성 · 성능 · 보안
  대상: 개발자                       대상: 실제 사용자
  우선순위: 편의성                    우선순위: 신뢰성

2. 핵심 차이 비교

항목개발 (dev)프로덕션 (prod)
에러 출력상세한 스택 트레이스 노출사용자에게 숨김, 로그만 기록
로그 레벨DEBUG (모든 로그)ERROR / WARN (필요한 것만)
빌드 최적화없음 (빠른 재빌드 우선)번들 압축, 트리 쉐이킹, 미니파이
소스맵포함 (디버깅 목적)제외 또는 외부 저장
캐시비활성화 (변경 즉시 반영)적극 활성화 (성능)
환경 변수.env.local 등 로컬 파일서버/플랫폼 환경 변수
데이터베이스로컬 or 테스트 DB실제 운영 DB (백업 필수)
인증/보안느슨하게 허용엄격 (HTTPS, CORS, Rate limit)
HMR/핫리로드켜짐없음

3. 빌드 파이프라인 흐름

소스 코드
   │
   ▼
[ 개발 서버 ]──────────────────────────────────────────
│  - 소스맵 포함                                       │
│  - 에러 오버레이 (브라우저에 직접 표시)               │
│  - HMR (파일 변경 → 즉시 반영)                       │
│  - 최적화 없음 → 빌드 속도 우선                       │
────────────────────────────────────────────────────────

소스 코드
   │
   ▼
[ 프로덕션 빌드 ] ──────────────────────────────────────
│  1. 번들링 (여러 파일 → 하나로)                       │
│  2. 트리 쉐이킹 (사용 안 하는 코드 제거)              │
│  3. 미니파이 (공백·주석 제거, 변수명 축약)            │
│  4. 코드 스플리팅 (필요한 코드만 나눠서 로드)         │
│  5. 소스맵 분리 또는 제외                             │
──────────────────────────────────────────────────────── 
   │
   ▼
[ CDN / 서버 배포 ]

4. 에러 처리 방식 차이

개발 환경과 프로덕션에서 같은 에러가 발생했을 때:

[ 개발 환경 ]
  브라우저 오버레이 팝업
  ┌─────────────────────────────────┐
  │ TypeError: Cannot read property │
  │   at App.jsx:42                 │  ← 파일명·줄 번호 노출
  │   at render (react-dom.js:120)  │
  └─────────────────────────────────┘

[ 프로덕션 환경 ]
  사용자 화면 → "문제가 발생했습니다" (일반 메시지)
  서버 로그  → 상세 에러 기록 (외부 모니터링 도구: Sentry 등)

프로덕션에서 스택 트레이스를 노출하면 공격자에게 내부 구조를 알려주는 셈이다.

5. 환경 변수 관리

개발 환경
  .env.local          ← git에 커밋하지 않음
  .env.development    ← 공유 가능한 개발 기본값

프로덕션 환경
  플랫폼 환경 변수    ← Vercel, AWS, GCP 등에서 직접 설정
  (절대 코드/파일에 포함하지 않음)

공통 원칙: SECRET_KEY, DB 비밀번호, API 키는 어떤 환경이든 코드에 하드코딩 금지.

6. 각 환경에서 챙겨야 할 것

개발 환경

  • 핫리로드 설정으로 개발 속도 확보
  • 프로덕션 DB에 절대 연결하지 않기
  • 로컬에서 프로덕션 빌드도 주기적으로 테스트 (npm run build)

프로덕션 환경

  • HTTPS 강제 적용
  • 에러 모니터링 도구 연결 (Sentry, Datadog 등)
  • 로그 레벨 최소화 (성능 + 비용)
  • 환경 변수 노출 여부 점검
  • 자동화된 배포 파이프라인 (CI/CD) — 수동 배포는 실수 유발

정리

dev  → 개발자를 위한 환경: 상세한 정보, 빠른 피드백, 편의 우선
prod → 사용자를 위한 환경: 숨겨진 내부, 최적화된 성능, 보안 우선

NODE_ENV=development vs NODE_ENV=production 처럼 환경 변수 하나가
빌드 도구, 프레임워크, 라이브러리의 동작 방식을 통째로 바꾼다.
공식 문서가 두 환경을 나눠 설명하는 이유가 바로 이것이다.

그래프 뷰

백링크