728x90
VS Code, Jest, Jenkins를 활용한 TDD 및 테스트 자동화 구축
프로젝트 개요:
이 프로젝트에서는 간단한 계산기 애플리케이션을 TDD 방식으로 개발하고, 이를 Jest와 Jenkins를 사용해 자동화된 테스트 환경을 구축하는 것을 목표로 합니다. 사용자는 더하기, 빼기, 곱하기, 나누기 기능을 수행할 수 있으며, 모든 함수는 TDD로 개발됩니다. 이후 GitLab CI/CD 또는 Jenkins를 통해 테스트 자동화를 구현합니다.
강의 1: TDD 소개 및 개발 환경 설정
개요:
- 테스트 주도 개발(TDD)에 대한 소개
- Windows 10에서 개발 환경 설정
- VS Code 설치
- Node.js 및 NPM 설치 (Jest 실행을 위해)
- 버전 관리를 위한 Git 설치
- Jest와 Jenkins에 대한 개요 (Jest는 테스트 프레임워크, Jenkins는 CI 도구)
다룰 주제:
- TDD란 무엇인가?
- TDD 원칙 설명
- TDD가 코드 품질과 개발 속도를 개선하는 이유
- Visual Studio Code (VS Code) 설치
- Windows 10에서 VS Code 다운로드 및 설치
- 기본 설정 및 주요 확장 (ESLint, Prettier, Jest)
- Node.js 및 NPM 설치
- 공식 웹사이트에서 Node.js 다운로드
- NPM 설치 (Node.js에 포함됨)
- 설치 확인 방법
- 버전 관리를 위한 Git 설치
- Git 다운로드 및 설정
- 초보자를 위한 기본 Git 명령어 (clone, commit, push)
강의 2: Jest 설정 및 첫 번째 테스트 작성
개요:
- 테스트 프레임워크로 Jest 설치 및 설정
- 첫 번째 테스트 작성
- VS Code에서 테스트 실행
다룰 주제:
- Jest 설치
- NPM을 통해 Jest 설치
- 프로젝트에서 Jest 설정 (기본 설정 package.json에 추가)
- 첫 번째 테스트 작성
- Jest의 기본 문법 설명 (describe, it, expect)
- 간단한 함수와 테스트 작성 예시 (예: 계산기 함수 테스트)
- VS Code에서 테스트 실행
- VS Code의 터미널을 통해 테스트 실행
- 테스트 실행 및 디버깅을 위한 Jest VS Code 확장 설정
강의 3: React에서 TDD 적용
개요:
- React 개발에 TDD 원칙 적용
- TDD로 React 컴포넌트 생성
- Jest와 React Testing Library를 사용하여 React 컴포넌트 테스트
다룰 주제:
- Jest를 사용한 React 테스트 소개
- Jest와 React Testing Library를 사용한 컴포넌트 테스트 방법
- 데이터와 이벤트 모킹(mocking)
- TDD 흐름에 따른 테스트 작성
- 새로운 React 컴포넌트에 대한 테스트 작성 (예: 버튼 또는 폼)
- 테스트를 통과할 수 있는 컴포넌트 구현
- 리팩토링 및 테스트 통과 확인
- 예시: 간단한 카운터 컴포넌트 작성
- TDD 프로세스: 실패하는 테스트 작성, 테스트를 통과시키는 코드 작성, 리팩토링
강의 4: Jenkins를 사용한 테스트 자동화
개요:
- Jenkins 설정 및 테스트 자동화
- Jest 테스트를 자동으로 실행하는 Jenkins 파이프라인 작성
다룰 주제:
- Windows 10에서 Jenkins 설치
- Jenkins 다운로드 및 서비스로 설정
- Node.js 및 NPM을 위한 Jenkins 설정
- Jest를 위한 Jenkins 파이프라인 생성
- Jest 테스트 자동화를 위한 Jenkinsfile 작성
- GitHub와의 통합을 통해 푸시 시마다 테스트 실행
- Jenkins에서 테스트 결과 확인
강의 5 : GitLab을 사용한 테스트 자동화
개요:
이 블로그 글에서는 GitLab을 사용해 테스트 자동화를 설정하는 방법을 다룹니다. GitLab CI/CD 파이프라인을 통해 Jest 테스트를 자동으로 실행하고, 코드 변경 사항이 있을 때마다 테스트를 실행하여 코드 품질을 유지할 수 있는 방법을 소개합니다.
다룰 주제:
- GitLab CI/CD란?
- GitLab CI/CD 환경 설정
- Jest 테스트 자동화
- GitHub와 GitLab 통합을 통한 자동화
- GitLab에서 테스트 결과 확인
강의 6: 고급 TDD 기술 및 지속적 통합
개요:
- React 애플리케이션에서 고급 TDD 기술 적용
- 테스트 커버리지 확장
- Jenkins를 이용한 지속적 통합 최종 구축
다룰 주제:
- React에서 고급 테스트 기술
- 비동기 작업 및 API 호출 테스트
- Jest에서 스냅샷 테스트 사용
- 테스트 커버리지 확장
- Jest로 테스트 커버리지 분석
- 엣지 케이스를 다루기 위한 추가 테스트 작성
- Jenkins를 사용한 모든 것 자동화
- 지속적 통합 및 자동 배포를 위한 Jenkins 설정
- 다양한 환경에서 테스트 실행 (예: 크로스 브라우저 테스트)
- GitLab을 사용한 모든 것 자동화
- GitLab Runner 설치
- 빌드 및 배포 자동화
주요 내용 정리:
- 초보자도 따라할 수 있도록 단계별로 상세한 예제와 설명을 제공합니다.
- 강의 시리즈를 마치면 TDD와 자동화 테스트 환경을 완벽하게 설정할 수 있으며, Jenkins를 통해 코드 푸시 시마다 자동으로 테스트가 실행되는 환경을 구축할 수 있습니다.
728x90
'개발 방법론 & 아키텍쳐' 카테고리의 다른 글
| React 프로젝트에서 Storybook 사용하는 방법 (0) | 2024.10.07 |
|---|---|
| 강의 1(React TDD): TDD 소개 및 개발 환경 설정 (4) | 2024.10.07 |
| TDD로 React 프론트앤드 개발하기(feat. VS Code) (2) | 2024.10.04 |
| 리액트 개발 프로젝트에서 유닛 테스트 자동화 방법 비교 (1) | 2024.10.04 |
| Feature-Sliced Design(FSD) 아키텍처와 Public API 관리(feat. React) (4) | 2024.10.02 |