Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
©2016 Acquia Inc. — Confidential and Proprietary
API-first Drupal
and the future of the CMS
Preston So
Development Manager...
©2016 Acquia Inc.
Welcome!
Preston So (@prestonso) has been a web developer and designer since
2001, a creative profession...
©2016 Acquia Inc.
Welcome!
©2016 Acquia Inc.
What we’ll cover
– Imagining the future
– The world around us is evolving
– API-first Drupal
– Web servi...
©2016 Acquia Inc.
Imagining the future
Think back to your first
Drupal site
Think about
where Drupal is now
What did digital
experiences look like in
2008?
What did digital
experiences look like in
2012?
What do digital
experiences look like in
2016?
What will digital
experiences look like in
2020?
Simone Biles
Katie Ledecky
Wearables Conversational
interfaces
Internet of
Things (IoT)
Augmented
and virtual
reality
AI and machine
learning
Wearables Conversational
interfaces
Internet of
Things (IoT)
Augmented
and virtual
reality
AI and machine
learning
©2016 Acquia Inc.
The world around us is
evolving
We are in the midst of a content revolution ...
… and a reinvention of content delivery.
The web is now just the bare minimum among touchpoints.
IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
S...
We’re moving from standalone digital experiences to entire digital ecosystems ...
Native
mobile
app
Website
IoT app
Native...
Pull-based Push-based
… from pull-based content delivery to push-based content delivery ...
Amazon
Echo push
notification
...
… and from consumption of content to interaction with content.
Amazon
Echo push
notification
User-
generated
response
Inte...
In New York City, Drupal
feeds information to
kiosks in the MTA.
Drupal 8 provides data to
smartphone apps linked
to Tesla...
Drupal is now a centerpiece of application ecosystems.
IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
Se...
But we have new competition: the headless CMS.
IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
Set-top
bo...
And we have new devices or touchpoints every day.
IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
Set-top...
IoT apps
Native
apps
Chat
apps
Single-
page
apps
Other
back
ends
Set-top
boxes
Smart
watches
Fitness
devices
Arduino
board...
©2016 Acquia Inc.
API-first Drupal
Think of Earth as one contiguous unit: a monolith.
Earth responds to requests from decoupled bases.
request
response
Drupal is a monolithic CMS backing decoupled applications.
HTTP request
HTTP response
HTTP request
HTTP response
Site or repository
built in Drupal
Decoupled
application
HTTP request
HTTP response (JSON, XML)
Site or repository built in
Drupal
Decoupled
application
REST API
Decoupled
applica...
©2016 Acquia Inc.
API-first (decoupled) Drupal
– Decoupled Drupal, or API-first Drupal, is the process of
employing Drupal...
Monolithic vs. decoupled
Drupal
Drupal front end
PHP
Data
Templates
HTML
Drupal
Decoupled application
PHP
Data
Templates
H...
Drupal
Native Android application
PHP
Data
Templates
App code
Java
JSON
Drupal
Single-page application
(universal JavaScri...
Silex application
Data
Templates
HTML or
app code
JSON
Drupal
Native iOS application
PHP
Obj-C PHP
REST API
©2016 Acquia Inc.
Web services and
SDKs
HTTP request
HTTP response (JSON, XML)
Site or repository built in
Drupal
Decoupled
application
Web services
Decoupled
app...
Web services
Full feature set
Single REST API in core
Specification flexibility
SDKs
For JavaScript apps
For native apps
F...
Web services in Drupal 8 are currently spread
across a variety of implementations.
Core
REST
modules
Services
(D8)
RELAXed...
We need a full feature set and unified REST API in
Drupal core.
Future
core REST
Content entity CRUD
Views REST exports
Re...
Application developers should be able to use the
specification of their choice.
HAL+
JSON
JSON APICouchDB GraphQL
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
JavaScript
Native app
Rails
IoT app
Currently, consuming Drupal data requires a
basic understanding of Drupal’s REST API.
JavaScript
application
I need the ti...
Waterwheel is an ecosystem of SDKs that accelerate
development of Drupal-backed applications.
JavaScript
application
I nee...
Waterwheel is an ecosystem of SDKs that accelerate
development of Drupal-backed applications.
JavaScript
application
Curre...
github.com/acquia/waterwheel-js
github.com/acquia/waterwheel-swift
©2016 Acquia Inc.
The JavaScript
renaissance
Static pages
Subscribe to our newsletter You have been successfully
subscribed!
E-mail address
Submit
full-page refresh
Dr...
Dynamic pages with Ajax
Subscribe to our newsletter
E-mail address
Submit
Drupal
Drupal front end
PHP
Data
Templates
HTML
...
Dynamic pages with client-side rendering
Subscribe
E-mail
Submit
HTTP
request
HTTP
response
Lorem
ipsum dolor
sit amet,
co...
©2016 Acquia Inc.
Rewards of fully decoupled Drupal
– Separation of concerns (structure vs. presentation)
– Content syndic...
©2016 Acquia Inc.
Risks of fully decoupled Drupal
– Additional point of failure (REST API, other hosting)
– No cross-site ...
©2016 Acquia Inc.
When should you decouple Drupal?
– A site powering one or more other sites
– A site powering one or more...
©2016 Acquia Inc.
For standalone sites and apps …
– You don’t need the overhead of a decoupled
architecture to power a sta...
Fully decoupled Drupal
Subscribe
E-mail
Submit
HTTP
request
HTTP
response
Lorem
ipsum dolor
sit amet,
consectetuer
adipisc...
Fully decoupled Drupal
Subscribe
E-mail
Submit
HTTP
request
HTTP
response
Lorem
ipsum dolor
sit amet,
consectetuer
adipisc...
Progressively decoupled Drupal
Subscribe
E-mail
Submit
HTTP
request
HTTP
response
Lorem
ipsum dolor
sit amet,
consectetuer...
©2016 Acquia Inc.
Risks of fully decoupled Drupal
– Additional point of failure (REST API, other hosting)
– No cross-site ...
©2016 Acquia Inc.
Rewards of progressively decoupled Drupal
– No additional point of failure (REST API, other hosting)
– C...
©2016 Acquia Inc.
Epilogue: Drupal’s API-
first future
Think again about
where Drupal is now
How can we make Drupal
more API-first?
How can we benefit from
a native user experience
and
editorial capabilities?
Should Drupal be
decoupled out of the box?
Should all CMSes be
decoupled out of the box?
More information
➔ API-first initiative
◆ www.drupal.org/node/2757967
➔ API-first initiative at DrupalCon Dublin
◆ events....
©2016 Acquia Inc.
Thank you!
Preston So (@prestonso)
drupal.org/u/prestonso
preston.so@acquia.com
Learn more about Acquia ...
API-First Drupal and the Future of the CMS
API-First Drupal and the Future of the CMS
Upcoming SlideShare
Loading in …5
×

API-First Drupal and the Future of the CMS

1,925 views

Published on

Is the future of content management decoupled? Centralization around a single source of content has never been more important as marketers aim to reach a growing array of channels and touchpoints. New tools known as headless CMSes providing content as a service are challenging the monolithic architecture that has long characterized CMSes like Drupal. What role do Drupal and traditional CMSes play in an increasingly API-first playing field and fragmented future?

New architectural techniques such as JavaScript isomorphism and server-side prerendering illustrate the urgency of this question, while new approaches for querying data that aim to replace strictly RESTful architectures assign the CMS a primarily content-focused role. With the recent turn toward API-first approaches, what the future holds for longstanding CMSes like Drupal has never been a more pressing, or more intriguing, concern.

This tech talk will examine the role that Drupal and other CMSes occupy amidst a rapidly changing universe. Topics will include:
-Impacts on markup, performance, security, and the relationship between the front end and back end against the backdrop of decoupled Drupal and the headless CMS
-Imagining the API-first future and what this means for Drupal
-Web services: REST, JSON API, and GraphQL
-The benefits of SDKs such as Waterwheel

Published in: Technology
  • Login to see the comments

API-First Drupal and the Future of the CMS

  1. 1. ©2016 Acquia Inc. — Confidential and Proprietary API-first Drupal and the future of the CMS Preston So Development Manager, Acquia Labs March 8, 2017
  2. 2. ©2016 Acquia Inc. Welcome! Preston So (@prestonso) has been a web developer and designer since 2001, a creative professional since 2004, and a Drupal developer since 2007. As Development Manager of Acquia Labs, Preston leads new open-source and research initiatives at Acquia. Preston has presented keynotes at conferences on three continents in both English and Portuguese and speaks about diverse topics such as decoupled Drupal, responsive design, front-end development, and user experience. – drupal.org/u/prestonso – preston.so@acquia.com
  3. 3. ©2016 Acquia Inc. Welcome!
  4. 4. ©2016 Acquia Inc. What we’ll cover – Imagining the future – The world around us is evolving – API-first Drupal – Web services and SDKs – The JavaScript renaissance – Epilogue: Drupal’s API-first future
  5. 5. ©2016 Acquia Inc. Imagining the future
  6. 6. Think back to your first Drupal site
  7. 7. Think about where Drupal is now
  8. 8. What did digital experiences look like in 2008?
  9. 9. What did digital experiences look like in 2012?
  10. 10. What do digital experiences look like in 2016?
  11. 11. What will digital experiences look like in 2020?
  12. 12. Simone Biles Katie Ledecky
  13. 13. Wearables Conversational interfaces Internet of Things (IoT) Augmented and virtual reality AI and machine learning
  14. 14. Wearables Conversational interfaces Internet of Things (IoT) Augmented and virtual reality AI and machine learning
  15. 15. ©2016 Acquia Inc. The world around us is evolving
  16. 16. We are in the midst of a content revolution ...
  17. 17. … and a reinvention of content delivery.
  18. 18. The web is now just the bare minimum among touchpoints. IoT apps Native apps Chat apps Single- page apps Other back ends Set-top boxes
  19. 19. We’re moving from standalone digital experiences to entire digital ecosystems ... Native mobile app Website IoT app Native app Chat app Single- page app Other back ends Set-top box Content store
  20. 20. Pull-based Push-based … from pull-based content delivery to push-based content delivery ... Amazon Echo push notification AR/VR notification overlay In-store product alerts
  21. 21. … and from consumption of content to interaction with content. Amazon Echo push notification User- generated response Interaction with AR/VR interface AR/VR notification overlay
  22. 22. In New York City, Drupal feeds information to kiosks in the MTA. Drupal 8 provides data to smartphone apps linked to Tesla vehicles. Lufthansa supplies its in- flight entertainment systems with Drupal 8.
  23. 23. Drupal is now a centerpiece of application ecosystems. IoT apps Native apps Chat apps Single- page apps Other back ends Set-top boxes
  24. 24. But we have new competition: the headless CMS. IoT apps Native apps Chat apps Single- page apps Other back ends Set-top boxes
  25. 25. And we have new devices or touchpoints every day. 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
  26. 26. 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 Our mission is to make Drupal the best API-first CMS.
  27. 27. ©2016 Acquia Inc. API-first Drupal
  28. 28. Think of Earth as one contiguous unit: a monolith.
  29. 29. Earth responds to requests from decoupled bases. request response
  30. 30. Drupal is a monolithic CMS backing decoupled applications. HTTP request HTTP response
  31. 31. HTTP request HTTP response Site or repository built in Drupal Decoupled application
  32. 32. HTTP request HTTP response (JSON, XML) Site or repository built in Drupal Decoupled application REST API Decoupled application HTTP client
  33. 33. ©2016 Acquia Inc. API-first (decoupled) Drupal – Decoupled Drupal, or API-first Drupal, is the process of employing Drupal as a data service which exposes data for consumption by other applications. – Drupal can be used to back other back-end applications (Rails, .NET, PHP) as well as native applications, single- page JavaScript applications, and IoT applications. – A REST API is the most common entry point for decoupled applications.
  34. 34. Monolithic vs. decoupled Drupal Drupal front end PHP Data Templates HTML Drupal Decoupled application PHP Data Templates HTML Other language JSON REST API
  35. 35. Drupal Native Android application PHP Data Templates App code Java JSON Drupal Single-page application (universal JavaScript) PHP Data Templates HTML JS JSON REST API REST API
  36. 36. Silex application Data Templates HTML or app code JSON Drupal Native iOS application PHP Obj-C PHP REST API
  37. 37. ©2016 Acquia Inc. Web services and SDKs
  38. 38. HTTP request HTTP response (JSON, XML) Site or repository built in Drupal Decoupled application Web services Decoupled application Software development kit (SDK) API-first ideal
  39. 39. Web services Full feature set Single REST API in core Specification flexibility SDKs For JavaScript apps For native apps For back-end apps How can we outperform headless CMSes?
  40. 40. Web services in Drupal 8 are currently spread across a variety of implementations. Core REST modules Services (D8) RELAXed Web Services Content entity CRUD Views REST exports Resource plugins Configuration entity CRUD Configurable route prefixes User login and logout Translations Revisions File attachments Entity Query API Sorting and range Conditions Pagination
  41. 41. We need a full feature set and unified REST API in Drupal core. Future core REST Content entity CRUD Views REST exports Resource plugins Configuration entity CRUD Configurable route prefixes User login and logout Translations Revisions File attachments Sorting and range Conditions Pagination
  42. 42. Application developers should be able to use the specification of their choice. HAL+ JSON JSON APICouchDB GraphQL
  43. 43. DEVELOPERS DEVELOPERS DEVELOPERS DEVELOPERS
  44. 44. DEVELOPERS DEVELOPERS DEVELOPERS DEVELOPERS JavaScript Native app Rails IoT app
  45. 45. Currently, consuming Drupal data requires a basic understanding of Drupal’s REST API. JavaScript application I need the title of node/1. But where can I get to it? And how do I get just the title? Current core REST Here is the node ID, the node UUID, the node type, the node language, the node title, the node author, the node created
  46. 46. Waterwheel is an ecosystem of SDKs that accelerate development of Drupal-backed applications. JavaScript application I need the title of node/1. But where can I get to it? And how do I get just the title? Current core REST Waterwheel.js SDKI need to get node/1 (and I know the route is /node/1?_format=json).
  47. 47. Waterwheel is an ecosystem of SDKs that accelerate development of Drupal-backed applications. JavaScript application Current core REST Waterwheel.js SDK Here is the node ID, the node UUID, the node type, the node language, the node title, the node author, the node created The title of the first article is “Blueberry Hill” (and I know it’s in the response at response.title[0].value).
  48. 48. github.com/acquia/waterwheel-js github.com/acquia/waterwheel-swift
  49. 49. ©2016 Acquia Inc. The JavaScript renaissance
  50. 50. Static pages Subscribe to our newsletter You have been successfully subscribed! E-mail address Submit full-page refresh Drupal Drupal front end PHP Data Templates HTML Drupal Drupal front end Data Templates HTML
  51. 51. Dynamic pages with Ajax Subscribe to our newsletter E-mail address Submit Drupal Drupal front end PHP Data Templates HTML Subscribe to our newsletter Success! E-mail address Submit Subscribe to our newsletter E-mail address Submit AJAX request AJAX response
  52. 52. Dynamic pages with client-side rendering Subscribe E-mail Submit HTTP request HTTP response Lorem ipsum dolor sit amet, consectetuer adipiscing. Lorem ipsum dolor sit amet, consectetuer adipiscing. Success! Here are others that might interest you: Lorem ipsum dolor sit amet, consectetuer adipiscing. Drupal Decoupled front end REST API
  53. 53. ©2016 Acquia Inc. Rewards of fully decoupled Drupal – Separation of concerns (structure vs. presentation) – Content syndication (write once, publish everywhere) – Differentiated development velocities between front and back end (independent front-end redesigns) – Rich application ecosystem (auxiliary applications such as SPAs, native mobile, and IoT)
  54. 54. ©2016 Acquia Inc. Risks of fully decoupled Drupal – Additional point of failure (REST API, other hosting) – No cross-site scripting protection or input sanitization – No in-place, in-context editing or administration – No layout and display management – No previewable content workflow – No modules affecting the front end – No system notifications (errors, messages) – No BigPipe progressive loading or cache tags – No accessible markup or user experience benefits
  55. 55. ©2016 Acquia Inc. When should you decouple Drupal? – A site powering one or more other sites – A site powering one or more other applications – A site powering multiple sites or applications – Standalone applications – Standalone sites
  56. 56. ©2016 Acquia Inc. For standalone sites and apps … – You don’t need the overhead of a decoupled architecture to power a standalone site or application. – Doing so can lead to workarounds that duplicate, interrupt, or otherwise obfuscate the integrity of end-to- end Drupal. – There is a better solution: progressive decoupling.
  57. 57. Fully decoupled Drupal Subscribe E-mail Submit HTTP request HTTP response Lorem ipsum dolor sit amet, consectetuer adipiscing. Lorem ipsum dolor sit amet, consectetuer adipiscing. Success! Here are others that might interest you: Lorem ipsum dolor sit amet, consectetuer adipiscing. Drupal JavaScript framework REST API
  58. 58. Fully decoupled Drupal Subscribe E-mail Submit HTTP request HTTP response Lorem ipsum dolor sit amet, consectetuer adipiscing. Lorem ipsum dolor sit amet, consectetuer adipiscing. Success! Here are others that might interest you: Lorem ipsum dolor sit amet, consectetuer adipiscing. Drupal JavaScript framework REST API
  59. 59. Progressively decoupled Drupal Subscribe E-mail Submit HTTP request HTTP response Lorem ipsum dolor sit amet, consectetuer adipiscing. Lorem ipsum dolor sit amet, consectetuer adipiscing. Success! Here are others that might interest you: Lorem ipsum dolor sit amet, consectetuer adipiscing. Drupal REST API Drupal front end JS framework
  60. 60. ©2016 Acquia Inc. Risks of fully decoupled Drupal – Additional point of failure (REST API, other hosting) – No cross-site scripting protection or input sanitization – No in-place, in-context editing or administration – No layout and display management – No previewable content workflow – No modules affecting the front end – No system notifications (errors, messages) – No BigPipe progressive loading or cache tags – No accessible markup or user experience benefits
  61. 61. ©2016 Acquia Inc. Rewards of progressively decoupled Drupal – No additional point of failure (REST API, other hosting) – Cross-site scripting protection and input sanitization – In-place, in-context editing and administration – Layout and display management – Previewable content workflow – Modules affecting the front end – System notifications (errors, messages) – BigPipe progressive loading and cache tags – Accessible markup and user experience benefits
  62. 62. ©2016 Acquia Inc. Epilogue: Drupal’s API- first future
  63. 63. Think again about where Drupal is now
  64. 64. How can we make Drupal more API-first?
  65. 65. How can we benefit from a native user experience and editorial capabilities?
  66. 66. Should Drupal be decoupled out of the box?
  67. 67. Should all CMSes be decoupled out of the box?
  68. 68. More information ➔ API-first initiative ◆ www.drupal.org/node/2757967 ➔ API-first initiative at DrupalCon Dublin ◆ events.drupal.org/dublin2016/sessions/api-first-initiative ➔ API-first initiative at DrupalCon Baltimore ◆ events.drupal.org/baltimore2017/sessions/api-first-initiative
  69. 69. ©2016 Acquia Inc. Thank you! Preston So (@prestonso) drupal.org/u/prestonso preston.so@acquia.com Learn more about Acquia Labs: acquia.com/resources/acquia-labs

×