Is Gatsby a CMS?

No, Gatsby is not a CMS. It’s a JavaScript framework for building websites and user interfaces. A Gatsby website needs to be paired with a CMS otherwise any content changes will need to be made through code.

Most of our clients have experience with WordPress so they equate building a new website to having a system that allows them to edit content, add images and create new posts. This isn’t really how a plain website works, though.

Websites are a collection of code your browser interprets and displays nice fonts, images, links and interactive functionality. Maintaining these assets is time-consuming without a good “system” for managing all the content (thus the name “content management system”).

Gatsby cuts out the middle-man and removes the CMS. To simplify its purpose, it’s a way of writing structured code for building websites. Instead of writing HTML, CSS and JavaScript in their raw forms, Gatsby provides a kind of template for speeding up the code writing process.

To clarify, Gatsby doesn’t have a graphical user interface. There’s no way to log into it. Unless you're a developer, you’re probably not going to interact with Gatsby.

Integrating Gatsby with a CMS

The Gatsby development team and their partners have put a mountain of effort into building plugins for connecting with various content management systems. Remember that Gatbsy doesn’t have a graphical UI, so plugins are configured within Gatsby’s codebase. However, they’re just a couple of lines of code and do most of the heavy lifting in connecting to a new CMS.

Over the past five years, a swarm of new headless content management systems have arrived on the market. Here are the most popular names on the market:

• Contentful
• Ghost
• Sanity
• Strapi
• Tina
• Prismic
• Netlify CMS
• Forestry
• Headless WordPress

Browsing through this list, you might be wondering what “headless” means. I won’t go into detail because I’ve gone into depth on this topic in my article, covering everything you need to know about headless eCommerce.

To get your headless content management system connected with Gatsby, you’ll first need to sign up for an account and potentially a paid membership. Most modern CMS’s have a free-tier for small businesses but can get quite expensive to unlock all their features (especially Contentful).

Once you’ve signed up, you or your developer needs to configure Gatsby with the CMS plugin. Depending on the content across your site you want to be able to modify, there can be a fair bit of development work required at this point.

The Clean Commit team has built dozens of Gatsby websites over the past few years. On average, a new 15 - 20 page website will take around 100 to 150 hours of development effort to build and integrate with a CMS.

Do I need a CMS for Gatsby?

If you’re a developer and don’t mind writing posts in markdown, then you don’t need a CMS for Gatsby. However, having a CMS for Gatsby will make life easier in most cases.

I find writing posts in a nice content management system a lot easier for a couple of reasons. Firstly, grabbing images from your local device storage without having to write a path to the file is quicker and easier. Secondly, it’s nice to see how the content will look when laid out on the page instead of being contained in an integrated development environment.

Developers may argue this point. If you’re used to writing code all day, then you probably love the opportunity to write posts in markdown. For the other 99.9999% of the population, this way of managing a website is tedious.

Not to mention, if changes are required to any page across the site, they’ll need to be made directly in the codebase. For instance, changing an image on your site’s homepage requires changing the image path, rebuilding and redeploying your site.

How do I use Gatsby on WordPress?

To use Gatsby on WordPress, the two systems need to be integrated with three plugins. For WordPress; WPGatsby, WPGraphQL and for Gatsby, the WordPress plugin. However, Gatsby is not a plugin or theme to be installed into WordPress.

The best way to think about the relationship between Gatsby and WordPress is that Gatsby contains all the rules for how the user interface will display, while WordPress provides the tools for making easy content changes.

Traditionally, WordPress would do both of these things. The way visitors see the website is controlled by a theme that drives the HTML, CSS and JavaScript.

When you introduce Gatsby, WordPress forfeits control over how the user interface looks. The customer-facing part of the WordPress theme is replaced by Gatsby.

Unlike WordPress, with Gatsby there’s no way to use a drag-and-drop builder (i.e. Divi or Elementor) to build new pages. All visual changes on the site now need to be made through code.

This is an important consideration if you’re thinking about adding Gatsby into your existing website. This kind of change needs to involve a technical team to guide you through the process. More often than not, it makes sense to completely rebuild the look and feel of a website when introducing Gatsby into the architecture. We go into more detail in our article all about WordPress vs Gatsby.

What is the Gatsby Theme?

Gatsby is not a WordPress theme, it’s a coding framework for building websites. WordPress and Gatsby can work together, but it requires custom development.

Gatsby does have themes. They’re a quick way of packaging up the configuration and features of an existing Gatsby project to share. They’re also called “starters” because they lay some of the groundwork for a new website but require additional customisation before the site can be considered complete.

Our team has created a tidy Gatsby starter called Henlo. It’s open source and completely free. If you’re a developer, feel free to grab a copy.

Did you like this article? Find out more on our blog

Have other Gatsby questions?

This concludes the article on common Gatsby questions. Since our team builds a lot of frontends with Gatsby, we wanted to address some of the tricky questions our clients put to us. For more information, you can read our article on The Pros and Cons of Using Gatsby.

Understanding what Gatsby is and how it differs from WordPress is tricky to anyone who hasn’t already got a firm grip of computer science and internet technologies. We’re trying to break down these barriers and simplify the concepts so you can make better business decisions for your website architecture.

If you have another Gatsby question, add it in the comments section below, and we’ll get back to you in a day or so.