The slide deck for the session How to keep Drupal relevant in the Git-based and API-driven CMS era at Florida DrupalCamp

1. How to keep Drupal relevant in the
Git-based and API-driven CMS era
by Jesus Manuel Olivas / weKnow#fldc2019

2. $ whoami
Jesus Manuel Olivas
jmolivas@weknowinc.com
jmolivas
jmolivas
drupal.org/u/jmolivas
jmolivas.weknowinc.com

3. Mexicali
Mexico + California
Calexico
California + Mexico
$ ifconfig

4. weAre

5. weKnow

6. weGive
3,610,228

7. Drupal … Drupal … Drupal

8. When all you have is a
hammer, everything looks
like a nail.

10. Traditional Monolithic CMS

11. Decoupling the frontend

12. Traditional Monolithic CMS + Particle (Design System)

13. The Traditional Headless

14. ●
Drupal Headless API + Front-end library

15. ●
Symfony API + Front-end library

16. Challenges

17. Challenges
Performance Reliability Security Hosting

18. Performance
Visitor Server CMS Database

19. Reliability - The Traditional Stack

20. Reliability - The Traditional Stack + Cache

21. Reliability - The Headless Stack

22. Reliability - A more advanced Stack

23. Security
> Stack dependencies
> Platform dependencies core
> Custom modules dependencies
> Third party libraries

24. Hosting
> Managing a complex stack is not easy.
> Requires knowledge of managing servers,
databases, cache, DNS, backups, automation, and
much more.
> The more complex your stack is to support your
production site, the more expensive it becomes.

25. PaaS Headless CMS

26. ●
Contentful, GraphCMS, Sanity + Front-end library

27. Back to the flat-files

28. Everything old
is new again

29. git-based

30. Improving the UX providing a GUI
when using a Git-based CMS.

31. git-based + UI using a PaaS
Netlify Forestry CloudCannon

32. Using Drupal to provide a GUI and
content for a Git-based/API-driven CMS.

33. Drupal CMS + Tome to export as Flat Files
+ ● Build

34. Decoupling the
"Content Management GUI"
from the
“Production Environment".

36. Blazing fast site generator for React

37. The Content Mesh
● https://www.gatsbyjs.org/blog/2018-10-18-creating-compelling-content-experiences/

40. https://github.com/weknowinc/drupal-boina
# Clone repository
git clone git@github.com:weknowinc/drupal-boina.git
# Copy .env file
cp .env.dist .env
# Start containers
ahoy up
# Install Composer dependencies
ahoy composer install
# Install Boina distribution
ahoy drupal boina:install

41. https://github.com/weknowinc/gatsby-starter-drupal-boina
# Download Starter
gatsby new boina https://github.com/weknowinc/gatsby-starter-drupal-boina
cd boina
# Copy environment file
cp .env.dist .env.development
# Update environment variables
DRUPAL_HOST=http://drupal-boina.develop/
# Start Gatsby in development mode
gatsby develop

42. ● Build● API / GraphQL

43. Feel free to turn off your Drupal after build
●https://twitter.com/ckaotik/status/647020262001614848

44. Performance
Visitor CDN

45. The API Driven CMS Stack

46. Challenges
• Use a markdown editor with Drupal. (tui_editor)
• Preprocess inline-images on markdown. (gatsby-remark-drupal)
• Deploy your site directly from Drupal. (build_hooks)

47. API Services
• Web Forms (CRM Integration , Serverless
Function, Form submission PaaS)
• E-Commerce (Shopify, Salsify, PXM,
Headless Commerce, Stripe, Paypal, Recurly)
• Comments (Disqus, Serverless functions)

48. What is Gone
• Twig
• Render array
• Theme layer
• Theme preprocessing
• *Views (use GraphQL instead)
• Data modeling.
• Content editor capabilities,
revisions, moderation and
scheduling.
• Pathauto
• Site Settings
What to keep using

49. Must have plugins
• gatsby-source-drupal
• gatsby-remark-drupal
• gatsby-transformer-remark
• gatsby-remark-images
• gatsby-remark-external-links
• gatsby-plugin-sharp
• gatsby-plugin-react-helmet

50. Choose the right tool for
the job

51. Thank you … Questions?
Feel free to ping me during the event,
at the parties, after-parties, and twitter @jmolivas