Building a resilient digital foundation with Drupal + Gatsby

Tara Arnold
Tara Arnold
Senior Marketing Content Strategist, Mediacurrent
09 Apr 2020

We can’t predict the future of tech, but we can plan for it to get the full value of our website investment.

In this post, we explore Mediacurrent’s approach to developing solutions beyond Drupal with a GatsbyJS-driven approach to fully decoupled static sites. This approach has taken organizations across industries—from universities and media to insurance and government—on an empowered path to manage digital content and experiences.

We’ll explore this approach through the lenses of flexibility, scalability, and security—the key ingredients for a future-proof digital foundation.

For sites that require functionality beyond what’s supported by Drupal, a decoupled architecture is often the answer. A decoupled approach addresses some of the pain points of conventional monolithic systems. These include barriers to web service integration, and struggles to source front-end talent (Drupal 8/Twig developers) and maintain an overstuffed codebase.

Extending beyond Drupal

Decoupling Drupal with React

As an agency, Mediacurrent has grown from our roots as a leader in Drupal development, strategy, and design to become an open-source expansion partner for our customers. Since launching The Weather Channel on a progressively decoupled platform in 2013, our development approach at Mediacurrent has gravitated toward decoupled, with a recent, increased focus on React.

When you decouple, you have the opportunity to choose the best tool for individual technical requirements. As we consider the state of Drupal and its place in the landscape of the modern technology stack, we predict Drupal will maintain its foothold in the enterprise when paired with a flexible Javascript frontend. React (and Javascript) are on the rise. Extending a content-modeling tool like Drupal with a best-in-class, front-end framework like ReactJS is a powerful way to achieve a web service-oriented approach. React’s widening talent pool offers a large community of developers to support your application.

Drupal Rain and GatsbyJS

Our search for the best decoupled Drupal approach for Mediacurrent.com led us to Gatsby, a React-based framework. Combined, Drupal and Gatsby form a fully open-source, enterprise-grade system. We pair Gatsby with Rain, a Drupal install profile focused on enterprise use cases, for a speedy end-to-end solution. This approach has helped many of our customers expand on open-source software—balancing flexibility and scalability to create a future-proof platform.

“Using Drupal with Gatsby is a great way to get an enterprise-quality CMS for free, paired with a great modern development experience and all the benefits of the JAMstack, like performance, scalability, and security.”

Gatsbyjs.org

  • Rain Install Profile for Drupal. On the backend, Drupal 8 provides a powerful capacity for content modeling.
  • GatsbyJS. Gatsby, the presentation layer, adds a robust dimension of UI flexibility and performance capabilities. (See this tutorial for a guide on how to get set up with Rain and connect to our Gatsby starter.)
  • Platform.sh. Well-suited for this approach, Platform.sh can host a range of technologies, including Drupal and static-based applications like Gatsby.

Enhancing open-source security

Together, Drupal and Gatsby provide a robust security architecture. A fully decoupled setup allows the option to protect Drupal’s CMS with a wall-off environment that only a VPN or private network can access. As a statically generated frontend, Gatsby exposes fewer services and pieces of back-end code or databases that could be compromised.

With a Gatsby site, you can sidestep public-facing servers and the security challenges that come with them. This approach can also improve your resilience to DDoS attacks.

Flexibility through reusable components

As a means to future-proofing and flexibility, we created Mediacurrent’s Rain + Gatsby integration to expedite design with reusable components, providing a consistent, intuitive user experience.

Gatsby doesn’t require expensive hardware to run, which lowers overall hosting costs. It’s fast, too—really fast. Gatsby has delivered gains of 3-10 times speed improvement for migrated sites.

Scalability

Mega-trafficked websites like The Weather Channel have proven that a well-optimized Drupal platform can scale to serve millions of users. A Gatsby site can handle higher volumes of traffic per unit of hardware than a traditional CMS because it uses so few server resources to serve pages.

When it comes to scaling content volume, Gatsby Cloud is improving the framework to handle huge amounts of media assets through optimizations and parallel processing.

Next-level Drupal: finding tech that fits the challenge

Drupal remains a powerful tool for managing content, but it shines brightest when paired with a leading, front-end framework like React. The Rain installation profile for Drupal is open source (and if combined with Gatsby, that’s open source, too) so it’s free for everyone to get started.

Decoupled isn’t always a fit, but when it is, consider Drupal and Gatsby to get the speed, security, and adaptability features you need for what’s next in the world of open source.

Tara Arnold is a Senior Marketing Content Strategist at Mediacurrent, the open-source expansion and Platform.sh agency partner.