AWS CodePipeline에서 GitHub 소스를 S3에 배포

소개

CodePipeline 설정 절차 비망록.

하고 싶은 일

GitHub에 push를 트리거하고 S3에 자동 배포하고 싶습니다

환경을 나누고 싶다 (개발, 스테이징, 프로덕션)

배포 결과를 slack 통지하고 싶다

구성도

※ ng new 명령으로 작성한 Angular 샘플 코드를 배포합니다.

설정 절차

1. CodePipeline 설정

파이프라인 만들기에서 만들기를 시작합니다.

파이프라인 이름을 입력하여 처음에는 새 역할을 만듭니다.

소스 프로바이더는 GitHub를 선택. (버전 1은 더 이상 사용되지 않으므로 버전 2 선택.)

참고:

"새 앱 설치"를 선택합니다.

리포지토리를 선택하고 Install을 누릅니다.

CodePipeline 설정 화면으로 돌아가서 리포지토리와 분기를 선택합니다.
(개발이나 스테이징, 프로덕션으로 환경을 나누어 사용하는 경우는, 환경 마다 브랜치와 파이프라인을 작성하는 것이 좋은 것일까요?) → 환경 마다 브랜치를 나누는, 라고 하는 것은 본래의 git의 사용법에서는 없기 때문에 NG

그런 다음 빌드 단계를 설정합니다.
AWS CodeBuild와 Jenkins를 선택할 수 있지만 여기에서는 AWS CodeBuild를 선택합니다.
"프로젝트 이름"항목에서 "프로젝트 만들기"를 선택합니다.

프로젝트를 만듭니다.
(여기서 설정한 환경 변수는 buildspec.yml에서 호출 할 수있는 것 같습니다.)

마지막으로 배포 단계 설정. S3을 선택합니다. (버킷은 미리 작성해 둡니다)

설정이 완료되면 구성된 파이프라인이 실행되지만 CodeBuild 실행이 실패합니다.
CodeBuild를 실행하려면 buildspec.yml이라는 yaml 파일에 빌드 시 실행할 쉘 명령을 작성하고 배포할 소스 코드의 루트 디렉토리에 배치해야 합니다.

루트 디렉토리에 다음과 같은 buildspec.yml을 만듭니다.
ng build 로 출력된 dist 디렉토리 부하의 파일을 S3 에 업로드하고 있습니다.

version: 0.2

phases:
  install:
    runtime-versions:
      nodejs: 12
    commands:
      - npm install -g
      - npm install --save-dev @angular-devkit/build-angular
      - npm install -g @angular/cli
  build:
    commands:
      - ng build
      - aws s3 sync dist s3://src-2021/application
artifacts:
  files:
    - '**/*'
  base-directory: 'dist*'