Decoupling Drupal - Drupal Camp Toronto 2014

Decoupling Drupal

Alex De Winne• 15 years in the industry

• Drupal since 4.7

• Founder of Therefore

• Hacker, visionary, tech enthusiast

& musician

“Build it the best way you

know how and with the best

tools available. Don’t worry

that we’re using Drupal”

What if you could say to a front-end developer:

Use Drupal more like it’s a Content

Management System and less like it’s a

Web Publishing Tool

WPT vs CMS

The goal of a Web Publishing Tool is to capture

content with the primary purpose of publishing web

pages.

The goal of any CMS should be to allow storage of

structured content and dissemination of content to any

platform, in any presentation, at any time.

Decoupling Drupal

It means making no assumptions as to where your

content will end up.

What’s required is complete separation between

the Backend Content Model and the Front-End.

It’s about seeing Drupal as a component of a

Distributed CMS rather than a Monolith Web

Publishing Tool.

Typical Drupal Architecture

Browser

Drupal

Browser

The Monolithic Stack

In the 90’s, virtually all

applications were written using

well defined stacks of services

and deployed on a single

monolithic, proprietary server.

1995

Thick, client-server app

on thick client

Well-defined stack:

• O/S

• Runtime

• Middleware

Monolithic

Physical

Infrastructure

Does this look familiar?

The Landscape

Karen says we need…

Reusable content

Structured content

Meaningful meta data

A presentation independent CMS

COPE

• NRP has been operating a decoupled CMS for over

10 years.

• NPR credits its API with increasing page views by

80%, largely because they’re able to get their

content onto a variety of mobile devices without

custom programming.

Create Once, Publish Everywhere

NPR’s COPE Architecture

CMSData

EntryStatic

DataAPI Cache Renders

Case Studywww.niagaracruises.com

Client

Host

Twitter

Sprints 1 - 2

Discovery

Static Design & Rebuild

AODA Single A

Launch

MySQL

Blog

Authoring

Client

Host

DocPad

Static

Site

Disqus

Twitter

Sprints 3 - 4

Drupal + Services

Node + Hapi Router

Blog CMS Coverage

Heroku

Heroku

MySQL

DocPad

Static

Site

Full

CMS

Authoring

Client

HostDisqus

Twitter

Sprint 5

80% CMS Coverage

Heroku

MySQL

DocPad

Static

Site

Client

HostDisqus

Twitter

Sprint 6 - 7

AODA AA

French & Spanish

Translate

Full

CMS

Authoring

Heroku

MySQL

DocPad

Static

Site

CMS

Authoring

Client

HostDisqus

Twitter

Translate

What We Learned

&

What You Can Expect to

Change When Working in a

Decoupled CMS Architecture

You’ll start to think differently

about your CMS

• You’ll start to see your CMS as a

tool content writers and content

architects like to hang out.

• Front-end developers will see it an

API to a content repository. No

longer a system that dictates which

technologies they can or can’t use.

Workflow Optimization

• Prototypes can turn into the real

thing with no extra work. Just add

API™

• Decreased dependancies allow

teams to operate more efficiently.

• Reduces the risk that a change

made within one element will

create unanticipated changes

within other elements.

Upgradeability / Interchangeability

• Swap out front-ends, keep the back-

end as is

• Add front-end publishing end points,

keep the back-end as is

• Back-end upgrades, keep the front-

end as is.

Increased Reliability and

Security

• A full stack CMS falls apart if any

component stops working properly. It’s

pretty hard to break a static website.

• Drupal can be safely hidden behind a

corporate firewall. Only the API is

required to be exposed, and optionally

restricted to only interfacing with the

static server.

Increased Scope Flexibility

In many cases it’s not a requirement to

have 100% CMS coverage.

If we’re working towards a fixed cost

project with a flexible scope, one of the

elements that could get de-prioritized is

CMS coverage.

It can always be added later.

Speed and Scalability

• Caching of the static files in memory

• Serving files from a CDN or a load

balanced configuration

• Utilizing a distributed file system to

avoid slow disk performance

bottlenecks

It doesn’t get much faster than a static site. But, when you

need even more speed here are some options:

Multi-Channel Publishing

Multi-Channel publishing becomes a

reality.

Additional projects can be seen as

extensions to the existing

infrastructure rather than a static

implementation.

Human Resources

Doors are opened to a greater

talent pool.

Front-end designers and developers

don’t need to be Drupal developers.

Can’t All Be Rainbows

and Unicorns

Challenges

Authentication and roles are

potentially more complicated to

setup.

Reusable logic patterns become

non-reusable when moved to the

front-end.

Challenges arise with X-domain

requests.

Where Can It Go From

Here?

DevOps Service Components

Redis

PaaS

S3CDN

Content Delivery

Network module

Pantheon, Aberdeen, Acquia

Amazon Cloud

File System

Caching DB

Server

External Cloud Services

Redis

Disqus

Prediction

Twilio

Hapi

RouterPaaS

S3CDN

Translate Google

Voice API

Comments

API Based Front-End Publishing

Redis

Disqus

Prediction

Twillio

Hapi

Router

DocPad

Static

Site

iPhone AppPrint

Workflow

PaaS

S3CDN

Translate

HTTP Router

HTML Site

Native AppPDF Document

Standardized Content Model

Redis

PHPCR

Storage

API

Mongo

DB

Midgard2

Hapi

Router

DocPad

Static

Site

iPhone AppPrint

WorkflowMedium

PaaS

S3CDN

Disqus

Prediction

Twillio

Translate

Standardized

Storage API

JCR

Compatible

Data Store

CouchDB

Decoupled Authoring Tools

Redis

PHPCR

Storage

API

Mongo

DB

Midgard2

Hapi

Router

DocPad

Static

Site

iPhone AppPrint

Workflow

Authoring

Tools

Gather

Content

Medium

PaaS

S3CDN

Custom

iPad App

Disqus

Prediction

Twillio

Translate

Redis

PHPCR

Storage

API

Mongo

DB

Midgard2

Hapi

Router

DocPad

Static

Site

iPhone AppPrint

Workflow

Authoring

Tools

Gather

Content

Medium

PaaS

S3CDN

Distributed CMS based on

Best-of-Breed Components

Custom

iPad App

Disqus

Prediction

Twillio

Translate

Is this all a bunch of blue sky

dreaming?

Maybe, but check out what prismic is up to…

It features a Writing Room for content writers to author,

manage and store content, and a Content Query API for

developers to integrate managed content into any website or

app.

REST, JSON or HTML,

effective API browser,

easy to use

Comfortable content creation

experience. Addressing

content writers’ real-life

problems.

Content is API-based.

Inject it easily into new

platforms and sites.

Questions

Thank you

Links• http://docpad.org/

• spumko.github.io/

• http://phpcr.github.io/

• http://prismic.io

• http://www.exoplatform.com/ (CMS that uses JCR)

• http://nedonosko.blogspot.ca/2009/09/jcr-based-content-

management.html

• http://www.html5rocks.com/en/tutorials/cors/