Join Pantheon co-founder Josh Koenig to learn about decoupled WordPress: what it is, the benefits and pitfalls, and how to approach a decoupled project. Koenig will walk through a decoupled build using the WP-API, and registrants can ask questions after the session.

2. CONTENT AS A SERVICE:
DECOUPLED WORDPRESS
WITH THE REST API

3. Pantheon.io 3
Speakers
Josh Koenig
Co-Founder & Head of Product
@outlandishjosh

4. Pantheon.io 4
“Learn JavaScript Deeply”
“JavaScript is the
future of the web. I
know this as surely as
I know that barbecue
is delicious.”

5. Pantheon.io 5
Many Frameworks Exist
ReactJS Backbone Angular

6. Pantheon.io 6
Decoupling Client and Server

7. Pantheon.io 7
Monoliths vs. Microservices
Monolith
Templates & Themes
Display Logic
Editorial UI
Admin UI
VS.
Decoupled

8. Pantheon.io 8
The Limits of the Theme Layer as Architecture
Theme Layer
Plugins / Core
Permeable
Boundary
Exciting / awkward
game of chance

9. Pantheon.io 9
Monoliths Can Lead to Unhappy Developers

10. Pantheon.io 10
Strong Separation of Concerns
Client
WordPress
HTTP API
Everyone Wins

11. Pantheon.io 11
Use the Tools You Prefer

12. Pantheon.io 12
Parallel Track Progress

13. Pantheon.io 13
Future Proofing

14. Pantheon.io 14
Caveats

15. Pantheon.io 15
WordPress Does a Lot of Things

16. Pantheon.io 16
HTTP: Do you speak it?
Hur De Flur Shiffen de
PUT Dur Skurf Nerf
CURL we Flu Pur
OPTIONS me
Skupplen de Noff

17. Pantheon.io 17
No, but seriously… HTTP… what r u doin?
source: https://github.com/inhabitedtype/ocaml-webmachine

18. Pantheon.io 18
Primary Use-Case: Custom Sites/Apps
Source: 2014 State of the Word

19. Pantheon.io 19
WP-API Can Grow the WP Market

20. MANY WAYS OF DECOUPLING
Which is right for you?

21. Pantheon.io 21
Static Generator / Renderer
CMS
Static
Site
User
Request
Static
• Create a fast and resilient
user-facing site.
• Utilize front-end atomic design
tools, minimal/elegant
markup, etc.
• Read-only, but highly secure
and scalabe.

22. Pantheon.io 22
Hybrid
CMS
Static
Site
User
Request
Static
• Build up a REST API on your
site to power dynamic
forms/dashboards.
• Many other functions served
directly from Drupal as per
normal.
• Restrains the scope. Allows
for particular experiences to
be enhanced.
CMS
JS App
User
Request
Hybrid

23. Pantheon.io 23
“Single Page” App
CMS
Static
Site
User
Request
Static
• Client side JavaScript
application runs in-browser,
pulls data from CMS via API.
• May include user interactions,
or be purely content oriented.
• Typically utilize a front-end
framework like Angular,
Backbone, or React.CMS
Single
Page App
User
Request
Single Page

24. Pantheon.io 24
Native Mobile App / IoT
CMS
Static
Site
User
Request
Static
• CMS powers embedded
applications via API.
• May also present some web
functionality to users.
• Drive IOS and Android native
apps, as well as “internet of
things” implementations.
CMS
Native
Mobile
App
User
Request
Native
(optional)

25. Pantheon.io 25
CMS-on-CMS
CMS
Static
Site
User
Request
Static
• Separation of concerns, but
not technologies.
• Front-end CMS can control
configuration, caching,
throttling.
• Develop reusable
components for a Service-
Oriented / Microservices
architecture.
CMS
User
Request
CMS2
CMS

26. Pantheon.io 26
Everything Old is New Again

27. Pantheon.io 27
WordPress 4.4
First REST API framework
elements in core. Plugins still
required for functionality.
Now is a good time for plugin
developers to start thinking
about API compatibility and
features.

28. Pantheon.io 28
“Calypso”
ReactJS based application for
administering WordPress.com sites.
Open source, a great inspirational
example.
Uses Jetpack’s APIs.

29. LIVE DEMO
Hopefully the deities of demonstration are pleased…

30. Pantheon.io 30
Resources
https://github.com/Automattic/wp-calypso
https://github.com/joshkoenig/todo-wp
https://github.com/dirtystylus/wordcampus-2015-js-example
http://javascriptforwp.com/

31. Pantheon.io 31
Thanks!
Thanks! Questions?
@getpantheon