내 워크플로우

모든 React 프로젝트의 템플릿으로 사용할 수 있는 저장소입니다. 컨텍스트 공급자 및 소비자가 이미 구성되었습니다.
Github Actions을 파이프라인으로 사용하여 테스트 e2e용 스냅샷, 단위 테스트용 Jest/React Testing Library와 함께 Cypress를 사용하여 CI/CD 작업을 수행하고 eslint 규칙도 확인합니다.

주요 패키지 및 버전:

반응: 17.0.2

react-router-dom: 6.0.2

스타일 구성 요소: 5.3.3

에스린트: 7.22.0

더 예쁘다: 2.5.0

사이프러스: 9.1.0

cypress-플러그인-스냅샷: 1.4.4

제출 카테고리:

DIY 배포

Yaml 파일 또는 코드 링크

실린데87 / React-app-template-with-testing-and-pipeline

Github의 Actions 파이프라인이 포함된 React 템플릿

모든 React 프로젝트의 템플릿으로 사용할 수 있는 저장소입니다. 컨텍스트 공급자 및 소비자가 이미 구성됨
Github Actions를 파이프라인으로 사용하여 테스트 e2e용 스냅샷과 함께 Cypress를 사용하는 CI/CD 작업, 단위 테스트용 Jest/React Testing Library 및 eslint 규칙 확인도 수행합니다.

사용 가능한 스크립트

yarn install

npm 종속성을 설치합니다.

yarn start

개발 모드에서 앱을 실행합니다. 브라우저에서 보려면 http://localhost:3000을 여십시오.
수정하면 페이지가 다시 로드됩니다. 또한 콘솔에 린트 오류가 표시됩니다.

yarn test

대화형 감시 모드에서 단위 테스트 러너(Jest/RTL)를 시작합니다.

yarn test:coverages

단위 테스트 러너(Jest/RTL)를 시작하고 테스트 커버리지 보고서를 표시합니다.

yarn cy:open:local

스냅샷이 꺼진 상태로 http://localhost:3000에서 e2e Test Runner(Cypress) 실행
URL 및 PREVIEW_ENV 플래그를 사용하도록 변경…

View on GitHub

추가 리소스/정보

github의 action yml 파일은 .github/workflows 폴더에 있으며 세 개의 파일로 구성되어 있습니다. 하나는 테스트용, 하나는 보푸라기용, 마지막 하나는 앱 빌드용입니다.

읽어 주셔서 감사합니다. 피드백을 부탁드립니다.