4. Headless Drupal
Uses headless web architecture
Key differences compared to Standard
‘vanilla’ Drupal
➔ Visitor doesn’t see a generated
drupal theme (the head); headless
➔ Drupal is only used for backend
content management system.
➔ Visitor connects to drupal using
frontend JavaScript
framework/Mobile App
➔ Decoupled
5. Implementing Headless Drupal
In order to make headless drupal we need:
1. API/Web Services -- To provide raw data in JSON format (Drupal)
2. JavaScript Framework -- To receive the data
3. Client-Side Theme -- To formats the data (Ex: BootStrap)
Popular JavaScript Frameworks:
1. AngularJs
2. Node.js
3. Backbone.js
4. Konckout.js
5. Express.js
Drupal
Front End
Framework
User
6. Popular Sites using headless drupal
The Tonight Show with Jimmy Fallon, uses Node.js and Backbone.js
Weather.com is rebuilt with Angular.js
Radio France uses Symfony 2
Great Wolf Resorts uses CoffeeScript and the Spine framework
EC Red Bull with Angular.js
E-commerce (boucheron.com, renttherunway.com etc...)
7. Benefits of Headless Drupal
1. Easier to build and maintain
2. Scalable
3. Faster Performance
4. Easier to work with different teams (Team Backend, Team Web Frontend,
Team iOS App and Team Android App)
5. More ‘future proof’
8. Headless Drupal Manifesto
★ We want Drupal to be the preferred back-end content management system for
designers and front-end developers.
★ We believe that Drupal's main strengths lie in the power and flexibility of its back-
end; its primary value to users is its ability to architect and display complex content
models.
★ We believe that client-side front-end frameworks are the future of the web.
★ It is critically important for Drupal to be services oriented first, not HTML oriented
first, or risk becoming irrelevant.
