My last adventure was migrating my crufty Jekyll site to Gatsby. I used to deploy my Jekyll site manually by building it locally and pushing the generated static content to the gh-pages branch on GitHub. With my new site in place, I decided it was time to leave my old ways behind and set up an automated pipeline to deploy my site to GitHub pages.

Why GitHub Pages?

I’ve always used GitHub Pages to host my blog because it’s lightweight and integrates seamlessly with GitHub. It is simple, free, and provides free goodies like enforcing HTTPS by default and also supports adding a custom domain.

Deploying a Gatsby Site Locally

Before automating the deployment of my new Gatsby site, I learned how to deploy it locally. To do this, I added an entry to the scripts tag in package.json which creates a production-ready build for my Gatsby site.

"scripts": { 
  ...
  "build": "gatsby build"
}

npm run build builds the site and places the generated assets in a folder called public. Copying this public folder to any HTTP server would deploy my site to that server.

I started an HTTP server using http-server to serve the assets in the public folder which effectively deployed my site locally.

➜  cd public
➜  http-server

Starting up http-server, serving ./
Available on:  
http://127.0.0.1:8082  
http://10.10.10.10:8082 

#travis-ci #gatsbyjs #devops #continuous-integration #javascript