Headless, but this time live! Decoupled Drupal with Gatsby

In May, we wrote about the headless CMS pattern, the idea of separating the concerns of the CMS from the front end site that users interact with. We explored how Gatsby leverages their source plugin ecosystem to pull content from a backend CMS during its build process. Gatsby pulls and caches content via GraphQL queries into its Data Layer and then uses user-defined template files to generate single and list pages from each article on the backend CMS.

The big advantage of taking CMSs in this direction is that it enables parallel work and the separation of concerns between your teams. By building a headless CMS pattern for a client, you free your development team to focus on the front-end Gatsby site under only a few expectations of how content will be organized on the back-end. Meanwhile your content team can focus on content and on using whichever modules and tools specific to that CMS that they need. And on Platform.sh these teams can work from isolated development environments within the same project in parallel without running into each other.

We didn’t forget Drupal

In May’s article (as well as during one of our Deploy Friday broadcasts), we covered multiple CMSs for which Gatsby provides source plugin support: Strapi, Wordpress, and Oracle Content & Experience. Reading this list, you may have asked, "Aren't you missing something there, buddy?"

Drupal. So much of Platform.sh's history is intrinsically tied to providing a top-notch experience to those deploying their Drupal sites. So it may have seemed odd that Drupal wasn't included as more than a reference in our recent discussions.

Well, we thought it deserved some more attention as well. We’ve been working on it, and we’re excited to share that work with you today. We’ve released a step-by-step tutorial video on how to start a fresh project on Platform.sh, deploy a simple Gatsby site to it, and then add a second Drupal 8 application before tying the two together into one decoupled project.

Additionally, the tutorial comes with detailed instructions on how to enable Gatsby’s Live Preview on your project. Live Preview exposes a refresh endpoint that will update your Gatsby site with every content edit made on Drupal, no redeploy required.

To get yourself and your team working with decoupled Drupal on Platform.sh in minutes, follow along on the video, or deploy the project yourself from our pre-made template.