Deploying Gatsby using Github Action & route 53

Deployed my personal blog using `Route 53` and `Github action`.

Lets take this process into two step:

  1. Github Action
  2. Route 53

1️⃣ Github Action 🧨

This GitHub Action will run gatsby build at the root of your repository and deploy it to GitHub Pages for you!

Create .github folder in root of the project and under .github folder create workflows folder. Then add the below snippet into main.yml

.github/workflows/main.yml:

name: Gatsby Publish


on:
  push:
    branches:
      - master


jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v1
      - uses: enriikke/gatsby-gh-pages-action@v2
        with:
          access-token: ${{ secrets.PERSONAL_BLOG }}
          deploy-branch: gh-pages

Configure the access-token 🎗

  1. Open github website with the repo (e.x: https://github.com/suprabhasupi/blog )

  2. Click on Settings tab

    Setting wrapper

  3. Go to Secrets

    Secrets wrapper

  4. Click on New Secret button

    New Secret wrapper

  5. Enter the name and Value, Get the value by:

    1. Click on Profile settings
    2. Click on developer settings which is in left tab (include image)
    3. Click on Personal Access Token
    4. Click on Generate new token button
    5. Give Note name
    6. In Select scopes, checked repo
    7. Click Generate token button
    8. Now, Copy the value

  6. Paste the value into New Secret Value

  7. Now, Use the Secret name and place into the project

You can see the below image where I have used the same secret name into the main.yml file.

Check value name

Once you push code into master, You can see the deployment status into Actions tab.

Actions Tab

You can check the status as pass ✅ and fail ❌ in actions.

2️⃣ Configure AWS Route 53 🚀

  1. Log into the AWS console and go to the Route 53 dashboard .

  2. Click Hosted zones

    Hosted Zone Tab

  3. Click the domain you would like to use or create new hosted zone

  4. Click Create Record Set

  5. Under the Type dropdown, select A — IPv4 addresses

    IP address in aws Tab

  6. Enter the following four IP addresses into the value text area. Then click Save Record Set.

    185.199.108.153
    185.199.109.153
    185.199.110.153
    185.199.111.153

    Yeah, this is it. Now you can check your live website on the URL which you have mentioned into route53 🜸.

Reference 🧐