SlideShare a Scribd company logo
Jesus Manuel Olivas / octahedroid
Embracing the modern web
using a Headless CMS with GatsbyJS
Jesus Manuel Olivas
jmolivas.com
@jmolivas
———————————————
octahedroid.com
Co-Founder
We are a professional services and
consulting agency specializing in modern
front-end tools, cloud native architectures,
automation and CMS integrations.
Agenda
> Drupal & Wordpress as Headless CMS
> GraphQL
> JAMstack
> GatsbyJS
> Web Development 101
Web Development 101
Traditional monolithic stack
Visitor Server
Database
Server render (traditional)
Server Client
SPA (client side)
Server Client
The Modern Stack (JAMstack)
Visitor CDN
Embracing the modern web using a Headless CMS with GatsbyJS Stanford
JAMstack (pre-render markup)
Server ClientBuild Server
Performance Reliability Security Hosting
Why JAMstack
Traditional Monolithic CMS
Content Management System
A CMS is an application that is
used to manage web content,
allowing multiple contributors to
create, edit and publish content.
Why Drupal and/or Wordpress
Current legacy sites
Battled tested and well known GUI
User and Content management
and workflow capabilities
Headless CMS
A Headless CMS, is a back-end only
content management system, that
makes content accessible via a
RESTful or GraphQL API for display
on any device.
GraphQL
GraphQL is an open-source
data query and manipulation
language for APIs.
Centralize data with GraphQL
Easier to explore
More team-friendly (front/back-end)
Single source of truth (build/SSR/client)
Provides a better DX (developer experience)
Consistent and shareable development workflow
Drupal / WP/GraphQL
GatsbyJS
Gatsby is a free and open source
framework based on React that
helps developers build blazing
fast  websites and apps
GatsbyJS
Plugins
> Add external data or content
> Customize GraphQL schema
> Transform data formats
> Add 3rd-party services
Themes
wordpress
drupal
Theme Customization (shadowing)
wordpressdrupal
Benefits of a theme
> Share code and configuration
> Avoid duplication
> Extendable and customizable
> Allow updatability
Better developer experience
> Iterate faster, deliver better
work
> Separation of concerns allow
for more targeted development
> Enjoy the power of the latest
and modern web technologies
Recommended Tools
Code and Demo
Thank you.
Any Questions?
@jmolivas | @octahedroidHQ

More Related Content

PPTX
Mysql an introduction
Mohd yasin Karim
 
PDF
HubSpot tech stack at MassTLC software development summit
MassTLC
 
PDF
Build static websites with Gatsby.JS
Mateusz Sawka
 
PPTX
Cake php development
Helios Solutions
 
PPTX
Windows Azure
Jose R Jara
 
PPTX
Get Cloud Ready
Janakiram MSV
 
PPTX
Arquitectura de Solución en Azure: Sitio Simple de Marketing
Fernando Mejía
 
PPTX
Un poco de caché, por favor!
David J. Rodriguez Hernandez
 
Mysql an introduction
Mohd yasin Karim
 
HubSpot tech stack at MassTLC software development summit
MassTLC
 
Build static websites with Gatsby.JS
Mateusz Sawka
 
Cake php development
Helios Solutions
 
Windows Azure
Jose R Jara
 
Get Cloud Ready
Janakiram MSV
 
Arquitectura de Solución en Azure: Sitio Simple de Marketing
Fernando Mejía
 
Un poco de caché, por favor!
David J. Rodriguez Hernandez
 

What's hot (9)

PDF
Midgard & Nemein - when an open source project and company evolve together
Henri Bergius
 
PDF
Node.js + NoSQL
Shamod Lacoul
 
PPTX
Windows Azure
Janakiram MSV
 
PPTX
Gitana Repository
uzquiano
 
PPTX
Apresentação Microsoft Azure no SASPI 5
Lucas Chies
 
PDF
Drupal Step-by-Step: Building a Drupal Site with Acquia Cloud Site Factory
Acquia
 
PPTX
Backgrid - A Backbone Plugin
Neerav Mittal
 
PPTX
Platform as a service
Shadrach Jabonir
 
PDF
MariaDB on MS Azure - 2
MariaDB plc
 
Midgard & Nemein - when an open source project and company evolve together
Henri Bergius
 
Node.js + NoSQL
Shamod Lacoul
 
Windows Azure
Janakiram MSV
 
Gitana Repository
uzquiano
 
Apresentação Microsoft Azure no SASPI 5
Lucas Chies
 
