HEADLESS

DEVELOPMENT
& SITECORE
 TABLE OF CONTENTS
Preface............................................................................................................................................................................................................................. 3
From Buzzwords to Nomenclature..................................................................................................................................................................... 3
Headless CMS........................................................................................................................................................................................................4
Decoupled CMS.....................................................................................................................................................................................................5
The Benefits of “Headless” Development....................................................................................................................................................... 6
Maximizing Technology Investments.............................................................................................................................................................6
Reducing Time-to-Market...................................................................................................................................................................................7
Fostering Digital Innovation...............................................................................................................................................................................7
Sitecore for Today, Tomorrow, and Beyond...................................................................................................................................................8
Finding a way Forward........................................................................................................................................................................................8
Sitecore Services Client API...............................................................................................................................................................................9
Sitecore XA Data Modeling................................................................................................................................................................................9
Sitecore JavaScript Services.............................................................................................................................................................................10
Going Forward...............................................................................................................................................................................................................11

2
Preface
Over the past few years the popularity of the “headless” CMS has experienced tremendous growth, transition-
ing from relative obscurity to mainstream market prominence. Embraced by the development community
and marketing professionals alike, the “headless” CMS provides digital teams with an opportunity to effectively
leverage and distribute content across multiple distribution channels.

Horizontal Integration has partnered with many fortune 500 companies to build robust enterprise solutions
utilizing Sitecore’s Experience Platform. At the heart of this platform is a rich CMS that empowers organizations
to fully engage with their customers throughout the entire digital experience lifecycle.

While Sitecore has never marketed their platform as a “headless” CMS, its native architecture has always en-
forced a clear separation of content, layout, and presentation. In doing so, Sitecore fulfills the core principal of
“headless” development while delivering on their promise to enable content teams to write once and distribute
anywhere.

The following primer is intended for organizations that are considering implementing their own ”headless” CMS,
providing an introduction to the broader concepts of “headless” development, the advantages to this type of
distributed architecture, and how Sitecore is repositioning its own platform to dominate this emerging digital
environment.

From Buzzwords to Nomenclature

When reviewing new technologies, it can be difficult to differentiate between buzzwords and the next “big” thing.
When Ethan Marcotte first introduced responsive web design, there was very little documentation available,
which made it difficult for early adopters to implement consistently.

As responsive design matured, development teams refined their implementation techniques, establishing a
set of guidelines that were later adopted by the broader front-end development community. Champions of
“headless” development are following a similar approach, and while the nomenclature continues to evolve,
several concepts have emerged, driving the conversation.

3
headless cms
When distilled to its simplest form, a “headless” CMS is merely a content management repository absent of the
content delivery and presentation capabilities found in traditional CMS platforms. The over-arching goal of
“headless” development is to ensure that user-generated content is always abstracted away from presentational
markup.

“headless” cms architectural model

single page apps native apps custom solutions

api

cms

A “headless” CMS implementation consists of the following elements:

1. Content authors interface with a traditional administrative UI to create and manage content, which is
stored in a database-driven repository.

2. Content is distributed from the repository via a REST-based API formatted as either JSON or XML.

3. The end-user experience is rendered by a JavaScript web app and/or a native mobile application.

Capitalizing on the increasing availability of open source JavaScript frameworks and REST-based API tools,
the “headless” CMS empowers marketers to distribute their content freely throughout a rapidly diversifying
technology ecosystem.

4
decoupled cms
The “decoupled” CMS differs from other CMS implementations due in large part to its internal architecture.
Relying on an internal API, the “decoupled” CMS maintains a clear separation between authoring and delivery,
distributing content to either an integrated presentation layer or externalized as data via a REST-based API for
consumption by third-party solutions.

“decoupled” cms architectural model

single page custom

web browser apps native apps solutions

html api

delivery

authoring

A “decoupled” CMS implementation consists of the following elements:

1. Content authors interface with a traditional administrative UI to create and manage content, which is
stored in a database-driven repository.

2. Content is abstracted within the CMS and distributed to either an internal presentational layer or exter
nalized via a REST-based API.

3. The end-user experience can be rendered by an integrated presentational layer, JavaScript web app, or
a native mobile application.

While the term “decoupled” is relatively new in the context of “headless” development, the concept of abstracting
content from presentation is not. In fact, this has always been a key architectural tenant of Sitecore since it’s
inception, a topic that will be discussed in more detail in subsequent sections.

