The document discusses the concept of decoupled CMS (Content Management Systems) in financial services, highlighting its potential benefits such as improved security and streamlined content management across multiple channels. It outlines the architecture of decoupled CMS, its advantages, and challenges, along with emerging technologies like API-first approaches that enhance developer experience. The document emphasizes the growing relevance of decoupled CMS in managing sensitive content efficiently within the financial sector.

1. The decoupled CMS
in financial services
Preston So • 8 Nov 2017 • Open Source Strategy Forum 2017

2. Welcome!
Preston So has been a web developer and designer since 2001, a
creative professional since 2004, and a Drupal developer since 2007.
As Director of Research and Innovation at Acquia, Preston leads new
open-source and research initiatives and helms Acquia Labs, the
innovation lab featured in international press.
Previously, Preston contributed to the Spark initiative in the Drupal
project, co-founded the Southern Colorado Drupal User Group (est.
2008), and operated an award-winning freelance web and print
design studio. Preston has presented keynotes at conferences on
three continents in multiple languages.
preston.so@acquia.com • @prestonso • #decoupledcmsfinserv

3. © 2017 Acquia Inc. — Confidential and Proprietary© 2017 Acquia Inc. — Confidential and Proprietary
We're Acquia's innovation lab — a small team of
generalist engineers building co-funded projects in
emerging technologies that push the envelope.
Have forward-looking ideas but need expertise?
Acquia Labs is your innovation partner.

4. What we'll cover
● What is decoupled CMS?
● Decoupling the front end from the back end
● Risks and rewards of decoupling the CMS
● API-first Drupal: The open-source advantage
● Decoupled CMS and developer experience
● The decoupled CMS in financial services

5. What is decoupled CMS?1

7. Think of Earth as one contiguous unit: a monolith.

9. Earth responds to requests from decoupled bases.
request
response

10. Monolithic CMSes can back decoupled applications.
HTTP request
HTTP response
CMS

11. HTTP request
HTTP response
Site or repository
built in CMS
Decoupled
application
CMS

12. CMS
Site or repository built in
CMS
Decoupled
application
REST API
Decoupled
application
HTTP client
HTTP request
HTTP response

13. Decoupled CMS
is the use of a CMS as a content
service for consumption and
manipulation by other applications

14. Decoupled CMS
● A decoupled CMS can be used to back other
back-end applications as well as native
applications, single-page applications, digital
signage, AR-driven interfaces, and many others.
● Web services such as REST APIs or GraphQL APIs
are typical entry points for decoupled CMS
consumers.

15. For marketers and publishers
decoupled CMS offers the promise of
omnichannel delivery

16. IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
Set-top
boxes
Smart
watches
Fitness
devices
Arduino
boards
Beacons
AR/VR
apps
Rasp-
berry Pi
Conver-
sational
UIs
LED
displays
We have new channels every day.
CMS

17. IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
Set-top
boxes
Smart
watches
Fitness
devices
Arduino
boards
Beacons
AR/VR
apps
Rasp-
berry Pi
Conver-
sational
UIs
LED
displays
And ones we've never heard of yet.
?
?
?
? ?
CMS

18. For developers
decoupled CMS offers the promise of
front-end freedom

19. de•coup•led head•less
API•first
Aside: What's in a name?

20. Decoupling the front end
from the back end
2

21. Monolithic CMS
CMS
CMS front end
Client
Server
Client
Server

22. Static pages
CMS
CMS front end
Client
Server
Subscribe to our newsletter
You have been successfully
subscribed!
E-mail address
Submit
full-page refresh
two
bootstraps

23. Dynamic pages with Ajax
Client
Server
CMS
CMS front end
jQuery
Synchronous
Asynchronous
Ajax
request
Subscribe to our newsletter
E-mail address
Submit
Subscribe to our newsletter
E-mail address
Submit
Subscribe to our newsletter
E-mail address
Submit
Success!
one
bootstrap

24. The JavaScript renaissance
ushered in an era of innovation and
new development practices

25. Server-side JavaScript
meant client-side frameworks could
be executed server-side

26. Universal JavaScript
meant shared code in the form of
JavaScript framework executions

27. JavaScript framework
(client-side execution)
Node.js
JavaScript framework
(server-side
execution)
CMS
Success!
Here are
others that
might interest
you:
Lorem ipsum
dolor sit
amet,
consectetuer
adipiscing.
Subscribe to our newsletter
E-mail address
Submit
Lorem ipsum
dolor sit
amet,
consectetuer
adipiscing.
Subscribe
E-mail
Submit
Lorem ipsum
dolor sit
amet,
consectetuer
adipiscing.
Dynamic pages with server-side prerendering
Client
Server
Synchronous
Asynchronous
HTTP
request
HTTP
request

28. Universal (isomorphic) JavaScript
Server Client
Node.js
JavaScript framework
HTML
JavaScript framework
HTML
Synchronous
Asynchronous
executes
renders
flush
bindings by
responds
calls REST API

29. Universal JS consuming decoupled CMS
Server Client
Node.js
JavaScript framework
HTML
JavaScript framework
HTML
Synchronous
Asynchronous
executes
renders
flush
bindings by
responds
calls REST API
CMS
calls
REST
API
responds

30. Risks and rewards of
decoupling the CMS
3

31. Rewards of decoupled CMS
● Separation of concerns. Structure versus
presentation is increasingly relevant in decoupled
architectures.
● Pipelined development. An API-design-first
approach gives front-end and back-end teams
independence.

32. Rewards of decoupled CMS
● Administrative security. Keeping the
administrative CMS far from public view is
increasingly a best practice.
● Easier resourcing. CMS developers are often now
considered less affordable than JavaScript
developers.

