[CI/CD] 깃허브 액션을 사용해 웹팩을 S3에 자동 배포되도록 만들기

사실 웹팩 잘 모르고 구조가 어떤지도 모르니까, 그냥 깃허브 액션이 어떤 식으로 동작하는 지 개념?만 잡아보려고 쓴다ㅏ

해보쟈

프로젝트에 .github/workflows에 main.yml파일을 만들었다. yml파일은 배포 스크립트이다

main.yml은 아래와 같이 작성했다.

name: deployment

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest

    strategy:
      matrix:
        node-version: [12.x]

    steps:
    - uses: actions/checkout@v1

    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v1
      with:
        node-version: ${{ matrix.node-version }}

    - name: npm build
      run: |
        npm install
        npm run 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 cp \
          --recursive \
          --acl public-read \
          --region ap-northeast-2 \
          dist s3://{버킷 이름}

main 브랜치에 푸시가 되면 자동으로 npm install해서 run build하고 S3로 배포가 된다.
(main 브랜치에 merge가 되어도 자동으로 배포가 된다)

--acl public-read로 권한을 읽기로 바꾸어주었다.

AWS ACCESS KEY / SECRECT ACCESS KEY는 해당 깃 리포지토리 Secret에 설정해주었다.

완성? 모습