In most modern web application or web page setups, there is an increasing trend in managing vast amount of growing and complicated content. Mostly centralized in web-based infrastructures, the heavy usage of real-time updates are handled by a CMS or similar service.
Aside from that, most modern web apps can usually include a.i. features such as a chatbot or an a.i. assisted search to add better user experience in the overall website design.
As data structures complexity of a website grows and demands for a.i. features are becoming more popular, it is noticed that most developers will utilize a graph-based Api alongside a headless CMS to speed-up the flexibility and maintainability of their content.
Sometimes this also helps in adding a.i. features in their websites with minimal hassle and long-term changes.
So, in web application building most web developers might prefer to:
- Have all content easily managed and flexibly centralized via a headless CMS.
- Have a graph DB backend for easily exposing standard functionality such as login and registration and also extended features that require graph-based capabilities to integrate with such as, a.i. applications or external a.i. service calls.
For the reasons stated above, here are the top 8 options that -in my opinion- gain the most interest while setting up a headless CMS with self-hosting options for a portfolio site:
Note: There are many different Headless CMS options online, but I will only be focusing on the ones that support self-hosting and simplify deployments for the average developer when setting up a website, but also offer the necessary complexity when you require something more advanced.
1. Strapi
One popular headless CMS for Node.js /React or most javascript-based web apps is strapi. It includes seamless admin panel integration with Gatsbyjs headless self-hosted plan and 1-click deployment to get you started easily to sync changes from gatsbyjs webapp to strapi.
Also, supports direct cloud-to-local deployment via CLI or docker deployment (direct local machine node.js install or docker). These are the two main deployment options stated on the official website.
Another plus for self-hosting is the low-grade hardware required to run strapi on. This is provided on their official documentation and shown below:
| Hardware | Recommended | Minimum |
|---|---|---|
| CPU | 2+ cores | 1 core |
| Memory | 4GB+ | 2GB |
| Disk | 32GB+ | 8GB |
Minimum local H/W allow it to run even in a Raspberry Pi v2 Linux environment which is also nice.
Links
Source 1
Source 2
Source 3
2. TinaCMS
Another popular option for self-hosting customizable CMS is TinaCMS. It allows a fully Node.js compliant backend with separated build and configurations for GraphQL data layer handling. Can be easily deployed with 1-click on VercelApp, Netlify or any other external serverless environment by using a Next.js preset app for this specific purpose.
Overall, it has some limitations and does not include a docker container option officially.
A good plus is the 'local mode' vs 'production mode' just in case you need to switch your content locally on your machine for local development. Note that: Your entire codebase will still be required to be on github for self-hosting which is fully interactable with everything supported by TinaCMS.
3. PayloadCMS
In a similar concept, Payload CMS is another good option for e-commerce that has a very decent UX as it comes to the CMS front-end.
It allows for a vast amount of configuration and UI changes via its WordPress-like front-end. In addition to that, it supports extra built-in features such as:
- Fine-grained access controls for standardized user accounts.
- Authentication methods such as pre-login, post-login registration scenarios, JWT and mainly everything that is required by a standard e-commerce grade site.
- Out-of-the-box CSRF and HTTP-Only cookie headers protection.
- Web app templates for ready made solutions supporting MongoDB, PostgreSQL with relevant data adapters.
- Built-in Mime/type and localized file upload support that also includes relevant access controls for all types of files. Extended behavior is achieved with additional storage adapters for remote uploads that interact with Google GCP, AWS S3, Vercel Blob Storage or MS Azure Blob Storage.
The main upside is that your code can be self-hosted in any sort of NodeJS environment and also supports serverless Vercel deployment when ported as a Next.js webapp that is currently supported.
Links
Source 1
Source 2
Source 3
4. BudiBase
In terms of flexibility of deployment, budibase may also be a good cms alternative.
Even though not the most intuitive CMS front-end and not as scalable, it includes many other interesting features such as:
- Multi-database direct support. Currently supporting csv files, PostgreSQL, FireBase, MongoDB, mariaDB and MS SQL Server as directly targeted data source.
- Workflow automation by direct integration with various services such as Slack, Jira, Stripe, Discord for mass CMS-relevant operational notifications and other tasks.
- Multiple self-hosting deployment options such as docker, kubernetes, docker-compose, Ansible, DigitalOcean (cloud VPS), Linode (cloud VPS) and many others. Instructions also include a prebuilt ARM docker template for Azure deployment.
Another feature of budibase CMS is its highly detailed documentation for its also equally complicated self-hosting set of instructions to follow for most cases.
It also includes an interactive API-documentation in its website to be able to view the actual Api calls and respective responses which is cool.
Nonetheless, its highly detailed documentation and real-time Api online playground make it a great all-around option for most web developers.
Links
Source 1
Source 2
Source 3
5. Directus
The directus option is probably the fastest in terms of deployment (90 seconds or less for cloud deployment) but with more limited self-hosting and other options.
As it currently supports docker-based deployment as a private server option, this is made very fast and in a simple three-step process as stated on their website.
Note: It still involves a prerequisite of docker and docker-compose to quickly get a directus cms app online.
Nonetheless, some added set of features such as project data workflow automation -via emails and notifications- and also built-in API and simple user RBAC and Access Controls make it into an interesting CMS option.
Overall, it is good if you require a fast/functional deployment of your Node.js webapp either by self-host or cloud hosting option.
6. Next.js
One of the most popular options for hosting web apps and supporting many deployments on the Vercel cloud (Testing, production) is Next. The cloud option is currently the most popular with tons of github repos supported.
But fortunately since this blog post is about self-hosting options the top 3 relevant styles for Next.js are available here and as displayed below:
- Direct Node.js provider deployment.
- Docker image deployment (helpful examples for webapp included online).
- Static HTML Export for direct SPA or static website hosting on a personal server such as AWS S3, nginx, apache or other.
The most interesting feature of Next.js self-hosted apps is the built-in caching it supports. Also integrated Cdn (header-specific) support for hosted content and zero-configuration deployment for middleware-based scenarios supported by next start is another great feature.
All of the above are also included on their website as part of the self-hosted options documentation. Using Next.js as a headless CMS might not be a good option since it does not include a fully fledged cms UI or other similar features.
On the other hand, it has good content caching and transparent data-handling capabilities. With that said, this still turn it into a good candidate to be added in the list of headless CMS hosting options.
Links
Source 1
Source 2
Source 3
7. ApolloGraphQL on Apollo GraphOS + Sandbox IDE
One of the high-end options for a headless cms that is also enterprise-ready for larger projects is ApolloGraphQL. It transparently integrates and supports GraphQL API, REST API, with proper management APIs.
It has a highly scalable and transparent data routing layer (GraphOS Router). This allows for flexible schema allocation making it ideal for distributed schema design approaches.
Aside from having a large knowledge base and support forums in addition to the detailed documentation, it includes the following major highlights (as a headless cms techstack):
Apollo Sandbox IDE:
A full server-based html sandbox environment that also interacts as a direct server deployment tool. Aside from being a great in-browser IDE with a broad range of features, Apollo Sanbox runs in a self-hosted local environment that supports data schema visualizations with relevant workflows.
This includes GraphQL schema diffs, checks and visual query execution plans as core features of this IDE.GraphOS Router + Apollo Connectors:
Easily utilized federated schema routing /connections allows for direct schema manipulation as a separate layer on top of multiple APIs on self-hosted enterprise level apps.
This allows for low-code to no-code infrastructure setup alongside maximum productivity for devs.Kubernetes + Docker GraphOS Router Deployments:
Apparently only docker or kubernetes containerized self-hosting is supported for GraphOS Router or Apollo Router Core. Inclusive features also supporting these environments are Prometheus and OpenTelemetry Protocol-backed metrics as part of the insight gathering process for active container platform.
As an enterprise-level option the Apollo IDE full setup alongside a self-hosted instance of your GraphOS Router and data handling layer, is a viable option for most SMEs or personal projects.
Links
Source 1
Source 2
Source 3
Source 4
8. Sveltia-CMS
Last but not least, a svelte-based cms called sveltia seems also very promising in terms of open-source simplified direct deployments.
Being still under maintenance and fully supported by the open source community has its code base open for changes and improvements and continuously builds upon its current standards.
Currently only two different cloud deployment types supported on Netlify and on Decap.
As it is fully Git-based, Sveltia headless CMS has also its drawbacks as part of your source still needs to be hosted in a github-based repo. This makes it a little bit less attractive option to devs that aim for external enterprise-ready client projects.
The best most viable option for static site projects and simple test environments alongside directus would be sveltia since it is pretty simple to setup and run.
BONUS - CLOUD HOSTING ONLY OPTIONS:
Some other cloud-only hosted headless CMS options for people that want their codebase to be hosted on someone else's server are also available.
Top comments (0)