Twig in Fractal in Drupal: Decoupling UI Components from Drupal Data Structures

A fully decoupled architecture can provide many benefits: more specialized front-end and back-end developers, easier project management with less dependencies, and more reusable front-end code. However, this solution is not right for every project: Hosting and deployment becomes more complicated, JS apps don’t have access to powerful Drupal functionality, and some clients don’t love the idea of also maintaining a separate JS stack.

At Bluecadet, we have been exploring using Twig in Fractal ( to build independent component libraries that can be used in a Drupal theme. With this approach, we gain many of the advantages of a decoupled architecture, without taking on its complexity.

This talk will cover:

The benefits of using a front end style guide for modular sites
The Fractal style guide generator
Designing components for use in Drupal
How to integrate Fractal with your site’s Drupal theme
The gotchas and points of friction we’ve encountered along the way.
About the Speaker(s):
Chris is a Senior Developer at Bluecadet, focusing on front-end development.

Drupal is a registered trademark of Dries Buytaert.