5
The Benefits of “Headless” Development
As technology decision makers begin pursuing their own “headless” implementations, it will be mission critical
that they understand the potential benefits of “headless” development. It will be equally important for these
leaders to have the information they need to clearly articulate and evangelize these benefits to their executive
stakeholders.

The following high-level summary takes a closer look at how “headless” development may appeal to the varying
groups within an organization including senior leadership, marketing, and development teams in support of
the overall brand.

maximizing technology investments

Technology leaders investing in digital solutions are becoming increasingly conservative with their IT spending as
they seek technology solutions that provide more value to their organization. According to a survey conducted
by Piper Jaffray, which polled more than 160 CIOs across ten industries, the majority of respondents expected
to increase their 2017 IT budgets at a rate less than what they had forecasted the previous two years.

The “headless” CMS will appeal to budget conscious leaders looking to increase ROI by reducing the economic
burden and risk associated with enterprise development. By consolidating an organizations’ overall digital
footprint, “headless” development will eliminate the need for disparate systems and redundant content.

In addition, “headless” development will better insulate technology investments from shifting consumer
preferences, new technologies, and newer devices.

The bottom line for organizations is simple: when change

happens, they will be better positioned to adapt quickly
and with relatively little additional investment.

6
reducing time-to-market
Simplifying the content authoring workflow will become mission critical as the technology landscape continues
to grow. In his article “What’s Next for Headless CMS in 2017”, Greg Lucian shared that content marketers will
need to diversify beyond responsive websites and begin supporting native mobile apps and Internet of Things
(IoT) devices, such as, VR headsets and smart watches.

The “headless” CMS will appeal to content authors and marketers, providing them with a unified platform for
creating, maintaining, and distributing content seamlessly across any number of digital properties. The added
benefit for marketing teams is a personalized brand message going-to-market faster while reaching a larger
base of consumers.

Digital agencies looking for new ways to entice consumers will benefit from this approach as well, broadcasting a
unified brand message across multiple formats and channels. This could include the standard web, augmented
reality and/or in-browser virtual reality.

fostering digital innovation

While the “headless” development approach has the potential to benefit an entire development team, Lars
Nielsen, Co-Founder and Sr. VP of Technical Marketing with Sitecore, believes that the “headless” CMS will
initially appeal to front-end developers. With the ability to freely explore open source JavaScript frameworks
such as React and Angular, front-end developers will have the ability to create richer and more engaging digital
experiences.

The net result for front-end developers is that they will spend more time focusing on innovation and less time
navigating the limitations of platform-specific code. In addition, front-end development teams will have the
opportunity to work in their own native environments, increasing overall productivity.

At Horizontal Integration, the prospect of “headless”

development is appealing to technology leaders because
it eliminates unnecessary integration points between
front-end and backend developers.

As Lars Nielsen went on to share, “put simply, writing apps that interact with a headless CMS gives the developer
more freedom, flexibility, and a bigger playground”, qualities that will appeal to any developer, front or back.

7
Sitecore for Today, Tomorrow, and Beyond
With consumers increasing the amount of time they are willing to spend engaging with brands on the internet,
they have come to expect sophisticated digital experiences that will deliver personalized content to all of their
digital touchpoints. The challenge for brands has been finding a technology solution that balances innovation
with personalization.

While the “headless” CMS enables brands to create innovative experiences, the most significant limitation to
these systems has been there inability to support personalization. Despite the fact that Sitecore was the
first truly “decoupled” enterprise CMS, Lars Nielsen concluded that “headless” architectures make it difficult to
personalize content, complicating real-time interactions with consumers, as well as testing and optimizing the
overall experience.

finding a way forward

With the release of Sitecore 9, the Sitecore Experience Platform aims to solve the common challenges associated
with “headless” development and personalization. With a comprehensive native toolset, the newest version of
Sitecore provides digital teams with powerful, new and re-architected, “headless” capabilities that will bring data
and intelligence together.

Understanding the need for flexibility, sitecore cms “headless” model for “headless” delivery
the Sitecore product team has bundled
Sitecore Services Sitecore XA Sitecore JavaScript
three features for building effective Client (SSC) Data Modeling Services (JSS)
“headless” experiences. This includes
the Sitecore Services Client (SSC), the
REST / oData JSON Rendering React, Angular
Sitecore XA Data Modeling, and Sitecore
JavaScript Services. Experience JavaScript Services
Accelerator Layer

Each of these features offers slightly

different capabilities and is intended
Sitecore Services
for specific implementations whether Client API Presentational Layer
Presentational Layer

it is a Single Page Application or a

