Headless Drupal? It Just Might Be a Bigger Deal than Twig

Posted: August 4, 2014 under Drupal, JavaScript

Update: There has recently been an interesting conversation about the term, "headless" Drupal. The suggestion has been made that "decoupled" Drupal makes more sense and I tend to agree. Regardless of whether you prefer "headless" or "decoupled", it's still an exciting approach to building websites.

If you're a frontend developer or designer that has grumbled about the challenges of Drupal theming, you no doubt applauded the announcement that the Twig template framework was being added to Drupal 8.

It's a big upgrade, no question. If you're like me, however, you may sometimes want to build a completely custom frontend crafted out of HTML, CSS and JavaScript. You may have looked at the cool stuff AngularJS or Backbone is capable of and wondered how you could bridge the gap with Drupal to enjoy that sort of freedom.

Fortunately, there are some folks that are already doing exactly that and sharing the results of their work. It's something called "Headless Drupal" and it's an approach that uses Drupal as a backend content repository and REST server.

A REST server makes it possible for other applications to read and update data. The typical case is that Drupal is used to store and manage content and it then provides that data to your app built with Angular, Backbone, Ember, or whatever.  If that's not entirely clear, don't worry. The links below will help sort it out.

Headless Drupal Resources

Headless Drupal Manifesto - This is great place to start. It succinctly answers the question of why anyone would want to do this sort of thing.

Headless Drupal Group - A group on Drupal.org devoted to sharing ideas, discussion and experiments around the topic of headless Drupal.

What Is Headless Drupal? - A great introduction to the topic from OSTraining.

Build a Drupal-free theme with 8's REST API and JavaScript - A presentation from DrupalCon Austin on building an AngularJS site that uses Drupal for the backend.

Headless Drupal, One form at a time - This is a great post from Amitai Burstein that demonstrates some of what this approach has to offer for the creation of frontend user interfaces.

Headless Drupal Demo - Working Code and Call to Action - Great resource from Josh Koenig of Pantheon.

Headless Drupal - Inline edit - Another good one from Amitai.

Here’s Drupal - Tonight on the Tonight Show with Jimmy Fallon - A case study of headless Drupal in action on a very high profile site.

Not "Headless", But Related and Useful

Move logic to the front end with AngularJS - Juan Pablo Novillo Requena of Lullabot talks about using AngularJS together with Drupal. It's not a decoupled Drupal approach, but is a useful and related look at using a frontend framework.

If you know of some other resources, please share them in the comments below. I'd love to check them out.

About the Author

John Hannah

I’m John Hannah, a front end developer at Lullabot . When I'm not building websites, I travel as much as possible and enjoy hanging out with my wonderful family. My favorite place to spend my coffee breaks is Twitter, so please feel free to connect with me there.