Drupal Step-by-Step: Building a Drupal Site with Acquia Cloud Site Factory
Acquia
 
Backgrid - A Backbone Plugin
Neerav Mittal
 
Platform as a service
Shadrach Jabonir
 
MariaDB on MS Azure - 2
MariaDB plc
 
Ad

More from Jesus Manuel Olivas (20)

PDF
Remix & GraphQL: A match made in heaven with type-safety DX
Jesus Manuel Olivas
 
PDF
Drupal 10 Party GraphQL
Jesus Manuel Olivas
 
PDF
How to use Drupal to create editorial experiences your content creators will...
Jesus Manuel Olivas
 
PDF
Beyond Static: Building a Dynamic Application with Gatsby
Jesus Manuel Olivas
 
PDF
Drupal, GraphQL, Views, View Modes and Gatsby for a US Gov site CMS Philly
Jesus Manuel Olivas
 
PDF
Embracing the modern web using a Headless CMS with GatsbyJS CMS Philly
Jesus Manuel Olivas
 
PDF
Building a modern application using Symfony API Platform and GatsbyJS PHP QRO
Jesus Manuel Olivas
 
PDF
Building a dynamic application with GatsbyJS-Tec-Mexicali
Jesus Manuel Olivas
 
PDF
Building a modern web application in the cloud partnercon
Jesus Manuel Olivas
 
PDF
Embracing the modern web using Drupal as a Headless CMS with Gatsby BADCamp
Jesus Manuel Olivas
 
PDF
Blazing fast sites using Blaze, Hybrid CMS NYC
Jesus Manuel Olivas
 
PDF
Embracing the modern web using Drupal as Headless CMS with GatsbyJS NYC
Jesus Manuel Olivas
 
PDF
Writing a slack chatbot seattle
Jesus Manuel Olivas
 
PDF
Building a Modern Web Application in the Cloud TecNerd
Jesus Manuel Olivas
 
PDF
How to keep Drupal relevant in the Git-based and API-driven CMS era Florida
Jesus Manuel Olivas
 
PDF
How to keep Drupal relevant in the Git-based and API-driven CMS era DrupalCampNJ
Jesus Manuel Olivas
 
PDF
Tools and Projects Dec 2018 Edition
Jesus Manuel Olivas
 
PDF
Creating a modern web application using Symfony API Platform Atlanta
Jesus Manuel Olivas
 
PDF
How to keep Drupal relevant in the Git-based and API-driven CMS era - BADCamp
Jesus Manuel Olivas
 
PDF
Battle of the CMS DrupalCampLA
Jesus Manuel Olivas
 
Remix & GraphQL: A match made in heaven with type-safety DX
Jesus Manuel Olivas
 
Drupal 10 Party GraphQL
Jesus Manuel Olivas
 
How to use Drupal to create editorial experiences your content creators will...
Jesus Manuel Olivas
 
Beyond Static: Building a Dynamic Application with Gatsby
Jesus Manuel Olivas
 
Drupal, GraphQL, Views, View Modes and Gatsby for a US Gov site CMS Philly
Jesus Manuel Olivas
 
Embracing the modern web using a Headless CMS with GatsbyJS CMS Philly
Jesus Manuel Olivas
 
Building a modern application using Symfony API Platform and GatsbyJS PHP QRO
Jesus Manuel Olivas
 
Building a dynamic application with GatsbyJS-Tec-Mexicali
Jesus Manuel Olivas
 
Building a modern web application in the cloud partnercon
Jesus Manuel Olivas
 
Embracing the modern web using Drupal as a Headless CMS with Gatsby BADCamp
Jesus Manuel Olivas
 
Blazing fast sites using Blaze, Hybrid CMS NYC
Jesus Manuel Olivas
 
Embracing the modern web using Drupal as Headless CMS with GatsbyJS NYC
Jesus Manuel Olivas
 
Writing a slack chatbot seattle
Jesus Manuel Olivas
 
Building a Modern Web Application in the Cloud TecNerd
Jesus Manuel Olivas
 
How to keep Drupal relevant in the Git-based and API-driven CMS era Florida
Jesus Manuel Olivas
 
How to keep Drupal relevant in the Git-based and API-driven CMS era DrupalCampNJ
Jesus Manuel Olivas
 
Tools and Projects Dec 2018 Edition
Jesus Manuel Olivas
 
Creating a modern web application using Symfony API Platform Atlanta
Jesus Manuel Olivas
 