simple kiosk experience. With a
better understanding of each of these Personalization Engine
Personalization Engine

features, organizations can begin

identifying how the Sitecore platform
will help them overcome their unique Content
Content Repository
Repository

technical challenges.

8
sitecore services client api
The Sitecore Services Client (SSC) API was originally released in Sitecore 7.5 and was intended to replace the
legacy Web Item API. The SSC provides a service layer on both the server and the client side that enables
developers to build sophisticated data-driven applications with consistent client-server communication.

The SSC framework, built with the ASP.NET Web API as its foundation, introduced web-services allowing developers
to access regular Sitecore items and custom business objects respectively. The SSC provides developers with
three different methods for accessing these web-services including integrated SPEAK components, client-side
JavaScript, as well as the REST-based API.

Intended as a lightweight interface for accessing data, the SSC does not provide personalization capabilities.
The SSC is ideal for kiosk and IoT implementations, though it can be implemented with progressive web apps
as well as native mobile apps that do not require personalized content.

With the release of Sitecore 9, the SSC has undergone a significant re-architecture with the most notable
enhancement being the addition of support for oData (Open Data Protocol). oData is an open protocol that
defines a set of best practices for building and consuming REST-based APIs.

sitecore xa data modeling

As apart of the Sitecore Experience Accelerator (XA), Sitecore enables developers to model data from the CMS
in JSON (JavaScript Object Notation) format. Unlike the SSC, the XA Data Modeling & JSON rendering service is
integrated within the Experience Manager making it possible to deliver personalized content via layouts and
renderings.

Fully integrated into the Sitecore editing function, the XA Data Modeling & JSON rendering service is a powerful
feature enabling content teams to build mobile apps or data driven websites with personalized content
delivered directly from Sitecore. The content for the site is accessible via a web-service API.

To make page design easier, the XA Data Modeling & JSON rendering service provides three default JSON
rendering types including: JSON Content, JSON List, and JSON Results. More detailed information and thorough
documentation can be found on Sitecore’s documentation portal.

9
sitecore javascript services
Sitecore’s JavaScript Services (JSS) may prove to be one of the most highly anticipated features delivered with
the upcoming release of Sitecore 9. While Sitecore has yet to share all of the technical specifications, JSS is a
complete toolkit for modern JavaScript developers, providing the tools they need to build full-fledged JavaScript
applications.

Sitecore’s JavaScript Services acts as an intermediary between a custom JavaScript application and the Sitecore
Experience Manager, creating the necessary bindings between the two applications. In dong so, the JSS makes
it possible for development teams to create innovative “headless” applications without having to sacrifice
Sitecore’s personalization, analytics, and A/B testing features.

In addition to the core JSS architecture, Sitecore will release a React SDK and will quickly follow-up with the
release of an Angular SDK. Following a truly decoupled architecture, development teams can host and deploy
the front-end experience separate from the Sitecore experience platform.

10
Going Forward
As the “headless” CMS continues to mature into a formal discipline, the conversation will become more nuanced
with marketers and consumers continuing to push for personalized content and engaging experiences. It will
be important for organizations that are considering implementing their own “headless” solutions to understand
these varying points as they look to transition their entire development ecosystem.

Horizontal Integration is a proud Sitecore Platinum Partner, and with the release of Sitecore 9, is excited to
represent the industries first enterprise “headless” platform. While developing a “headless” website may seem
new, the distributed development pattern is a core architectural tenant of Sitecore and has always been at the
heart of their mission, enabling marketers to write once and distribute anywhere.

Whether it is a basic data driven website to promote a brand, or a highly interactive digital experience,
organizations interested in the “headless” development approach are encouraged to reach out and learn how
Horizontal Integration and Sitecore can help them realize their technology goals.

interested in learning more?

If you’d like to learn more about Horizontal Integration and their Sitecore chops, check them out here:
horizontalintegration.com/sitecore-solutions

or get in touch directly:

612.392.7580
askhi@horizontalintegration.com

11
about the author:

Matthew Goodenough - Director, Front-end Development

Matthew brings nearly 15 years of front-end web development experience to the technical leadership team at
Horizontal Integration. He leads a global team of front-end developers who are responsible for all front-end
development activities. His experience with enterprise e-commerce platforms, customer loyalty systems, and
content management tools has served as an invaluable resource for clients including Subaru, Toyota, Electronic
Arts, UnitedHealth Group and Adobe. Matthew is passionate about front-end development best practices and
spends his time split between leading the team and actively developing the tools that the team uses on a daily
basis.

12