Overview of headless development with Sitecore

Abstract

A short overview of the Sitecore tooling and products for headless development

A headless architecture consists of a back end with a layer of services and APIs and a front-end/client/user-facing application. The front-end application, or presentation layer, retrieves data from the CMS using API endpoints and uses that data to populate, or hydrate, the markup it generates.

The same endpoint can provide content data for multiple front-end applications built with a variety of technologies. For example, a company might have a corporate website using a .NET technology stack, a brand website built with Next.js, and a mobile application built with React Native. All three applications can use the same API endpoint for retrieving the data they need, and they can have separate delivery topologies and separate scaling strategies. This is helpful to companies that are globally distributed and/or have large volumes of traffic.

Sitecore as a headless CMS

With most CMS, the decoupling is limited to content data. The APIs can retrieve text and images for the various pages or screens. Still, the information about how the content fields and elements displayed on the page is specified in code, requiring code changes to update the presentation of the content.

When working in Sitecore as a traditional CMS, Content Authors have control over the presentation of the content, empowering them to manage content and presentation across multiple channels efficiently. With Sitecore's headless architecture, they retain control over both content and layout management.

Refer to this article for a more detailed overview of Sitecore headless concepts - What is a headless CMS?

Brief architecture overview

Headless development in Sitecore is powered by a layer of services, API endpoints, and rendering SDKs, as shown in the following diagram:

HeadlessServicessArchitecture10_.svg

Services and API endpoints

When doing headless development with Sitecore as a headless back end, you have the following options for the services and API layer:

Refer to the documentation of each product for detailed information and walkthroughs.

Rendering SDKs

For building front-end applications, or rendering hosts, Sitecore provides the following SDKs:

The SDKs come with tooling to build complex rendering hosts. See the documentation of each SDK for specific information and walkthroughs.