Popular headless CMS

 According to Wikipedia, a Content Management System (CMS) is an application that can be used to manage the creation and modification of digital content.

A CMS is usually made up of two major parts: the backend, which is responsible for creating and managing content, and the frontend, which is used to display the content to viewers. Some of the basic features of a CMS include a content editor, user management capabilities, and an intuitive dashboard.

The rising popularity of JAMSTACK has spurred on the adoption of headless CMS. They give developers the freedom to choose how content is served.

A headless CMS is basically a CMS without the frontend layer. It is also known as JAMSTACK CMS in some circles. The frontend is decoupled from the CMS, which gives developers the flexibility to build the view layer of the CMS in any way that’s desirable to them.

In this article, we will be looking at popular open source headless CMS for JavaScript developers and what makes them unique.

Ghost

Kicking off the list is Ghost, which is a popular CMS with 34.5K GitHub Stars.

Ghost is an API-driven, headless CMS built with Node.js. It is a complete decoupled headless CMS, which means it can either be used in a headless manner or via templates. Ghost serves its content using a set of REST API endpoints, which are divided into three major categories:

  • Content API
  • Admin
  • Webhooks

It also comes with a set of tools out-of-the-box, which include:

  • Ghost CLI: A tool to manage Ghost installations and configurations
  • Migration: A tool to help you migrate your content from other popular blog platforms
  • JavaScript SDK: A set of JavaScript packages that help you achieve some common tasks with the Ghost API

To get started quickly with Ghost, you have to install the CLI via npm or yarn:

yarn global add ghost-cli@latest

After successfully installing the Ghost CLI, you can go on to install Ghost in the directory of your choice by running the command below:

ghost install local

Strapi

Strapi is an open source headless CMS also based on Node.js and maintained by over 100 contributors. It is a fully-customizable CMS.

Some of its features include:

  • Multi-database support: SQLite, MongoDB, MySQL, Postgres are supported out of the box
  • Webhooks: Notifies other applications that an event has occurred in your Strapi application
  • Auto-generated documentation: Write and maintain the documentation with a one-click integration
  • Authentication and permissions: Secure your endpoints by allowing (or not allowing) users to access your API by roles
  • 100% JavaScript: Completely built with JavaScript

Data in Strapi can be consumed either via REST API or GraphQL. It also offers a one-click deployment option to hosting platforms such as Heroku, Digital Ocean, and Platform.sh.

The functionalities of Strapi can be extended by integrating tools such as Cloudinary, Mailgun, Algolia, Redis, Sentry, and others.

To get started with Strapi, run the code below in your terminal:

yarn create strapi-app my-project --quickstart

Netlify CMS

Netlify CMS is a single-page React application that gives users a way to work with content on any site built with a static site generator. It is a Git-based CMS, which means the data resides in files stored in a Git repository as opposed to most API-driven CMS, which store and fetch data from a database.

Some of the features of Netlify CMS include:

  • Full-version control on all content: you have complete control of where your files reside
  • Fast web UI: With rich-text editing, real-time preview, and drag-and-drop media uploads
  • Platform-agnostic: can be used with any static site generator and frontend framework
  • Easy installation: Add two files to your site and hook up the backend by including those files in your build process, or linking to our Content Delivery Network (CDN)
  • Modern authentication: Use GitHub, GitLab, or Bitbucket and JSON web tokens
  • Flexible content types: Specify an unlimited number of content types with custom fields
  • Fully extensible: Create custom-styled previews, UI widgets, and editor plugins
  • One-click deployment to Netlify

You can get started with Netlify by either adding it to an existing site or using a starter template. Netlify CMS provides a starter template for popular static site generators.

Keystone 5

Keystone 5 is the latest version of the Keystone CMS. The monolithic architecture of the previous versions was overhauled for an API-driven approach.

Keystone 5 is a headless CMS built with Node.js. It is frontend agnostic and can be used by popular frontend frameworks, static site generators, and mobile applications.

It is also fully customizable and allows you to pick the features you need, such as the type of database. The Admin UI is very intuitive and changes based on the defined schema.

