How to deploy Gatsby project

There are 2 options to deploy a Gatsby application

  • Build the project locally and transfer the public folder to any services (Netlify, GoDaddy, etc)
  • Push the project to Github and the service will build for us

I. Gatsby build

Before running gatsby build command, we will need to transfer any keys in .env.development to .env.production

We then run this command to get our production already built in public folder

gatsby build

We can then run gatsby serve to see our project

II. Deploy Gatsby with Netlify

Netlify is a great option for hosting web applications and static websites.

We can deploy our project to Netlify with 2 options:

  • Deploy new site from Git repository
  • Drag and drop Public folder to Netlify

The benefit of deploying new site from Git is that Netlify will rebuild the site anytime there are changes in Github repo.

When deploying new site from Git repository, we need to add Variables from our .env.development if we have any. We can do that in the “Show Advanced” option.

Webhooks

If we use Headless CMS such as Contentful or Strapi, it will be useful if we can trigger a rebuilt from Contentful any time we change our data.

To do that, we need to follow these steps:

  • Open Netlify, in Deploy tab, choose Deploy settings and choose Continous Deployment
  • Find Build Hook section, click “Add build Hook” and give a name. Ex: “gatsby-project”. Then save and copy the URL
  • Open Contentful, in Settings choose Webhooks, create a new one and pass on the copied URL. Then save!