Publish Gatsby Blog to GitHub Pages with GitHub Actions
Tags: actionshackathon, opensource, github, telegram
Published: 2020-08-15 17:37:52

This workflow will build and publish a [Gatsby](https://www.gatsbyjs.org) blog to the [GitHub Pages](https://pages.github.com) and notify status via [Telegram](https://telegram.org).

### My Workflow

This workflow will build the code on `dev` branch and then copy build files to the `master` branch. Then it will commit those files and push them to publish the Blog on GitHub Pages.


This workflow will trigger on 2 events

1. on push to dev branch
2. cron job runs daily at 0800h

```yml

on:
  push:
    branches: [dev]
  schedule:
    - cron: "0 8 * * *"

```

cron job is used because my blog use [nasa image of the day](https://apod.nasa.gov/apod/astropix.html) as it's background image and it is updating daily .This is not mandatory and can be omitted based on requirement .



After that, workflow will delete everything in the `master` branch and then checkout to `dev` branch and start building . After building it will copy the build files(on public folder) to `master` branch and push those changes to publish to GitHub Pages.

```yml

   steps:
      - name: checkout master  branch # checkout master  branch
        uses: actions/checkout@v2
        with:
          persist-credentials: false

      - name: remove all files # remove files.
        run: |
          rm -rf *
      - name: create CNAME file # remove files.
        run: |
          echo "rizkyrajitha.me" > CNAME
      - name: checkout dev  branch #checkout dev  branch into temp folder.
        uses: actions/checkout@v2
        with:
          ref: dev
          path: temp
          persist-credentials: false

      - name: run yarn install and build # go to temp folder and run npm build to create files.
        run: |
          cd temp
          yarn install
          yarn build
      - name: move files # move the public built files into root dir and remove others.
        if: ${{ success() }}
        run: |
          mv temp/public/* ./
          rm -rf temp
      - name: Commit files for change # commit
        if: ${{ success() }}
        run: |
          git config --local user.email "action@github.com"
          git config --local user.name "GitHub Action"
          git add .
          git commit -m "Add changes"
      - name: Push changes #push files into master branch
        if: ${{ success() }}
        uses: ad-m/github-push-action@master
        with:
          BRANCH: master
          github_token: ${{ secrets.GITHUB_TOKEN }}
          force: true

```

After building and publishing blog a telegram message is send to a specified chat to notify the workflow status(success , Cancelled or failure) . `TELEGRAM_BOT_ID` , `TELEGRAM_CHAT_ID` is required .  other fields can be omitted on your preference 


```yml

      - name: Notify via TELEGRAM BOT
        uses: RizkyRajitha/github_actions_notify_telegram@v1
        with:
          TELEGRAM_BOT_ID: ${{ secrets.TELEGRAM_BOT_ID }}
          TELEGRAM_CHAT_ID: ${{ secrets.TELEGRAM_CHAT_ID }}
          CUSTOMMESSAGESUCCESS: "Published \xF0\x9F\x9A\x80 Blog via GitHub Actions"
          CUSTOMMESSAGESFAILURE: "Publishing  Blog \xE2\x9B\x94 via GitHub Actions Failed"
          CUSTOMMESSAGESCANCELLED: "Publishing  Blog \xE2\x9B\x94 via GitHub Actions Cancelled"
          JOBSTATUS: ${{ job.status }}
          GITHUB_RUN_NUMBER: ${{ github.run_number }}
          GITHUB_REPOSITORY: ${{ github.repository }}
          GITHUB_RUN_ID: ${{ github.run_id }}
          GITHUB_ACTOR: ${{ github.actor }}
          GITHUB_EVENT_NAME: ${{ github.event_name }}
          GITHUB_SHA: ${{ github.sha }}


```

Actions used

1. [actions/checkout@v2](https://github.com/actions/checkout) : for checking out branches 

2. [ad-m/github-push-action@master](https://github.com/ad-m/github-push-action)  : push build files to master branch , published via GitHub Pages

3. [RizkyRajitha/github_actions_notify_telegram@v1](https://github.com/[RizkyRajitha/github_actions_notify_telegram) : send telegram notifications


### Submission Category: 

DIY Deployments


### Yaml File or Link to Code

[main.yml file](https://github.com/RizkyRajitha/RizkyRajitha.github.io/blob/dev/.github/workflows/main.yml)

Telegram Notify action Repo

{% github https://github.com/RizkyRajitha/github_actions_notify_telegram
 %}

### Additional Resources / Info

Blog using this workflow

{% github https://github.com/RizkyRajitha/RizkyRajitha.github.io
 %}

Reference https://github.community/t/user-github-pages-site-auto-deploy-from-another-branch-on-push/17912