Some of the key features of Keystone 5 include:

  • GraphQL API: Keystone provides a powerful GraphQL API with CRUD operations and powerful filtering options for all your lists
  • An extensible admin UI: The admin app is a fully functional administration UI to help you manage your data
  • Database adapters: Keystone allows you to choose different storage methods with adapters for MongoDB and Postgres
  • Access Control: control who can have access to your GraphQL API
  • Third-party authentication: Keystone supports popular third party authentication like Google, Facebook, GitHub, etc., along with a host of other authentication methods supported by PassportJs

To get started quickly with Keystone 5, make sure you have either of the supporting databases: MongoDB and PostgreSQL.

Then, run the code below in your terminal

yarn create keystone-app my-project

Follow the on-screen prompts to set up Keystone. After a successful installation, go to the root directory of the application and run the code below:

yarn dev

The above command starts up the Keystone development server.

Conclusion

Open Source Headless CMS is becoming popular as an efficient alternative for managing content. It allows you to be in charge of how your content is stored, and how you want it to be presented. Each of the mentioned CMS in this article come with a unique set of features. It is up to you depending on your use case to determine what will be best for your application.

: Debug JavaScript errors easier by understanding the context

Debugging code is always a tedious task. But the more you understand your errors the easier it is to fix them.

LogRocket allows you to understand these errors in new and unique ways. Our frontend monitoring solution tracks user engagement with your JavaScript frontends to give you the ability to find out exactly what the user did that led to an error.

LogRocket records console logs, page load times, stacktraces, slow network requests/responses with headers + bodies, browser metadata, and custom logs. Understanding the impact of your JavaScript code will never be easier!

.

Comments

Post a Comment

Popular posts from this blog

Flutter for Single-Page Scrollable Websites with Navigator 2.0

Image
  Single page scrollable websites are everywhere. In this website design pattern, all the content is presented in one long-scrolling layout that contains multiple sections. Visitors can scroll or jump to a section by clicking buttons of a sticky menu. This pattern is a good fit for small content such as brochure websites, software library documentation, portfolios, and landing pages that are used to convert users [ 1 ]. Designers also love this pattern because it is simple, clean, and enables cool scroll animations. Jetbrains Mono single-page scrollable website Hive docs multi-page scrollable website In this series of articles, we will explore how to build a  single-page scrollable website  using Flutter. We will benefit from the Navigator 2.0 API to provide a good navigation experience to the users. You can find the source code of this series’ sample apps on my  Github page . The implementation details of the sample apps will be explained in the following articles: ...
Read more

A Data Science Portfolio is More Valuable than a Resume

Image
A Data Science Portfolio is More Valuable than a Resume Benjamin Obi Tayo Ph.D. Following Nov 20  · 5 min read D ata Science is a practical field. Hands-on skills are very important especially when you are interested in working outside academia as a practicing data scientist. In academia, you need more theoretical and research skills. While in-depth knowledge in the theoretical foundations of data science is important, as a practicing data scientist, hands-on experience is very crucial and one way to showcase you hands-on skills is via building a very great portfolio. Companies interested in hiring you would definitely be asking you for a portfolio, as it gives evidence of your strengths in fundamental data science concepts. While a data science resume is important, a data science portfolio is more valuable than a resume. This article will discuss 3 important platforms that can be used for portfolio buildi...
Read more

Better File Storage in Oracle Cloud

Image
Use Oracle Application Express with Oracle Cloud Infrastructure REST APIs to upload, download, and manage big files in Oracle Cloud. By Adrian Png November 27, 2019 Oracle Cloud Infrastructure  provides a comprehensive suite of REST APIs for accessing and managing cloud resources. For example, administrators can use REST APIs to create and manage autonomous databases and initiate backups. Oracle Application Express (Oracle APEX)  makes working with REST easy. The  APEX_WEB_SERVICE  package, available since Oracle APEX 4.0, provides developers with a function for consuming REST APIs. Oracle APEX 5.0 introduced the  APEX_JSON  package, allowing easy parsing of JSON responses. Oracle APEX 18.1 introduced the Web Source Module (WSM), which enables developers to access REST services and use the data in APEX components such as reports, interactive reports, and interactive grids. These features, when used together with Oracle Cloud Infrastructure REST ...
Read more