Automate TakeShape CMS Content Updates Using Webhooks and Netlify Build Hooks

Colby Fayock
InstructorColby Fayock
Share this video with your friends

Social Share Links

Send Tweet

In this lesson, we'll walk through automating deploying website updates when making changes to content in TakeShape CMS. Using Netlify Build Hooks, we'll configure TakeShape Webhooks to notify Netlify when any of our content is created, updated, or deleted.

Colby Fayock: [0:00] We're going start off with a project that uses the TakeShape CMS and it's hosted on Netlify. We can edit this content pretty easily on TakeShape, but anytime we update the content, we have to manually deploy it. How can we automate that?

[0:10] To start off in Netlify, we're going to go to our Settings tab. Under Settings, we want to go to the Build and Deploy tab, where under Continuous Deployment, we can find the Build hooks. Netlify provides a feature called Build hooks. It provides us with the unique URL so that we can trigger a new build.

[0:23] To get started, we're going to add a new build hook. Here, let's give it a name of TakeShape CMS. Since our project is on the master branch, we're going to leave that alone. Once we click Save, we can see that Netlify provides us with a new build hook.

[0:34] To make use of these build hooks, let's go to our TakeShape dashboard. Under the Project Menu, we can go to our Webhooks.

[0:39] TakeShape provides a feature called Webhooks. This allows us to ping a request to an endpoint whenever we make a change to our content.

[0:45] The first thing that TakeShape wants is a Webhook URL. We're going to go back to Netlify and copy that URL. Over our TakeShape, let's paste that as our Webhook URL. Then under Resource, we can select Content.

[0:55] We want to say anytime our content is created, updated, or deleted, we want to make a request to that webhook. Finally, we can hit Save.

[1:02] Now, anytime we change our content like this header, we can see a build automatically trigger in Netlify. Once that's finished deploying, we can see our updated content.

[1:11] In review, we have a project that's hosted on Netlify that uses the TakeShape CMS. We didn't want to have to trigger a deploy manually every time we made a content change.

[1:18] Using Netlify, we are able to create a new build hook for TakeShape. Inside TakeShape, we are able to use that Netlify URL as a webhook. With our proper resource configuration, the next time we updated our content, it automatically triggered a deploy in Netlify and updated our content.