GitHub ActionsでAmazon S3にReact appをビルド、デプロイする

難しいことはいらない。
これだけである。

deploy-react.yml

name: deploy-react

on:
  push:
    branches: [ "main" ]

jobs:
  build:
    runs-on: ubuntu-latest

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

    steps:
    - uses: actions/checkout@v3

    - name: Configure AWS Credentials
      uses: aws-actions/configure-aws-credentials@v1
      with:
        aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
        aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
        aws-region: ${{ secrets.AWS_REGION }}
    
    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v3
      with:
        node-version: ${{ matrix.node-version }}

    - name: Build
      working-directory: ./web
      run: |
        yarn install
        yarn build
    - name: Deploy app build to S3 bucket
      run: aws s3 sync ./web/dist/ s3://static-skhole-20230325 --delete

• 各secretsは予めリポジトリのSettings > Secrets and variablesから追加しておかなければならない。
• Reactのプロジェクトはルートディレクトリではなくwebディレクトリにあることを想定している。
• aws s3 syncの引数にはビルドしたReactアプリのパスを渡す。今回はdistとしているが、buildを指定する場合も多い。