Headless CMS - Contentful

In the last post, we have described headless CMS. Headless CMS architecture is rising in popularity in the development world. 

This model allows breakthrough user experiences, gives developers the great flexibility to innovate, and helps site owners future-proof their builds by allowing them to refresh the design without re-implementing the whole CMS.

One of headless CMS is Contentful. Contentful platform lets you create, manage and distribute content to any platform. It gives you total freedom to create your own content model so you can decide which content you want to manage. 

With an uncluttered user interface, Contentful is an efficient tool for creating and managing your content online, either alone or in team. You can assign custom roles and permissions to team members, add validations depending on the kind of content you have to insert and add media such as images, documents, sounds or video.

Contentful has a three-step process. First, you define a content model which is independent from any presentation layer that defines what kind of content you want to manage. In a second step, you and other internal or external editors can manage all of the content in easy-to-use and interactive editing interface. In the third step, the content is served in a presentation-independent way.

Being presentation-layer agnostic is one of the strengths of Contentful because you will be able to reuse your content across any platform.

To create a web site, you will either have to code it yourself and load content from Contentful API or work with someone who can develop the web site for you. Contentful is the platform where you can update the content of your web site, a mobile app or any other platform that displays content.

Contentful runs on all browsers. Contentful offers the most powerful REST APIs and the only enterprise-grade in-production GraphQL API.

There are three steps you'll have to take in order to deliver content from Contentful to your apps and websites.

1. Create your Content Model

The Content Model is the first step to structuring your content properly. It consists of creating content types that will accept only certain types of data for entry. For example, when creating an interactive quiz, you will need to add something that is a question, multiple answers, an indicator of the correct answer and potentially an image. This can be set up in the content model, so you can then easily just add as many "Questions" to your Quiz as you want.

2. Add Entries and Assets

Entries refer to the content itself. Entries could be blog posts, product features or ingredients of a recipe or any other content. These entries will depend on your previously created content model. In this phase you can also add assets like images, sounds, videos and many other files.

3. Deliver your content with our API

The delivery part of the content may or may not be left only to developers. In this step you set up API Keys that will determine which content will go to which platform. After the delivery is set up correctly, your content is then available for consumption as soon as you hit the “Publish” button.

We have over 18 years experience with numerous CMS, so we can help you with Contentful as well. Call us today for a free, no obligation consultation.

Headless CMS vs Decoupled CMS

A headless content management system, or headless CMS, is a back-end only content management system (CMS) built as a content repository that makes content accessible via a RESTful API for display on any device.

The term “headless” comes from the concept of chopping the “head” which is the front end, i.e. the web site off the “body” (the back end, i.e. the content repository).

Whereas a traditional CMS typically combines the content and presentation layers of a web site, a headless CMS is just the content component which focuses entirely on the administrative interface for content creators, the facilitation of content workflows and collaboration, and the organization of content into taxonomies.

It doesn’t include presentation layers, templates, site structure, or design, but rather stores its content in pure format and provides access to other components (e.g. delivery front ends, analytics tools, etc.) through stateless or loosely coupled APIs.

The headless CMS concept is one born of the demands of the digital era and a business’s need to focus on engaging customers with personalized content via multiple channels at all stages of the customer journey. As the content in a headless CMS is considered “pure” (because it has no presentation layer attached) just one instance of it can be used for display on any device; web site, mobile, tablet, smart watches, etc.

There is some confusion around what makes a headless CMS truly “headless”, as vendors use the term somewhat loosely to label their decoupled or hybrid CMS systems. But a true headless CMS is one that was built from the ground up to be API-first, not a full monolith CMS with APIs attached afterwards.

Cloud-first headless CMSs are those that were also built with a multi-tenant cloud model at their core and whose vendor promotes Software as a Service (Saas), promising high availability, scalability, and full management of security, upgrades, and hot fixes, etc. on behalf of clients.

Coupled CMS vs. Headless CMS

Most traditional (monolithic) CMS systems are “coupled”, meaning that the content management application (CMA) and the content delivery application (CDA) come together in a single application, making back-end user tools, content editing and taxonomy, web site design, and templates inseparable.

Coupled systems are useful for blogs and basic web sites as everything can be managed in one place. But this means that the CMS code is tightly connected to any custom code and templates, which means developers have to spend more time on installations, customization, upgrades, hot fixes, etc. and they cannot easily move their code to another CMS.

There is a lot of confusion around the differences between a decoupled CMS and a headless one because they have a lot in common.

A decoupled CMS separates the CMA and CDA environments, typically with content being created behind the firewall and then being synchronized and pushed to the delivery environment.

The main difference between a decoupled CMS and a headless CMS is that the decoupled architecture is active. It prepares content for presentation and then pushes it into the delivery environment, whereas a headless CMS is reactive. It sits idly until a request is sent for content.

Decoupled architecture allows for easier scalability and provides better security than coupled architecture, but it does not provide the same support for omni-channel delivery. Plus, there are multiple environments to manage, this increasing infrastructure and maintenance costs.

Advantages of Headless CMS

• Omnichannel readiness: the content created in a headless CMS is “pure” and can be re-purposed across multiple channels, including web site, mobile applications, digital assistant, virtual reality, smart watches, etc., in other words, anywhere and at any time through the customer journey.
• Low operating costs: headless CMSs are usually cheaper to install and run than their monolith counterparts, especially as they are typically built on a cloud model where multi-tenant options keep the running costs low.
• Reduces time to market: a headless CMS promotes an agile way of working because content creators and developers can work simultaneously, and projects can be finished faster.
• Easy to use: traditional CMSs tend to be cumbersome and complex as vendors attempt to offer every available feature in one box. Headless systems focus on content management, keeping things simple for those who use it on a daily basis. The entire user experience can usually be managed from within one back end.
• Flexibility: content editors can work in whichever headless CMS they like and developers can build any kind of front end they want in their preferred language (e.g. Ruby, PHP, Java, or Swift) and then simply integrate the two via APIs (like JSON or XML) over RESTful communication. This allows for polyglot programming where multiple programming paradigms can be used to deliver content to multiple channels, and enables a company to benefit from the latest developments in language frameworks, promoting a micro-services architecture.
• Cloud Scalability: the content purity and stateless APIs of headless CMSs enable high scalability, especially as the architecture fully leverages the elasticity of a cloud platform.
• System Security: since the content is typically provided through a high-performance Content Delivery Network (rather than directly from the database), the risk of distributed denial-of-service attacks (DDOS) is reduced.
• Marketing empowerment: marketers may end up relying more on developers in certain scenarios, e.g. creating a landing page with custom layout.

Disadvantages of Headless CMS

• Multiple services: managing multiple systems can be challenging and a team’s knowledge base must cover them all.
• No channel-specific support: since pure headless CMSs don’t deal with the presentation layer, developers may have to create some functionality, such as web site navigation.
• Content organization: as pure headless CMSs do not typically provide the concept of pages and web site maps, content editors need to adapt to the fact that content is organized in its pure form, independently on the web site or other channel.

Headless CMS architecture is rising in popularity in the development world. This model allows breakthrough user experiences, gives developers the great flexibility to innovate, and helps site owners future-proof their builds by allowing them to refresh the design without re-implementing the whole CMS.

In the following posts, we will look more into headless CMS and will describe specific headless CMS. Stay tuned.