33. Risks of decoupled CMS
● Loss of contextual administration. Crucial
features such as in-place editing and toolbar can
be key for editors.
● Maintainability difficulties. Maintaining both a
CMS-driven content service service and
consumers requires extensive planning.

34. Risks of decoupled CMS
● Additional point of failure. Node.js downtime can
lead to inaccessible content in certain cases.
● On-boarding overhead. JavaScript developers
need to learn consumption; CMS developers
change focus.

35. Summary
Area Rewards Risks
Architecture Separation of
concerns
Loss of contextual
administration
Development
experience
Pipelined
development
Maintainability
difficulties
Security and
performance
Administrative
security
Additional point of
failure
Project management Easier resourcing On-boarding overhead

36. API-first Drupal and the
open-source advantage
4

37. What is Drupal?
● Digital experience platform. Drupal is a powerful
open-source CMS for building both web-based
digital experiences with full editorial capabilities
or API-driven digital experiences with developer
flexibility.
● Powers 2.5% of the web. Drupal is used by
organizations like NBC, The Weather Channel, The
White House, Tesla, and Princess Cruises.

38. Site or repository built in
Drupal
Decoupled
application
Web
services
Decoupled
application
HTTP client
HTTP request
HTTP response

39. Web services
support interoperable machine-to-
machine interaction over a network

40. REST APIs
follow REST principles and operate
using HTTP methods

41. REST APIs
Web services
REST APIs
Core REST JSON API
RELAXed Web
Services
GraphQL
Euler diagram of Drupal web services

42. JSON API
● JSON API is a specification for REST APIs in JSON
popular among JavaScript developers and
adopted by the Ember and Rails communities.
● JSON API provides a standard way to query single
entities, but it also provides all relationships
contained therein and query operations via query
string parameters.
● drupal.org/project/jsonapi

43. JSON API
JSON API
(abbreviated payloads,
merely illustrative)
Client issues request for an entity
resource
Server issues response with single
entity and all relationships
GET /jsonapi/node/1
?include=field_author
{
"data": [{
"type": "articles",
"id": "1",
"attributes": {
"title": "Foo",
"body": "Lorem ipsum",
},
...
}],
"included": [{
"type": "people",
"id": "5",
"attributes": {
"name": "Joe"
}
}]
}

44. GraphQL
● GraphQL, originally created by Facebook to power
its data fetching, is a query language that
enables fewer queries and limits response bloat.
● GraphQL shifts responsibility from the server to
the client: the server publishes its possibilities, and
the client publishes its requirements instead of
receiving a response dictated solely by the server.
● drupal.org/project/graphql

45. GraphQL
GraphQL
(simplified payloads,
merely illustrative)
Client issues request declaring
data requirements
Server issues response matching
structure of declared requirements
{
title
fieldAuthor {
title
}
}
{
"title": "Foo"
"fieldAuthor": {
"title": "Joe"
}
}

46. Decoupled CMS and
developer experience
5

47. Site or repository built in
Drupal
Decoupled
application
Web
services
Decoupled
application
HTTP client
HTTP request
HTTP response

48. Web
services
Decoupled
application
SDKs and
starter kits
HTTP request
HTTP response
API-first
distros
API-first distros, SDKs, and starter kits improve decoupled DX

49. SDKs and starter kits
● SDKs can help to make it easier for developers to
consume CMSes as a content service. These tend
to be lightweight HTTP client wrappers which
make requests on the developer's behalf and
process responses.
● Starter kits and references help jumpstart
implementations by providing an out-of-the-box
experience for developers to get started right
away.

50. The open-source advantage: Waterwheel ecosystem

51. The Waterwheel ecosystem
● Waterwheel is an emerging ecosystem of SDKs
designed to accelerate development of
Drupal-backed applications in a variety of
technologies.
● Currently, a helper SDK is available for JavaScript
as an initial release and a full SDK is available for
Swift to power iOS, tvOS, and other Apple
applications.

52. The Waterwheel ecosystem
● github.com/acquia/waterwheel.js
● github.com/kylebrowning/waterwheel.swift
● drupal.org/project/waterwheel
● github.com/acquia/ember-drupal-waterwheel
● github.com/acquia/ember-waterwheel-app
● github.com/acquia/react-waterwheel-app

53. The open-source advantage: Reservoir and Contenta

54. API-first distributions
● An ecosystem of distributions oriented for
developers consuming decoupled Drupal is
emerging. The most prominent distributions are
Reservoir and Contenta.
● github.com/acquia/reservoir
● github.com/contentacms/contenta_jsonapi

55. A good developer experience
means that it's easy to provision
APIs for a group of consumer
applications

56. A good developer experience
means that it's easy for consumers to
work with the provisioned APIs

57. The decoupled CMS
in financial services
6

58. Decoupled CMS is a compelling
architecture for financial services

59. Rewards for financial services
● Administrative security. Often, sensitive content
is housed in a CMS whose editorial access should
be tightly restricted. Decoupled approaches limit
access to the underlying CMS.
● Single source for digital ecosystems. Financial
services firms with disparate experiences need
one unified place to manage content destined for
those touchpoints, especially mobile apps.

60. The diversity of open source
optimizes decoupled approaches

61. Decoupled Drupal is optimal
for financial services architectures

62. Thank you!
Preston So has been a web developer and designer since 2001, a
creative professional since 2004, and a Drupal developer since 2007.
As Director of Research and Innovation at Acquia, Preston leads new
open-source and research initiatives and helms Acquia Labs, the
innovation lab featured in international press.
Previously, Preston contributed to the Spark initiative in the Drupal
project, co-founded the Southern Colorado Drupal User Group (est.
2008), and operated an award-winning freelance web and print
design studio. Preston has presented keynotes at conferences on
three continents in multiple languages.
preston.so@acquia.com • @prestonso • #decoupledcmsfinserv