Sitecore Headless SXA

An exciting opportunity for future Sitecore development

In anticipation of the Sitecore JSS & Headless approach to development, I have written a short overview of my learnings from the 2017 Sitecore Symposium Conference regarding headless and SXA. A presentation which I saw explained this experimental but exciting concept.


Overview

At Sitecore Symposium 2017 in Las Vegas, Sitecore announced support for headless. This is an exciting opportunity for future website development. In its current release, Sitecore JSS will support oData layer and will allow developers to be very specific about the information they extract from Sitecore, while reducing the payload on the system to perform retrieval and submission tasks. oData JS in Sitecore is available and uses the existing libraries to accelerate the setup and configuration.



Combined SXA components with React JS.

Can it be done? Yes, in theory. It is untested in a production environment and when we have experimented with this approach it is quite tricky getting the React JS component libraries complying with the Sitecore SXA components and its pre-existing markup. To achieve this the FED would require components which have the same properties and reference as Sitecore SXA components.



JSON Data Modelling & SXA

Using JSON reading in the Layout (of experience editor), JSON lists or single items can be exposed. It is using Sitecore JavaScript Services, which are still in pre-release. Sitecore has a concept of creating variants which control the markup.

Taking this approach, you could potentially control the Sitecore fields which are output in the component markup. Using this markup you can use variants in the JSON feed. Low level controls of the property in the feed and the output is the Sitecore fields.

What is nice about the SXA is that we can get JSON output of a component really easily. SXA data gives parameters - name, placeholder, id. Then we can retrieve this in a React standard fetch passing query data.


This approach is cutting edge. Combining enterprise software with new frontend frameworks is an exciting proposition. The Sitecore JavaScript Service is still in pre-release so it will be 3-6 months before we can readily build a production site on SXA & headless. This headless approach is only available in Sitecore 9, released last week, and assumes you would use SXA 1.6, the latest version. When looking at trying this concept in practise, at this stage, it will come down to how much risk the project can absorb and how experimental you can be on your platform implementation.

— Nick Jones

Want more?

Back to the Blog

NEW Switch have been awarded a Good Design Award in Digital Design.
Read More

Switch acknowledges the Traditional Custodians of the lands where we live, learn, and work and we pay our respects to their Elders past and present and emerging.

Sydney
Level 5
100 Market Street
Sydney NSW 2000
Melbourne
Level 22
120 Spencer St
Melbourne VIC 3000
New Zealand
11-19 Customs Street West
Auckland 1010

Singapore
8 Cross Street
Singapore, 048424

ABN 15 120 572 750   ·   © 2024 Switch

Subscribe Now

Sign up to our newsletter to gain access to this page.

No thanks