Moving weKnow's personal blog sites from Drupal to GatsbyJS
Moving weKnow's personal blog sites from Drupal to GatsbyJS
At WeKnow, we've been using Gatsby with Drupal for projects lately as our decouple strategy.
We decided to use the same approach for our personal blog sites, and the latest version of this blog was launched using GatsbyJS. What does this mean, We are no longer using Drupal?
Yes, for this site we are no longer using the Drupal theme layer, Twig, theme preprocessing, and the always loved/hated render array. All the frontend was done using ReactJS a modern JS framework.
And no, because Drupal is still used as the backend taking advantage of the JSON-API contributed module.
Why GastbyJS for the frontend?
- Taking advantage of bleeding edge architecture to deliver a performant website.
- Turn a content-driven website into a blazing-fast application by pulling data from Drupal and building a site using flat-files.
- Deploy a site directly to CDN saving headaches and hosting costs.
- Write all the frontend code using reusable components and a modern framework as React.
How fast is GatsbyJS?
Well after running an audit using lighthouse we obtain the following results.
No custom performance tasks are done yet, this is the out-of-the-box performance result by building the site using GatsbyJS.
Why Drupal as the backend?
- Take advantage of Drupal content model capabilities, creating content types, adding fields, and configuration entities to manage site settings, media management among others.
- Take advantage of Drupal as a Content Management System, add, edit, draft, publish and schedule content.
- Take advantage of the acquired knowledge during several years of using the platform.
What were the challenges?
- Make sure Drupal JSON-API returns markdown to take advantage of the
gatsby-transformer-remarkplugin. - Make sure inline images within markdown are processed using the
gatsby-transformer-sharpplugin . - Deploy site to a CDN.
- Execute build and deploy the site on demand and/or programmatically after updating data on Drupal.
Gatsby is taking the world by storm and the JAMstack is here to stay. Join me at my BADCamp session How to keep Drupal relevant in the Git-based and API-driven CMS era, to learn what can we do to keep Drupal relevant and this new era to find out how we solve all those challenges and to learn more about this topic and understand how to decouple the "Content Management" from the “Production Environment".