How to keep Drupal relevant in the Git-based and API-driven CMS era - BADCamp
Jesus Manuel Olivas
 
Battle of the CMS DrupalCampLA
Jesus Manuel Olivas
 
Ad

Recently uploaded (20)

PDF
NewMind AI Weekly Chronicles - July'25 - Week IV
NewMind AI
 
PDF
NewMind AI Monthly Chronicles - July 2025
NewMind AI
 
PDF
Unlocking the Future- AI Agents Meet Oracle Database 23ai - AIOUG Yatra 2025.pdf
Sandesh Rao
 
PDF
solutions_manual_-_materials___processing_in_manufacturing__demargo_.pdf
AbdullahSani29
 
PDF
Orbitly Pitch Deck|A Mission-Driven Platform for Side Project Collaboration (...
zz41354899
 
PDF
CIFDAQ's Token Spotlight: SKY - A Forgotten Giant's Comeback?
CIFDAQ
 
PDF
agentic-ai-and-the-future-of-autonomous-systems.pdf
siddharthnetsavvies
 
PDF
Oracle AI Vector Search- Getting Started and what's new in 2025- AIOUG Yatra ...
Sandesh Rao
 
PDF
DevOps & Developer Experience Summer BBQ
AUGNYC
 
PPTX
ChatGPT's Deck on The Enduring Legacy of Fax Machines
Greg Swan
 
PDF
Automating ArcGIS Content Discovery with FME: A Real World Use Case
Safe Software
 
PDF
The Evolution of KM Roles (Presented at Knowledge Summit Dublin 2025)
Enterprise Knowledge
 
PDF
Test Bank, Solutions for Java How to Program, An Objects-Natural Approach, 12...
famaw19526
 
PPTX
Smart Infrastructure and Automation through IoT Sensors
Rejig Digital
 
PDF
Software Development Company | KodekX
KodekX
 
DOCX
Top AI API Alternatives to OpenAI: A Side-by-Side Breakdown
vilush
 
PDF
madgavkar20181017ppt McKinsey Presentation.pdf
georgschmitzdoerner
 
PDF
SparkLabs Primer on Artificial Intelligence 2025
SparkLabs Group
 
PDF
CIFDAQ'S Market Insight: BTC to ETH money in motion
CIFDAQ
 
PPTX
PA Analog/Digital System: The Backbone of Modern Surveillance and Communication
AVTRON Technologies LLC
 
NewMind AI Weekly Chronicles - July'25 - Week IV
NewMind AI
 
NewMind AI Monthly Chronicles - July 2025
NewMind AI
 
Unlocking the Future- AI Agents Meet Oracle Database 23ai - AIOUG Yatra 2025.pdf
Sandesh Rao
 
solutions_manual_-_materials___processing_in_manufacturing__demargo_.pdf
AbdullahSani29
 
Orbitly Pitch Deck|A Mission-Driven Platform for Side Project Collaboration (...
zz41354899
 
CIFDAQ's Token Spotlight: SKY - A Forgotten Giant's Comeback?
CIFDAQ
 
agentic-ai-and-the-future-of-autonomous-systems.pdf
siddharthnetsavvies
 
Oracle AI Vector Search- Getting Started and what's new in 2025- AIOUG Yatra ...
Sandesh Rao
 
DevOps & Developer Experience Summer BBQ
AUGNYC
 
ChatGPT's Deck on The Enduring Legacy of Fax Machines
Greg Swan
 
Automating ArcGIS Content Discovery with FME: A Real World Use Case
Safe Software
 
The Evolution of KM Roles (Presented at Knowledge Summit Dublin 2025)
Enterprise Knowledge
 
Test Bank, Solutions for Java How to Program, An Objects-Natural Approach, 12...
famaw19526
 
Smart Infrastructure and Automation through IoT Sensors
Rejig Digital
 
Software Development Company | KodekX
KodekX
 
Top AI API Alternatives to OpenAI: A Side-by-Side Breakdown
vilush
 
madgavkar20181017ppt McKinsey Presentation.pdf
georgschmitzdoerner
 
SparkLabs Primer on Artificial Intelligence 2025
SparkLabs Group
 
CIFDAQ'S Market Insight: BTC to ETH money in motion
CIFDAQ
 
PA Analog/Digital System: The Backbone of Modern Surveillance and Communication
AVTRON Technologies LLC
 

Embracing the modern web using a Headless CMS with GatsbyJS Stanford