NextJS 개발 환경 구성하기 - Github Actions로 배포 스크립트 추가

HyeonWooGa·2022년 7월 9일
0

이전에 생성해놓은 컨테이너 환경을 클라우드에 올리면 클라우드 내에서 동작하게 됩니다.

  • 보편적으로 Kubernetes 와 함께 사용하거나 Docker 에 올립니다.
  • 환경에 따라서 Vercel 에 올릴 수도 있고 어느 곳에 업로드를 하거나 Vercel, Docker 전부 사용하지 않고 NextJS 로만 AWS 에 올릴수도 있습니다.
  • 비즈니스 방향에 따라서 정하면 됩니다.

분산 컨테이너환경이 무중단 배포가 가능하기 때문에 가장 좋습니다

  • 부산 컨테이너환경에 대표적인 것이 Kubernetes 입니다.
  • 다만 환경과 비즈니스 목적에 따라서 무엇을 사용할지 정하면 됩니다.

Github Actions 개요

  • GIthub Actions : 깃허브 내에서 사용하는 CI/CD
    • CI(Continuous Integration) : 지속 통합
    • CD(Continuous Delivery) : 지속 제공(배포)
    • build, test, pull request, merger, deploy, 통계 데이터 수집 등을 자동화 시킬 수 있습니다.
    • 비슷한 서비스 : Jenkins, Circle CI, Travis CI

Gihub Actions 추가(세팅)

  1. .github 폴더 내에 workflows 폴더를 생성하고 DEPLOY.yaml 파일을 생성합니다.
  2. 다양한 레시피(가이드) 중에 이 강의에서는 Deploying to Amazon Elastic Container Service 의 가이드를 따르기 때문에 해당 yaml 파일 예를 DEPLOY.yaml 파일에 작성해 줍니다. (배포를 위해서 아마존 계정을 인증하는 것이 먼저지만 이번엔 우선 세팅 먼저 합니다.)
  3. 위의 레시피 코드에서 env 부분은 사용할 AWS의 정보를 입력해줍니다.
  4. workflows 폴더 안에 BUILD.yaml 파일을 추가 생성하고 Building and testing Node.js 레시피를 찾아 작성해줍니다.
    • BUILD.yaml 파일 내에서 노드 버전 확인 후 해당 노드 버전만 입력해 줍니다. (저는 16.x 입니다.)

Github Actions 동작 확인

  1. develop 브랜치를 만들고 커밋, 푸시 후 빌드와 테스트가 잘 되는지 레포지토리 내 actions 에서 확인할 수 있습니다.

workflow 를 정의해야 하는 이유

  • 계속 개발작업을 진행하면서 빌드가 잘 되는지 테스트가 잘 되는지 등을 CI(Github Actions)를 검증한 후에 merge 해줘서 코드를 안정적으로 지속해서 유지할 수 있습니다.

현재 Actions 에서 테스트가 계속 끝나지 않는 오류발생

  • 스크립트 test"jest --watch" 로 설정되어 있기 때문에 문제 발생하였습니다
  • scripts: {..., "test":"jest", "test:watch":"jest --watch", ...} 로 변경하여 문제해결 하였습니다.

배포 테스트를 제외한 개발환경 세팅이 완료되었습니다. (배포 테스트는 추후 진행)

  • 빌드, 테스트, CI 환경이 모두 세팅되었습니다.
  • 배포 AWS 세팅만 마무리되면 Ready to Production 상태가 완성됩니다.
  • 지금까지 진행한 것처럼 기본적인 Ready to Production 환경을 세팅한 후에 스테이지 환경, 데브 환경을 만드는 것을 권장합니다.
profile
Aim for the TOP, Developer

0개의 댓글