Different Types of Headless CMS
Table of Content
A headless CMS (Content Management System) separates content from the presentation layer. It connects content to frontend and retrieves and renders according to needs. This method is increasingly popular, as it gives developers freedom to build frontends with technology of their choice.
Which Headless CMS to choose?
Many headless CMS options are available today, and not all of There are many headless CMs options available today, but not all of them have the same structure. While some CMS’ use APIs to pull data, others come from Github. Some are self-hosted, and others are hosted by third-party cloud services.
If all of this doesn’t make quite sense, don’t worry! We’ll describe main types of headless CMS, with examples for each.
Self-hosted, open-source CMS
WordPress is more famous for its non-headless version, but Headless WordPress uses the same dashboard as the regular. There are plugins, like Custom Post Type UI, or Advanced Custom Fields, to extend data types able to be stored. A thing to notice is that, since backend is disconnected from presentation, the majority of WordPress plugins are not useful. In a headless setup scenario, WordPress acts only as a database and content manager.
You have two ways to connect a headless WordPress site: a REST API and WPGraphQL‘s plugin. GraphQL is an easier way to make data queries, as it only calls for exact needed data. At the time of uploading this post, the plugin is still under development. You may want to check its current status to see if the newest version is available.
A Git-based CMS is the most developer-centric option. This type of CMS connects to the Git repository when you store a site’s code. While the platform provides an admin panel, to create content, the content itself lays on the repository. There’s no external database: the content is directly in a folder in the codebase.
Netlify is a popular static website hosting platform that also offers an open-source CMS. This CMS has a familiar dashboard to edit content, that any non-technical person can use. Behind the scenes, the admin panel is a React app, assisting the Git workflow. When a team member posts content, the changes go directly to Github. Its out-of-the-box admin options are easy and good for blogging purposes.
To add an option to the content model, put the corresponding line of code to the config.yml file. It’s also possible to make further customizations, since the admin code is open-source. For developers, installation and basic configuration are simple. The content stores as markdown files, an easy file type to process in the frontend code.
PaaS (Platform as a Service)
A PaaS is a third-party service that hosts content in the cloud. These platforms charge a fee depending on the plan you’re signing up for. Some of them have a free tier, allowing you to change plans once the site gets more traffic. Begin a paid service, a PaaS often will have a fancy dashboard, and wide content modeling possibilities. They’re a tempting choice, especially when having free tier at the beginning.
Even if you start free, companies could change their pricing or usage, forcing you to switch to a higher plan. However, it’s important to note that they’re also the safest option. Often, a PaaS has plugins and a starter site, available for static-site generators, like Gatsby. This will make connection to the service quicker and easier. For other types of sites, developers have to dive into documentation to understand how to work with the PaaS’ API. Make sure that this process isn’t overly complicated, and has strong documentation and customer support.
Sanity is a third-party service, with a fully extendable content platform, and an attractive editor interface. In the beginning, some developer setup will be required. But, once it implements, any member can login and add content. Since it’s on the cloud, there’s no need for server setups or maintenance. Also, additions and changes are immediately synched with the cloud.
This SaaS is a React app, and its install needs to be in a local environment via NPM. You can choose a template (blog, eCommerce, etc.) and then customize it. The content modeling handles with JS objects. So, in order to make adjustments, you’ll only need to add or subtract lines of code.
It has its own query language, GROQ. It’s similar to GraphQL, but it requires some documentation reading to learn about it. On the other hand, it comes with an IDE plugin that makes writing queries easier. Sanity has a free tier, with a pay-as-you-go structure, if you go over the monthly usage limits.
Any of these can work with the right amount of development time. However, some of them fit better for certain usages. The simplicity of a Git-bases option is perfect for blogging. By contrast, large teams and sites with complex data types may benefit more from a PaaS offer. Last but not least, projects that want fixed content costs, may be more comfortable with an open-source option. When knowing what’s your case, and understanding what each CMS offers, it’s easy to find the right one.