Skip to content
Andrew Fairlie

What is Gatsby JS?

Note: This article was last updated on October 1, 2019 and may contain outdated information.

Gatsby serves as “a platform to build websites” that decouples visual presentation from content management systems. The framework enables developers to aggregate content from multiple sources—what its creators call “the content mesh”—allowing unified data from CMSs, Shopify, and social platforms to work seamlessly together.

Cloud-First Architecture

Rather than relying on monolithic CMS functionality, Gatsby typically leverages specialized cloud services. Developers can implement dedicated solutions like Algolia for search and Shopify for eCommerce, similar to using Google Analytics. While this approach offers best-in-class tools, it requires careful consideration of potential costs from service tier pricing.

React Foundation

Gatsby functions as a React framework with added scaffolding, development environments, and performance optimizations. Any capability available in React remains accessible within Gatsby, providing developers with extensive flexibility.

Static Generation with Dynamic Capability

Gatsby generates optimized static pages deployable on AWS, Google Cloud, or Netlify—often achieving 100% Google Lighthouse scores. Upon user loading, pages “rehydrate” into interactive React applications, enabling both fully dynamic and hybrid static-dynamic functionality, distinguishing it from traditional static site generators like Hugo or Jekyll.

Limitations and Solutions

Build times present a challenge for large websites, delaying content preview and publication. Gatsby’s commercial offerings address this through:

  • Gatsby Preview: Real-time editing visibility across compatible CMSs
  • Gatsby Build: Cloud-based fast builds with incremental rebuild capabilities

Learn More: Visit the official Gatsby website