Demystifying Decoupled Drupal with Contenta CMS

Decoupled Drupal is all the rage, but getting going can be intimidating. How can one get started without having to understand, install, and configure all of the components needed in a Decoupled Drupal backend?

Hello Contenta CMS!

Contenta is an open source API-first Drupal distribution that makes out of the box decoupled Drupal accessible. No need to install Drupal and figure out which modules and libraries that are needed to create a robust backend for your websites and applications. This session will demonstrate installing Contenta, working with included features, using demo content and consumers, and working with the Contenta community.

The presentation will kick off with a discussion around the benefits of decoupling Drupal. Attendees can look forward to live Contenta install and feature demonstrations. In addition, live code examples will show how various frontends interact with a Contenta backend.

Topics to be covered:

Why decouple Drupal?
Getting started with Contenta
Contenta features and capabilities
Connecting frontend applications to Contenta

Outcomes:

At the end of this session, attendees will be able to:

Install Contenta
Know how to contribute back to Contenta
Know how to connect a frontend application to a Contenta backend

First presented by Bayo Fodeke and shrop at Drupal Camp Asheville 2018

Transcript

1. Demystifying Decoupled Drupal with Contenta CMS July 14th, 2018
2. | 2 Today’s Agenda I. What’s Decoupled Drupal? II. Why Decouple Drupal? III. What’s Contenta CMS? IV. Contenta CMS Features V. Contenta CMS Demos VI. Q&A
3. | 3 Today’s Team Mark Shropshire Open Source Security Lead Bayo Fodeke Senior Drupal Developer
4. | 4 About Mediacurrent
5. | 5 Mediacurrent is a full-service digital agency that implements world class open source software development, strategy and design to achieve defined goals for enterprise organizations seeking a better return on investment. Who We Are
6. | 6 What’s Decoupled Drupal?
7. | 7 “Decoupled Drupal (or headless Drupal) allows the developer to utilize any technology to render the front-end experience in lieu of the theming and presentation layers in Drupal. This process utilizes Drupal as a content service. The Drupal back end exposes content to other systems, such as native applications, JavaScript applications, and IoT devices. Drupal also supports a robust offering of web services, including the core REST API, JSON API, and GraphQL, in addition to SDKs like Waterwheel.js (JavaScript) and Waterwheel.swift (Swift). This means that any system can consume content from Drupal with ease.” https://www.acquia.com/products-services/decoupled
8. | 8 Fully Decoupled Drupal Drupal 8 Backend Client: browser, native mobile app, digital signage, etc. Decoupled Frontend
9. | 9 Progressively Decoupled Drupal Drupal 8 Backend and Frontend Client: browser, native mobile app, digital signage, etc. JavaScript Framework rendering portions of the page
10. | 10 Why Decouple Drupal?
11. | 11 Reasons to Decouple Drupal • Frontend developer experience (Drupal knowledge not necessary) • Content can be delivered to many different devices and formats • Multiple delivery mechanisms: JSON API, GraphQL, REST, etc. • Ability to replace the frontend without affecting the backend
12. | 12 Traditional Drupal Approach There is nothing wrong with a standard Drupal approach where the Drupal instance provides the backend and frontend experience. Great read on making the decision to decouple Drupal (when and how): https://dri.es/how-to-decouple-drupal-in-2018
13. | 13 What’s Conenta CMS?
14. | 14 Contenta is an API-First Drupal distribution. It provides a standard platform that is API ready along with demo content and example front-end applications. Contenta intends to ease the pain of using, or simply trying, decoupled Drupal. http://www.contentacms.org
15. | 15 Contenta CMS Features
16. | 16 Contenta CMS Features JSON API Example Consumers GraphQL Oauth2 Drupal 8 OpenAPI Open Source Example Content
17. | 17 Contenta CMS Demos
18. | 18 Demos • Contenta CMS Installation ◦ composer create-project contentacms/contenta-jsonapi-project MYPROJECT --stability dev --no-interaction • Contenta CMS (stockwatch-api) ◦ https://github.com/shrop/stockwatch-api ◦ Creating content models ◦ API options ▪ JSON API endpoint ◦ Oauth
19. | 19 Demos • React Frontend (stockwatch) ◦ https://github.com/shrop/stockwatch-react ◦ CORS (Cross-Origin Resource Sharing) ◦ Oauth (implicit grant) ▪ Login ◦ Reading JSON API data ▪ Filtering
20. Thank you! @Mediacurrent Mediacurrent.com facebook.com/mediacurrent