in financial services The decoupled CMS · in financial services ... Universal (isomorphic)...

The decoupled CMS in financial services

Preston So • 8 Nov 2017 • Open Source Strategy Forum 2017

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.

[email protected] • @prestonso • #decoupledcmsfinserv

© 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.

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

What is decoupled CMS?1

Think of Earth as one contiguous unit: a monolith.

Earth responds to requests from decoupled bases.

request

response

Monolithic CMSes can back decoupled applications.

HTTP request

HTTP responseCMS

HTTP request

HTTP response

Site or repository built in CMS

Decoupled application

CMS

CMS

Site or repository built in CMS


REST API Decoupled applicationHTTP client

HTTP request

HTTP response

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

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.

For marketers and publishersdecoupled CMS offers the promise of omnichannel delivery

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

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

For developersdecoupled CMS offers the promise of front-end freedom

de•coup•led head•less

API•first

Aside: What's in a name?

Decoupling the front endfrom the back end

2

Monolithic CMS

CMS

CMS front end

Client

Server

Client

Server

Static pages

CMS

CMS front end

Client

Server

Subscribe to our newsletter

You have been successfully subscribed!

E-mail address

Submit

full-page refreshtwo bootstraps

Dynamic pages with Ajax

Client

Server

CMS

CMS front end

jQuery

Synchronous

Asynchronous

Ajax request


E-mail address

Submit


E-mail address

Submit


E-mail address

Submit

Success!

one bootstrap

The JavaScript renaissanceushered in an era of innovation and new development practices

Server-side JavaScriptmeant client-side frameworks could be executed server-side

Universal JavaScriptmeant shared code in the form of JavaScript framework executions

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.


E-mail address

Submit


Subscribe

E-mail

Submit


Dynamic pages with server-side prerendering

Client

Server

Synchronous

Asynchronous

HTTP request

HTTP request

Universal (isomorphic) JavaScript

Server Client

Node.js

JavaScript framework

HTML


HTML

Synchronous

Asynchronous

executes

renders

flush

bindings by

responds

calls REST API

Universal JS consuming decoupled CMS

Server Client

Node.js


HTML


HTML

Synchronous

Asynchronous

executes

renders

flush

bindings by

responds

calls REST API

CMS

calls REST

API

responds

Risks and rewards of decoupling the CMS

3

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.

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.

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.

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.

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

API-first Drupal and theopen-source advantage

4

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.

Site or repository built in Drupal


Web services

Decoupled applicationHTTP client

HTTP request

HTTP response

Web servicessupport interoperable machine-to-machine interaction over a network

REST APIsfollow REST principles and operate using HTTP methods

REST APIs

Web services

REST APIs

Core REST JSON API RELAXed Web Services GraphQL

Euler diagram of Drupal web services

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

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" } }]}

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

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" }}

Decoupled CMS anddeveloper experience

5

Site or repository built in Drupal


Web services

Decoupled applicationHTTP client

HTTP request

HTTP response

Web services


SDKs and starter kits

HTTP request

HTTP response

API-first distros

API-first distros, SDKs, and starter kits improve decoupled DX

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.

The open-source advantage: Waterwheel ecosystem

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.

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

The open-source advantage: Reservoir and Contenta

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

A good developer experiencemeans that it's easy to provision APIs for a group of consumer applications

A good developer experiencemeans that it's easy for consumers to work with the provisioned APIs

The decoupled CMSin financial services

6

Decoupled CMS is a compellingarchitecture for financial services

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.

The diversity of open sourceoptimizes decoupled approaches

Decoupled Drupal is optimalfor financial services architectures

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.

[email protected] • @prestonso • #decoupledcmsfinserv

in financial services The decoupled CMS · in financial services ... Universal (isomorphic)...

Documents

Transcript of in financial services The decoupled CMS · in financial services ... Universal (isomorphic)...