[Github] Github Actions를 이용한 AWS S3 배포 자동화

AWS에서는 S3와 CloudFront를 사용해서 정적 콘텐츠를 대규모 저장하고, 보호 및 전송함으로써 쉽게 CSR 웹 페이지를 배포(S3) 및 CDN 역할(CloudFront)을 적용할 수 있다.

 

물론 프로젝트 빌드와 aws cli를 이용한 s3 배포를 수동으로 작업해줄 수 있다.

만약 테스트 완료된 코드를 Github에 업로드 시에 배포가 자동으로 이루어진다면 혹시나 발생할 수 있는 배포 과정의 실수나 번거로움을 줄일 수 있을 것이다. Github Actions으로는 이러한 작업이 가능하다.

 

Github Actions이란?

[Github] Github Actions를 이용한 CI/CD

 

Github Actions를 이용한 배포 자동화의 장점

• 배포 과정에서 발생할 수 있는 실수 감소
• 테스트 환경과 배포 환경 동기화 가능(배포가 되었는지 하나하나 체크할 필요X)
• 소스 코드 관리부터 배포 자동화가 동시에 가능 

Github Actions 동작 구성

Github Actions가 특정 브랜치의 변경을 감시하다가, 변경이 감지되면 Workflow 프로세스를 실행하고, 이때 빌드과정과 S3 배포 과정이 실행된다.

 

S3로 접근을 위한 사용자 추가

Github에서 배포를 위해 AWS S3로 접근하기 위해서는 권한이 필요하다.

간단하게 S3에 파일을 업로드할 수 있는 권한을 가진 사용자를 추가하고, Github는 사용자의 Access Key 정보를 이용해서 S3로의 권한을 얻을 수 있다.

 

우선 AWS IAM에서 사용자 추가를 눌러 임의의 이름을 설정한 후 아래와 같이 AWS 자격 증명 유형으로 액세스 키-프로그래밍 방식 액세스를 선택한다.

 

다음 권한 설정에서 기존 정책 직접 연결 > AmazonS3FullAccess를 선택한다.

검토를 거쳐 사용자 만들기를 누르면 아래와 같이 Access Key ID와 Secret Access 정보를 .csv 파일로 다운 받을 수 있다.

아래 과정에서 두 정보가 필요함으로 적당한 곳에 파일을 저장해 놓는다.

 

 

Workflow 설정

Github Action을 등록하기 위해 .github/workflows 폴더 안에 yml 설정 파일을 만든다.

repository에 들어가보면 Actions에서 [new work flow]>[set up a workflow yourself]로 만들 수도 있다.

하지만.. only for the main branch..

# Triggers the workflow on push or pull request events but only for the main branch

변경 방법이 있는지 알아봤지만, 못찾겠다.

다른 branch에 트리거링 해야한다면, 수동으로 작업해보자.

 

# sub-branch-deploy-work.yml
name: sub-branch

on:
  push:
    branches:
      - sub-branch    # sub-branch[branch name] 브랜치에서 push 이벤트가 일어났을 때 실행

jobs:
  build:
    runs-on: ubuntu-18.04
    steps:
      - name: Checkout source code
        uses: actions/checkout@master

      - name: Cache node modules  # node modules 캐싱
        uses: actions/cache@v1
        with:
          path: node_modules
          key: ${{ runner.OS }}-master-build-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.OS }}-build-
            ${{ runner.OS }}-

      - name: Install Dependencies # node module install
        run: yarn

      - name: Build # project build
        run: yarn build

      - name: Deploy 
        env:
          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
        run: |
          aws s3 sync ./build s3://[bucket name]

소스 코드에 대한 설명은 각 코드에 주석으로 설명되어 있다.

뒤에서 4-3번째 줄의 AWS_ACCESS_KEY_ID와 AWS_SECRET_ACCESS_KEY은 IAM 생성 과정에서 저장한 Access Key ID와 Secret Access Key 정보에 해당한다.

 

Github Repository Secrets 등록

Github Repository의 Setting 페이지의 Secrets>Actions에서 Add a new secret을 통해 각각 AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY라는 이름으로 Access Key ID와 Secret Access Key 정보를 저장한다.

여기까지 설정이 끝나면, 위의 workflow에서 각각의 값들을 환경변수로 사용할 수 있다.

이제 해당 브랜치(ex. sub-branch)로 push를 진행하여, 설정한 Github Action이 제대로 설정됐는지를 확인해보자.

정상적으로 Action이 수행되었다면 초록색 체크 표시가, 현재 Action이 진행 중이라면 노란색 불이 표시가 된다.

이외에도, Action 이름, Action이 수행된 branch name, commit summary, 걸린 시간 등과 같은 정보를 확인할 수 있다.

 

---

Reference

GitHub Action으로 AWS S3에 배포 자동화