Using Gatsby with Github Pages and Actions

May 1st, 2019 - 1 min read

Gatsby is a super-lean and customisable static site generator and, when combined with Github Pages and Github Actions, can provide a really easy-to-use workflow for content creation.

Here's how I did it:

  1. Create your new gatsby blog.

There's literally hundreds of Gatsby 'starters' available over at You should pick yourself something nice, and then use Gatsby to creater a new one.

I intend to run mine on Github Pages, so I used my Github username to name my site. In my case

gatsby new

This creates a new directory with your blog set up.

  1. Add in your Github repository

Jump over to Github and create yourself a new repository in the format [username]

In my case this was Once you've done this, you can add the remote repo and push.

git remote add origin

git push -u origin master

  1. Setting up a development branch

Move into your newly created Gatsby blog


In our case, our master branch will be used for the static site, so let's switch to a dev branch:

git checkout -b dev

At this point it's worthwhile telling Github that you want the dev branch to be the main one.

  1. Add in the Github action workflow.

Then create a new directory for actions:

mkdir -p .github/workflows

Lastly, we need to create a file to hold our workflow. The path I use is .github/workflows/gatsby.yml

That file has the following contents:

name: Gatsby Publish

      - dev

    runs-on: ubuntu-latest
      - uses: actions/checkout@v1
      - uses: enriikke/gatsby-gh-pages-action@master
          access-token: ${{ secrets.ACCESS_TOKEN }}

There's one further step inside Github itself - creating a Personal Access Token and then storing in Secrets.