React · CI/CD

프런트엔드 CI/CD 검증 기준

CI/CD는 자동 배포 버튼이 아니라, 변경 코드가 타입·테스트·빌드·미리보기·롤백 조건을 통과해야 사용자에게 나가도록 만드는 게이트다.

01

빠른 검증

lint와 typecheck가 기본 문법·타입 문제를 먼저 막는다.

02

행동 테스트

컴포넌트 테스트와 E2E가 핵심 사용자 경로를 확인한다.

03

빌드 산출

production build가 통과하고 번들 크기나 asset 경로를 점검한다.

04

점진 배포

preview와 staging에서 확인한 뒤 production에 배포하고 오류율을 본다.

Lint
일관성 hook 규칙, 접근성 규칙, 사용하지 않는 코드 감지
자동 수정 범위 제한
Typecheck
계약 검증 props, API 모델, route params 타입 drift 확인
빌드와 별도 실행 가능
E2E
사용자 흐름 로그인, 검색, 제출 같은 핵심 경로 확인
적지만 가치 높은 시나리오
Preview
시각 검수 PR마다 실제 URL로 모바일·데스크톱 확인
환경 변수 분리

게이트 · 환경 · 롤백 점검

게이트 빌드 실패나 테스트 실패가 production 배포를 막는다.
환경 preview가 production API나 비밀값을 잘못 쓰지 않는다.
롤백 배포 후 오류가 나면 이전 정상 버전으로 되돌릴 수 있다.
알림 배포 실패와 운영 오류가 담당자에게 도달한다.