DEV Community 👩‍💻👨‍💻

Cover image for Choosing an Open Source Headless CMS
Christopher Kapic
Christopher Kapic

Posted on • Originally published at christopherkapic.com

Choosing an Open Source Headless CMS

What is a CMS?

Traditionally, a CMS and a website are hosted on the same server. Wordpress, for example, is a CMS and website combination in which the admin can log into the CMS to get editing privileges directly on the site. More recently, there has been the JAMstack trend, part of which is the introduction and proliferation of the headless CMS.

What does it mean to be headless?

The webserver and the CMS are hosted separately.

Instead of hosting the website and the CMS on the same server, the site and CMS are separated. This has several pros and cons.

We'll start with the cons first.

What are the cons?

  • Using a headless CMS requires a higher level of technical competence to get going. There are many competitive services which offer Wordpress hosting that require little technical savviness, but in choosing a headless CMS one necessarily must know how to host two servers, or outsource the CMS to a SaaS.
  • Often, more custom development is required; you must know how to connect your site to your CMS.

What are the pros?

  • If your CMS goes down, your site can still keep working. With options like 11ty, Astro, NextJS, and more for static site generation, your CMS only needs to run at build time. This gives you a lot more reliability, especially as modern serverless hosting options become more robust.
  • There are far more options for site customization - you have the freedom to connect any framework to any CMS. For sites that require custom development, this freedom can be essential.
  • Hosting options are more compelling when you enter the JAMstack world. Instead of a traditional webserver setup, using tools like Netlify, Vercel, CockroachDB, Planetscale, any of the myriad of frontend frameworks, and more can allow you to create an incredible and unique experience to your customers.

How do I know which CMS to choose?

Choose a CMS diagram (explained in article)

Ultimately, there are more options to consider than those which I can cover here. For a more comprehensive breakdown, I recommend that you check out JAMstack.org's comparison.

That being said, if open-source is important to you, be it for privacy or avoiding vendor lock-in, my three favorites are Directus (I am a contributor), KeystoneJS, and NetlifyCMS (not technically a headless CMS, but still worth considering).

Directus

Directus is... really cool. It can connect with your currently-existing database, provides a GraphQL API, is extensible, can be hosted in a serverless environment (Google Cloud Run), and is a pleasure to use.

KeystoneJS

Keystone is in many ways similar to Directus, except it uses a more developer-first approach to the database schema. You write a file that compiles into a Prisma configuration. This is nice in theory, but it makes using the same database as your currently-existing database more difficult. However, that may not be a problem since the idea of a headless CMS is to divorce the CMS from the website infrastructure anyway. Like Directus, it too can be hosted in a serverless environment (even Netlify).

NetlifyCMS

Of this group, NetlifyCMS is certainly the oddball. Instead of connecting to a database and potentially a storage bucket, NetlifyCMS connects with your git repository. Using a service like Netlify, a new build of your site is created every time a piece of content is updated. For something like a blog, where content is read far more than it is updated, and the content is updated only by admin users, NetlifyCMS is a good choice. The best part about NetlifyCMS is that it can easily be used for site templates. Most starter sites I create use NetlifyCMS because users can simply deploy to Netlify and call it good.

NetlifyCMS is not good for websites with content that must be updated by regular users (comments should not be handled by NetlifyCMS, for example).

How to choose?

Essentially, I argue the best simplification for how to choose is this:

  1. Do non-admin users update any "server-side" state in your site? If not, go with NetlifyCMS.
  2. Do you want to connect to your existing database? If so, go with Directus.
  3. If neither of the above apply, choose between Directus and KeystoneJS. You'll probably want Directus, but there may be edge cases in which Keystone is better (or, you might just have a preference for whatever reason).

Ultimately, there are many options for your choice of CMS, and the right one might not be here. This is just a framework I have decided upon after doing lots of research for my own projects and learning which CMS options work best for most of my needs.

Top comments (2)

Collapse
 
endymion1818 profile image
Ben Read

Be careful with NetlifyCMS, it's not in active development, and there doesn't seem to be any appetite to pick it up currently. There are a few outstanding issues and deprecated dependencies too, so I'd advise caution.

One CMS that didn't make this list and which I genuinely love is Webiny. It's a serverless headless CMS, meaning you don't run it in a container or VM, instead it uses services from AWS like Lambda, DynamoDB and other services efficiently. That means it automatically sleeps when not in use, making it very cost effective. It's very customisable too.

Collapse
 
christopherkapic profile image
Christopher Kapic

Huh, I hadn't seen Webiny before. Thank you for bringing it to my attention. I still think NetlifyCMS is good for making templates, since it has only a small level of extra work to get set up. But, that would be for simple blog templates, etc.

DEV

Thank you.

 
Thanks for visiting DEV, we’ve worked really hard to cultivate this great community and would love to have you join us. If you’d like to create an account, you can sign up here.