Deploy content changes for your Gatsby Drupal site on Netlify with Build Hooks

Parent Feed: 

You will need to download and install the Drupal 8 Build Hooks module just like you would with any other Drupal module.

composer require drupal/build_hooks

Enable the Build Hooks and Build Hooks for Netlify modules.

Build Hooks Modules

There are some permissions that can be set for Build Hooks to determine who can manage the frontend environments and who can trigger deployments. For now we will just keep it for administrators.

Build Hooks Permissions

Go to Admin > Configuration > Build Hooks > Build Hooks Settings. On this page you can configure what entities should be logged. This is important as these “loggable” entities are the entity types that can trigger a rebuild on your Gatsby site. Leaving it at the default will work for our site, but this could vary depending on your needs and if you have other entity types that your Gatsby site uses for content.

Build Hooks Settings

Go to Admin > Configuration > Build Hooks > Frontend Environments and click the Add frontend environment button. In the Netlify section, click the Add new environment button. You now need information from your Netlify site.

Go to the Netlify website and log into your Netlify account. Select your Gatsby site and take note of your Gatsby URL (you will need that for the Drupal form). Click on Settings and under the Build & Deploy section find Build Hooks.

Click the Add Build Hook button.

Add Build Hook

You can give the build hook any name you want, in this example I just called in Content Rebuild. Set it to rebuild your Master branch. Click the Save button.

Build Hooks Configuration

Now take this Build hook URL and the URL for your Netlify site and drop it into the Drupal form. You can set the Label to whatever you want. Copy the API ID from your Netlify site (in the General Settings > Site details) section and drop that in the Drupal form as well. For the Branch name, enter master. For now you can leave the Deployment strategy as Manually only, however, this option is what would allow you to trigger rebuilds on cron run or when content is updated on the site.

Build Hooks Frontend Environment

Now go to an Article and change something. I will just change the title and image of the most recent article, but you could create additional articles or make any changes you want. Once your changes are ready, notice the Frontend environment is listed in your admin menu.

Build Hooks Admin Menu

If you click on the deploy environment you can click the Start a new deployment button.

Build Hooks start Deployment

If you go back to your Netlify site, you will see that a new deploy has been added and the site is rebuilding.

Netlify Build Status

Once it’s finished you can check out your updated Gatsby site!

Note: You don’t have to configure the oauth settings for the Netlify Build Hooks module in order to get this to work. If you want to make your Netlify logs private, then you will need to set up and configure the access token. This is available in the oauth settings on your Netlify account under the Access Token section.

Author: 
Original Post: 

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web