What's a headless CMS? That sounds scary, Rian.

Rian Schmidt

January 16, 2022

Shhh... it's OK.

What's a CMS?

Let's start at the beginning. A CMS is a Content Management System. You use it to, well, manage your content. OK, let me back up.

Back in the day, if you wanted to present your blog, let's say, you'd write some HTML. You'd create a page for each article, and you'd link to your article by hand. If you added another article, you'd go into your HTML, edit your list, and add your new link. But then... red, which was cool at first, became uncool, and we all decided stuff should be blue, and so we all had to open up all those files we just created and edit every one to remove all the angry red stuff and make it nice, calming, trustworthy blue. It took forever.

Then, at some point, some genius decided we should put all the "content"-- the actual article and title and whatnot-- into an XML file, which is basically just as bad as HTML, only worse, and then process it through a "template" made out of XSLT, which is like... HTML, also, but also Javascript kinda, but neither. And this idea was terrible.

BUT! The good part was the separating out the content idea. If we could just store that stuff in a database somewhere and then stuff it into a template made out of something less terrible, we'd be onto something! Enter the modern CMS.

Wordpress

So, bad ideas abounded for a while (and I tried them all). But eventually, in about 2003, Wordpress was released. It combined the hacky, anyone-can-contribute nature of the programming language, PHP, with the basic needs of most blog users and hit the sweetspot for freeness, ease-of-use, and CONTENT MANAGEMENT.

Wordpress is a server-side CMS that allows users to add plugins to do various tasks like SEO and search for them. Other plugins provide template editing capability that, in theory, makes learning HTML unnecessary. It competed with other CMSs that cost millions of dollars and required a whole staff to manage. If you need something special, wait a minute, and someone will cook up a plugin for it.

Still, today, Wordpress is the most popular CMS in the world. By a long shot. You go into the admin panel, there's a list of pages, you type in your stuff, apply a template, and bingo! You've got a blog!

So Why Not Wordpress?

I have no intention of kicking Wordpress. It's great for what it does. It makes content management accessible. It's free(ish). Millions of sites run Wordpress and will for the foreseeable future. Buuuuuut...

Anyone who's managed Wordpress knows that it can be a mess. Required upgrades tied to upgrades that can't be installed because they'll break something else. Security issues. All those plugins have a nasty habit of not playing well together. If a template builder gets screwed up, it's easy to find yourself trying to untangle something that you installed to actually make your life easier.

Suffice to say, it's a "pay me now or pay me later" situation. I get a lot of work digging people out of their Wordpress rubble.

And then there's the coupling. With Wordpress, everything operates inside of it. It deals with the database. It generates and serves the pages. All via a templating system that, and I mean no disrespect, is an absolute mess.

Enter the Headless CMS

Wouldn't it be great if you had a thing that just managed your content for you and provided some nice way to get it in and out, and then you could present it however you liked? All using nice standard interfaces? What if you decided Angular wasn't cool and React <backspace, backspace...> Svelte was the cool new UI library. You don't want to have to start over from scratch.

That's what the headless CMS does. With a headless CMS-- I tend to use Strapi these days-- you can enter in your content. Define collections of data. Create repeatable little snippets of data that live inside larger one-off "pages" of content. All of which is completely independent of how you present that stuff.

Then, you build yourself your shiny new React (or whatever) site, and just ask Strapi for the content to fill in the page. If you use GraphQL (more on that in another post), you can usually do a single query and get everything you need to populate your template. Need a new page? Just add it in Strapi, and your application will update with a new page. Decide red is cool again? Great, change it in your React site's theme, and red is the new blue.

Best of all, if you decide that you need to make a mobile site, you just build it out of whatever technology you like, and ask the CMS for your content.

Why Not Just Use a Database?

Well, that's an excellent question, astute reader. The database is still there. Behind the scenes.

The main difference is that the CMS handles a lot of the wiring between the database and your content. If you want to add a field to a collection of items, say authors get a phone number, you just log into your CMS, and there's a nice user interface to allow you to do that without having to write any code. Add a field, change a data type, make something required... all just a click away in the CMS.

It also provides the API layer for you. If you use a database, you're on the hook to come up with a layer that your app can talk to. Something that handles the GraphQL, authentication, validation, generation of fields like blog slugs, etc. Strapi, as an example, handles most of that and makes adding the rest much easier than having to create it from scratch.

Takeaways

A headless CMS is a "middle" layer that allows you to deal with your content in a logical way with a UI for managing the structure. It's decoupled from the presentation of that information, but it's also decoupled from the actual database-- at least in terms of your needing to deal with it directly.

That decoupling allows you to utilize your information in whatever way you like-- from changing your web site to creating a mobile app.

It provides a raft of utilities for authentication, validation, API integrations, and more. That saves you time and isolates those "logical" responsibilities from the user interface design.

In short, it's a great way to build your web site or application that allows you to delegate content tasks to content developers, design tasks to designers, and logical (backend) tasks to engineers. It gives you greater freedom in how your present your content and adds more efficiency to the whole process.

The Pitch You Knew Was Coming

Circinaut builds web sites and applications, mostly for small to mid-sized businesses. We often use headless CMS technology and train our clients how to manage as much of the process themselves as we can. If you're finding your site or web application has gotten out of hand, needs a serious update, or you just want to talk about how I can help, drop me a line.