개발 방법론 & 아키텍쳐

VS Code, Jest, Jenkins를 활용한 TDD 및 테스트 자동화 구축(6강)

atomicdev 2024. 10. 5. 04:30
728x90

VS Code, Jest, Jenkins를 활용한 TDD 및 테스트 자동화 구축

 

프로젝트 개요:

이 프로젝트에서는 간단한 계산기 애플리케이션을 TDD 방식으로 개발하고, 이를 Jest와 Jenkins를 사용해 자동화된 테스트 환경을 구축하는 것을 목표로 합니다. 사용자는 더하기, 빼기, 곱하기, 나누기 기능을 수행할 수 있으며, 모든 함수는 TDD로 개발됩니다. 이후 GitLab CI/CD 또는 Jenkins를 통해 테스트 자동화를 구현합니다.

 

TDD 워크플로우

강의 1: TDD 소개 및 개발 환경 설정

개요:

  • 테스트 주도 개발(TDD)에 대한 소개
  • Windows 10에서 개발 환경 설정
    • VS Code 설치
    • Node.js 및 NPM 설치 (Jest 실행을 위해)
    • 버전 관리를 위한 Git 설치
  • Jest와 Jenkins에 대한 개요 (Jest는 테스트 프레임워크, Jenkins는 CI 도구)

다룰 주제:

  1. TDD란 무엇인가?
    • TDD 원칙 설명
    • TDD가 코드 품질과 개발 속도를 개선하는 이유
  2. Visual Studio Code (VS Code) 설치
    • Windows 10에서 VS Code 다운로드 및 설치
    • 기본 설정 및 주요 확장 (ESLint, Prettier, Jest)
  3. Node.js 및 NPM 설치
    • 공식 웹사이트에서 Node.js 다운로드
    • NPM 설치 (Node.js에 포함됨)
    • 설치 확인 방법
  4. 버전 관리를 위한 Git 설치
    • Git 다운로드 및 설정
    • 초보자를 위한 기본 Git 명령어 (clone, commit, push)

강의 2: Jest 설정 및 첫 번째 테스트 작성

개요:

  • 테스트 프레임워크로 Jest 설치 및 설정
  • 첫 번째 테스트 작성
  • VS Code에서 테스트 실행

다룰 주제:

  1. Jest 설치
    • NPM을 통해 Jest 설치
    • 프로젝트에서 Jest 설정 (기본 설정 package.json에 추가)
  2. 첫 번째 테스트 작성
    • Jest의 기본 문법 설명 (describe, it, expect)
    • 간단한 함수와 테스트 작성 예시 (예: 계산기 함수 테스트)
  3. VS Code에서 테스트 실행
    • VS Code의 터미널을 통해 테스트 실행
    • 테스트 실행 및 디버깅을 위한 Jest VS Code 확장 설정

강의 3: React에서 TDD 적용

개요:

  • React 개발에 TDD 원칙 적용
  • TDD로 React 컴포넌트 생성
  • Jest와 React Testing Library를 사용하여 React 컴포넌트 테스트

다룰 주제:

  1. Jest를 사용한 React 테스트 소개
    • Jest와 React Testing Library를 사용한 컴포넌트 테스트 방법
    • 데이터와 이벤트 모킹(mocking)
  2. TDD 흐름에 따른 테스트 작성
    • 새로운 React 컴포넌트에 대한 테스트 작성 (예: 버튼 또는 폼)
    • 테스트를 통과할 수 있는 컴포넌트 구현
    • 리팩토링 및 테스트 통과 확인
  3. 예시: 간단한 카운터 컴포넌트 작성
    • TDD 프로세스: 실패하는 테스트 작성, 테스트를 통과시키는 코드 작성, 리팩토링

강의 4: Jenkins를 사용한 테스트 자동화

개요:

  • Jenkins 설정 및 테스트 자동화
  • Jest 테스트를 자동으로 실행하는 Jenkins 파이프라인 작성

다룰 주제:

  1. Windows 10에서 Jenkins 설치
    • Jenkins 다운로드 및 서비스로 설정
    • Node.js 및 NPM을 위한 Jenkins 설정
  2. Jest를 위한 Jenkins 파이프라인 생성
    • Jest 테스트 자동화를 위한 Jenkinsfile 작성
    • GitHub와의 통합을 통해 푸시 시마다 테스트 실행
    • Jenkins에서 테스트 결과 확인

강의 5 : GitLab을 사용한 테스트 자동화

개요:
이 블로그 글에서는 GitLab을 사용해 테스트 자동화를 설정하는 방법을 다룹니다. GitLab CI/CD 파이프라인을 통해 Jest 테스트를 자동으로 실행하고, 코드 변경 사항이 있을 때마다 테스트를 실행하여 코드 품질을 유지할 수 있는 방법을 소개합니다.

 

다룰 주제:

  1. GitLab CI/CD란?
  2. GitLab CI/CD 환경 설정
  3. Jest 테스트 자동화
  4. GitHub와 GitLab 통합을 통한 자동화
  5. GitLab에서 테스트 결과 확인
 

강의 6: 고급 TDD 기술 및 지속적 통합

개요:

  • React 애플리케이션에서 고급 TDD 기술 적용
  • 테스트 커버리지 확장
  • Jenkins를 이용한 지속적 통합 최종 구축

다룰 주제:

  1. React에서 고급 테스트 기술
    • 비동기 작업 및 API 호출 테스트
    • Jest에서 스냅샷 테스트 사용
  2. 테스트 커버리지 확장
    • Jest로 테스트 커버리지 분석
    • 엣지 케이스를 다루기 위한 추가 테스트 작성
  3. Jenkins를 사용한 모든 것 자동화
    • 지속적 통합 및 자동 배포를 위한 Jenkins 설정
    • 다양한 환경에서 테스트 실행 (예: 크로스 브라우저 테스트)
  4. GitLab을 사용한 모든 것 자동화 
    • GitLab Runner 설치
    • 빌드 및 배포 자동화

주요 내용 정리:

  • 초보자도 따라할 수 있도록 단계별로 상세한 예제와 설명을 제공합니다.
  • 강의 시리즈를 마치면 TDD와 자동화 테스트 환경을 완벽하게 설정할 수 있으며, Jenkins를 통해 코드 푸시 시마다 자동으로 테스트가 실행되는 환경을 구축할 수 있습니다.
728x90