How to deploy Gatsby project

There are two 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 two options:

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

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

When deploying a new site from the 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 helpful if we can trigger a rebuild from Contentful any time we change our data.

To do that, we need to follow these steps:

  • Open Netlify. In the Deploy tab, choose Deploy settings and choose Continous Deployment
  • Find the 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!