Loading...

Create a richer cross-platform user experience with headless CMS

  • Posted on January 31, 2018
headless CMS

When it comes to offering a powerful digital customer experience, Sitecore delivers. The platform evolves to fit customer expectations and new technologies.

For example, countless clients require access to Sitecore content in the form of a RESTful service. This puts Sitecore at the center of the digital ecosystem, supplying content to many other systems such as single page applications based on Angular and/or React as well as native mobile applications.
The main reason why we can swiftly extend existing service to exposed content is because Sitecore originated as a headless content management system (CMS). Recognizing a true market need for this kind of content solution, Sitecore released version 9 and its game-changing Sitecore JavaScript service to further support headless CMS.

What does this mean? Let’s dive into CMS terminology and the “headless” concept in the context of experience management platforms, then explore how Sitecore’s new JavaScript service helps businesses create the digital experiences they need to stay competitive.

Types of CMS

A coupled CMS is responsible for content management and content delivery. It consists of three parts: a database that stores the content, a web application/ content management that provides an interface to manage content and design, and content delivery that generates the HTML experienced by the visitor.

A headless, or decoupled CMS, occurs where the front-end, or “head”, is detached from the back-end that creates and manages content. The back-end delivers the content as a service to the front-end for the content consumer, or customer.



When to use headless CMS

Headless delivers content through an API to any type of application that can consume an API, essentially providing unlimited options for implementing new applications. It can be a great fit in ecosystems where you publish content once and it is consumed by many parties, on websites and web apps that use JavaScript frameworks (i.e. React, Angular), and in native mobile apps (iOS, Android). It can also really enrich product information on e-commerce sites.

Some advantages of headless CMS include:

  • Flexibility: developers can use any front-end customer-facing technology as long as it consumes a RESTful service
  • Efficiency: reduced time for creating applications
  • Optimization: overall performance improvements by enhancing back-end (API) and front-end implementations

However, it has a few disadvantages:

  • Complexity: it becomes increasingly complex to implement each API across multiple systems 
  • Testing: content authors can’t preview changes on the fly
  • Current limitations: marketers will not be able to manage customer experience, will not be able to get contextual insight and personalize the content according to the insights.
  • Complications: headless is an overcomplicated solution when building a simple site

How Sitecore supports headless

Sitecore originated as a headless CMS. It stores content as items, and Sitecore’s layout engine places those objects, or modules, in a web presentation format. Similarly, a mobile app developer can use Sitecore API to call those content objects and reuse them in a mobile app. When a marketer changes your brand’s web content in Sitecore, those changes automatically propagate across any channel on which you’ve called or reused those content objects. With Experience Editor, you can edit and preview content components (or modules) on a page. The same actions can be achieved through other products. However, while many other content management systems make it appear as though you’re editing content components on the page, the similarities end there.

Sitecore introduced Sitecore Item Web API in 2012 which was used to get the items. In 2014 it introduced Sitecore Services Client to provide a service layer on both the server and the client side of Sitecore applications through Sitecore REST API, SPEAK applications and Client-side JavaScript, where it lacked personalization and front-end developers. That’s why Sitecore introduced JavaScript Sitecore Services (JSS) in Sitecore 9, which is a complete SDK for JavaScript developer. By enabling developers to build full-fledged solutions using Sitecore and modern JavaScript UI libraries and frameworks, it will close the gap between back-end and front-end developers. All pertinent Experience Platform capabilities are preserved, including Experience Editor, Personalization, MV testing and Tracking / Analytics.

JSS will give front-end developers flexibility to build sites using any tools without the restrictions of back-end structures and conventions. It will also allow marketers to get insights context, leverage personalization, and optimize user experiences.

For example, we’d use Content Service to access content items outside of the Layout Service ?itemPath=/homePage where it will resolve the item in a similar fashion as Layout Service does, and returns a serialized version of the item:

{

  "name": "homePage",

   ...

  "placeholders": {

    "name": "main",

    "path": "main",

    "elements": [

      {

        "viewEngineFields": {

          "Component Name": "Welcome"

        },

        ...

        "contents": {

          "Text": "World",

          "Title": "Hello from home page"

        }

      }

    ]

  }

}

Powered by Sitecore 9, headless CMS will drive digital marketing far beyond the web. Now you can create web apps, mobile apps, and single page apps using Sitecore JSS to expand your market and reach different user segments.

Here at Avanade, we transfer the potential of headless CMS into tangible results for our clients. Connect with us to determine the right digital content management strategy that will keep you ahead of customer expectations.

Techs and Specs Newsletter

Stay up to date with our latest news.

Next steps

Talk to us about how we can bring the power of digital innovation to your business.

CLOSE
Modal window
Contract
Share this page