Headless Drupal IRL: Lessons Learned
iamEAP
doublejosh
jtwalters
angrytoast
In panel / round-robin fashion, the Tableau marketing development team will discuss the challenges faced, lessons learned, and benefits realized in switching all several-hundred of the company's paid search campaign pages from dynamic generation in Drupal, to static site generation outside of Drupal.
This talk will dive deep into code and configuration for a practical application of headless Drupal, spanning the full web application stack from devops, through Drupal back-end and site building, all the way to the front-end.
The Benefits / Requirements
- Extreme performance optimization
- Total control of markup
- Thinner DOM
- Responsive before the rest of the Drupal site gets there
- Agile development, shedding the burdens of a large Drupal development workflow
- Maintaining a Drupal-centric, instant-gratification content editor experience
- No content migrations whatsoever
- Full support for localized content
The Architecture
- Content management: An existing Drupal deployment, a single content type
- Content API: JSON via Views Datasource
- Static site builder: Assemble
- Task runner: Grunt
- Build and deployment: Travis CI
- Hosting: Amazon S3 + Cloudfront
- User Authentication: Form Frame
The Problems (and Solutions!)
- Hosting Hell: Static file storage is not a web server. Also, did you think about staging?
- JSON Hell: nested JSON in Views, consuming paged JSON, massaging the data
- Legacy IE Hell: cross-origin nightmares abound.
- Drupal taken for granted: i18n, forms, asset aggregation/minification/compression, editor preview