Auto Deployments With Gatsby + Now + GitHub

spukas

Linas Spukas

Posted on August 25, 2019

Auto Deployments With Gatsby + Now + GitHub

My blog site is spinning on the Gatsby framework, and with each new post, I was deploying the latest build to Zeit Now platform. It got tiresome to do the same procedures: change, build, deploy, alias my domain to the new deployment address. Time to automate the processes. The end goal is to send a new post in '.md' file to GitHub, grab a beer and let the machine do the rest.

By the way, if you are no familiar with Zeit, their Now deployment platform is incredible, I like it very much. It is easy to start using it, documentation is well written, and it's free up to 100GB bandwidth. Also, they support domain aliasing; if you own a domain, add Zeit Now DNS address to your domain settings and hook your deployment address with your domain. And did I mention that it's free?

I will assume that by now you will have a Zeit account and Now CLI installed in your terminal.

Connect Now With GitHub

To connect Now with GitHub, head to the Zeit account settings and install Now app into GitHub.

Install Now app into GitHub

Define Build Script

For deployment to Now, a script must be defined in the package.json:

{
  "scripts": {
    "build": "gatsby build",
    "now-build": "npm run build"
  }
}
Enter fullscreen mode Exit fullscreen mode

And to build and deploy the project, it must contain now.json settings file with the instructions on how and where to build it:

{
  "builds": [{
      "src": "package.json",
      "use": "@now/static-build",
      "config": { "distDir": "public" }
    }]
}
Enter fullscreen mode Exit fullscreen mode

Add auto domain alias (optional)

One of the cool features for the Zeit Now is custom domain name aliasing to the builds. You can set it up in a couple of different ways:

  • In the now.json add the following:
{
  "alias": "spukas.lt"
}
Enter fullscreen mode Exit fullscreen mode

After the build, Now will assign your custom domain to the build

  • In the Zeit Dashboard, select the project and select Domain tab (note, that at least one build of the project must be in the dashboard). In the Domain dashboard, you will be presented with the option to add your custom domains:

Zeit Now Domain dashboard

Enjoy your builds

That's it. Now make changes in your project, commit and push them. GitHub will build a project, Now will deploy it into their platform and set an alias for your custom domains.
Life's great again.

💖 💪 🙅 🚩
spukas
Linas Spukas

Posted on August 25, 2019

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related