Top 5 headless CMS and their pros and cons (Gatsby JS edition)
Published: 2021-02-05 08:25:42

**This post was first published on my [blog](https://blog.larsbehrenberg.com).*

One of the reasons why Gatsby JS has been so popular over the years is its vast plugin library that makes it almost as easy as drag-and-drop to add new functionality to your app. 

Because of that, Gatsby has managed to make adding a headless CMS a straightforward and often very simple process that many other Static Site Generators (SSG) can only be astonished by.

In this post, I wanna go my top 5 headless CMS that I have used with Gatsby JS in the past and their pros and cons. **Let's get started!**

## Table Of Contents

- [Contentful](#contentful)
- [Wordpress](#wordpress)
- [Prismic](#prismic)
- [Netlify CMS](#netlify-cms)
- [Strapi](#strapi)

## [Contentful](https://www.contentful.com/)

We start with [Contentful](https://www.contentful.com/). Probably being one of the biggest players in the headless CMS market, Contentful gets also introduced first in the official Gatsby docs for "[sourcing data into Gatsby](https://www.gatsbyjs.com/docs/how-to/sourcing-data/sourcing-from-contentful/)". 

It provides a user-friendly interface and organized, flexible data models with support for a variety of data types and content editors (e.g. WYSIWYGs, form fields, raw text areas).

### Pros:

- Available free tier that allows you to use it with 1 website using 2 locales, 48 content types and 2 user roles (admin & editor)
- Easy to set up
- Work with up to 5 users on a team on the free tier
- Great built-in versioning features with history and draft states
- Intuitive user interface

### Cons:

- Step from free to tier to paid is very expensive (US$489/month)
- Asset size max. 50MB
- Just 1 site on the free tier

## [WordPress](https://wordpress.org/)

Just recently Hosting Tribunal put out [a new article on WordPress](https://hostingtribunal.com/blog/wordpress-statistics/#gref)'s latest statistics stating this:

> WordPress powers 39.6% of the internet in 2021, a growth of nearly 5% from 35% in 2020, and a 4% rise from the year before.
- HostingTribunal.com

But many people don't know that you could also use [WordPress](https://wordpress.org/) as their headless CMS. Just the way you are used, but with Gatsby or other Static Site Generators (SSG) as the front-end.

Made possible by the free and open-source [WPGraphQL plugin](https://www.wpgraphql.com/).

### Pros:

- Extensive documentation on the WordPress GraphQL plugin
- Many users are already familiar with the WordPress interface (usability+)
- Unlimited assets, users & content types

### Cons:

- More tedious/difficult to set up than most headless CMS
- WordPress needs to be hosted (not free)

## [Prismic](https://prismic.io/)

[Prismic](https://prismic.io/) is my headless CMS of choice for my [personal website](https://larsbehrenberg.com) as the content management process for different languages works really well. 

The setup is a little tricky, but once you are through that the developing experience is very straightforward and easy. The extensive free tier is something I haven't been able to find anywhere else and for personal projects as a developer, I can recommend it. 

However, as soon as you would like to have people to access content without admin access, Prismic's price-point at 100$/month rules itself unfortunately out.

### Pros:

- Very extensive free tier with unlimited API Calls, Documents, Custom Types, Locales, Assets, Image Optimizations & 100 GB of Built-in CDN
- Very affordable plans for small teams (Starter Plan $7/month & Small Plan $15/month)
- Live Previews for content changes (with Gatsby currently not very stable, use NextJS instead)

### Cons:

- Setup is not very straightforward with two different plugins gatsby-source-prismic-graphql & gatsby-source-prismic
- User roles are only available on plans for "organizations" starting at  $100/month, which makes Prismic unusable for small developers with individual clients.

## [Netlify CMS](https://www.netlifycms.org/)

[Netlify CMS](https://www.netlifycms.org/) has been together with Prismic one of my go-to-solutions when setting up a headless CMS. It's more configurable than other headless Markdown CMS like [Forestry](https://forestry.io/) and has a community with the Netlify forum that's quick to help if you run into any problems.

### Pros:

- Easy to set up with several starter/templates available
- If properly set up, enjoy live previews within the CMS
- Open-source with no paid plans (free only)
- CMS lives right within your website and reads data from your Github repo markdown files

### Cons:

- Although managed separately from Netlify the hosting service, Netlify CMS is difficult to set up on any other host than Netlify
- Not as versatile for users as other headless CMS
- i18n (Localization) is possible but not user or developer to set up

## [Strapi](https://strapi.io/)

[Strapi](https://strapi.io/) has been gaining a lot of traction recently and is becoming a popular solution as headless CMS. Providing an easy to configure Rest or GraphQL endpoint it can be virtually plugged in into any framework without a lot of trouble.

Together with its plugin library and the ability to also manage file storage as well as email for you, makes Strapi definitely worth checking out!

### Pros:

- Easy installation and ability to use rest and graphql
- Extensive free tier (3 default roles etc.)
- Plugin library to extend Strapi

### Cons:

- i18n (Localization) features are still not fully there yet
- Hosting generally costs (if not hosted on free Heroku bucket)

## That’s pretty much it!

Thanks so much for reading this far and feel free to reach out to me anytime, on [my website](https://larsbehrenberg.com/) or [Twitter](https://twitter.com/codetraveling) 🙂  And if you like to read more, make sure to check out my other posts on my [blog](https://blog.larsbehrenberg.com)!