In this section, we will create a GitHub Action to automatically deploy our Client App to AWS S3. You can view the code here.

Create Repository Secrets

We will add the following secrets to the repository:

• AWS_ACCESS_KEY_ID → Access key obtained from the .csv file in the previous section
• AWS_SECRET_ACCESS_KEY → Secret key obtained from the .csv file in the previous section
• AWS_S3_BUCKET → The name of the S3 bucket

Create Repository Variables

Next, we will add the API URL for our app, which we obtain from API Gateway.

Create Github Action File

The final step is to create the deploy.yml file. The build file consists of installing the dependencies and building the client app. Then, we use jakejarvis/s3-sync-action to upload the build file to the S3.

name: Upload Website on: pull_request: branches: - main jobs: build: runs-on: ubuntu-latest env: VITE_API_URL: ${{ vars.VITE_API_URL }} steps: - name: Checkout repo uses: actions/checkout@v3 - name: Setup Node uses: actions/setup-node@v3 - name: Install dependencies run: yarn - name: Build app run: yarn workspace client build - name: Upload to S3s uses: jakejarvis/s3-sync-action@master with: args: --acl private --follow-symlinks --delete env: SOURCE_DIR: apps/client/dist AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} 

To trigger the build, you need to create a pull request (PR) to the main branch and merge it. Afterward, the GitHub Action will run.

Then, when we check the S3 bucket, we can see that the file has already been uploaded.