Why is headless CMS the future of web development? Comparison of Headless CMS systems

The growing number of headless CMS systems encouraged me to dive into the topic and present my experience in CMS systems for web and mobile development. Before we go through all the pros and cons of this approach to managing content, it’s a good idea to explain what headless CMS is.

What is the headless CMS?

A lot of customers are electrified by the “headless CMS” buzzword. I didn’t find the phrase origin but the meaning can get across very easily. The old well-known CMS systems (AKA coupled CMS) consist of two main layers: the admin panel – where an editor can add some content and the UI part that displays the content of the website. According to Wikipedia, the term “headless” comes from chopping the head off the body. In this context “head” is a frontend part of the app and the “body” is a backend part. So headless CMS is a system that contains only the backend part. There is no graphical interface that represents the content entered by an editor to the admin panel.

Headless CMS doesn’t have a graphical interface

Now you are probably thinking: why the heck do I need a CMS that cannot display any information to the user? At first glance, a headless Content Management System looks like an unfinished project. Actually, it’s not. This new (old) approach to the CMS lets us resolve one issue that occurs frequently. What if I want to build my back-end and front-end sides of the app in different technologies? Now it’s possible. You can grab your favorite frontend framework and just consume the content from the headless CMS API.

Why is WordPress not always the best choice for my website?

First of all, WordPress CMS is a great Content Management System. Both huge companies and small businesses decide to use this solution. The number of plugins and the project’s maturity make it the first choice in case of choosing a platform for a wide variety of the company’s websites. Dozens of available themes and optimization for SEO are the most important factors why WordPress is chosen as a solution for landing pages and blogs. Definitely, it’s a fantastic tool from the editor’s perspective.

On the other hand, WordPress is a vast CMS not only from the editor’s perspective but also from the development team. Do you really need all these features on your simple landing page? What if you want to use different technologies on the front-end side? WordPress is a monolith project. As I said earlier, the backend and front-end sides are strictly coupled. There are a bunch of cases where a monolith architecture is not the best choice. Let’s imagine that you want to implement a landing page for the app. Your app is written in React but you also need an editable landing page. So if you are going to use WordPress, you need to move your branding to totally different technology and write all your components once again. Additionally, every time you change something in the app’s header or footer, you probably need to do the same on the landing page because you want to be consistent across the whole app. There are probably a number of workarounds that help you omit the above problems but do you really need a workaround? What about using headless CMS in such scenarios?

What are the pros and cons?

Pros

• Flexibility in front-end technology – there are many remarkable UI frameworks on the market. If you want to create a front-end part of your product using React or any other framework you can just do it.
  
  
• Build a website using technology you are familiar with – most companies define their core (canonical) technologies. If you feel that you are an expert in Angular or Svelte you can use these frameworks.
  
  
• Support multiple API types – most headless CMS systems support REST as a software architecture style but there are a couple of them that also support GraphQL.
  
  
• Admin panel – some headless CMS systems e.g. Strapi is an excellent solution for managing data. You can create tables and add relationships between them directly from the admin panel.
  
  
• Great choice in case of a simple project – headless CMS is a right solution for not complicated projects. Especially when you just need to use CRUD operations.
  
  
• Consistent UI across different parts of your app – if you are working in e.g. micro frontend architecture and you want to be consistent between various components of your whole app, you should take a look at headless Content Management Systems.
  
  
• Increase data protection – decoupling of the backend and frontend part of your app can improve security.
  
  
• Support multiple platforms – you can create an API using headless CMS and consume data even using native mobile applications.

Cons

• Require technical knowledge – if you want to go into headless CMS direction you need a dedicated team that helps you build a fronted part of your app.
  
  
• Lack of preview – headless CMS doesn’t support preview. The reason is quite simple – a separate app is responsible for displaying data.
  
  
• Higher costs – at the beginning of the project decoupling of the back-end and front-end parts generate additional costs.

Which solution should I choose?

Suppose you want to choose the best solution for your business. You need to consider a couple of things. First of all, do you want to host your system on your server (Strapi, Ghost), or do you want to use a cloud solution (Contentful, Sanity)? What functionalities are you looking for? Do you want headless CMS to create posts on your blog, or need a more advanced system to store data in relations? How do you want to return data to your frontend app? Do you want to use REST or GraphQL? Below you can find a quick overview of the most popular solutions.

Strapi

Strapi is a self-hosted, database agnostic, open-source headless Content Management System. This CMS supports both SQL and NoSQL databases (PostgreSQL, MySQL, MariaDB, SQLite, MongoDB). The Admin panel looks like a customized DB client. You can create tables, add relations, and adjust responses to your needs. It’s a great choice if your application requires mostly CRUD operations.

Ghost

Ghost is a modern publishing platform. It’s the right choice for news apps or blogs and the post entity is the primary data type. You can create drafts/ schedule your publications and even inject custom code to your site’s header and footer directly from the admin panel. The ghost text editor supports Markdown. There is an option to embed cards from e.g. YouTube or Spotify but also create custom HTML elements. You can organize your content using tags. The platform automatically generates RSS feeds for collections, tags, and authors’ archives. A lot of SEO aspects have been implemented directly into the core – usually, there is no need to use external plugins. You can add an alt attribute to images and link tags to the RSS feed. Additionally, there is an option to customize metadata separately for every post.

Contentful

Contentful support real-time team collaboration. The text editor has a feature called “Rich Text Commands” – it lets you quickly embed entries using a command panel without leaving the editor context (you just need to type “/”). All your content is served via JSON API. Contentful supports versioning – there is a way to revert content to the previous version.

Is it the right for my company?

In my opinion, headless Content Management Systems are the future of web development. The popularity of omnichannel solutions changed the way we have to think about content management. Coupled CMS systems like WordPress are no longer the best choice if you want to use the same backend for both web and native mobile apps. When it comes to making a decision, you should ask yourself: Do I need to create my digital product for web and (native) mobile? How often would I need to change my website? Am I going to reuse the data in other products? Do I need a complex CMS system?

I fully realize that the choice is difficult. The best approach would be to ask a partner with technical expertise to support you in making such a dissection. We are always happy to help you!