JSS Layout Service

The presentation layer retrieves data from the CMS using an API endpoint

·        The Sitecore Layout Service is a Sitecore Headless Services endpoint that provides JSON formatted Sitecore content. You use the Sitecore Layout Service Client to communicate with the Layout Service, and you use the Sitecore Rendering Engine to render the content.

·         This is the presentation layer that provides the composition of pages and the data needed for each component.

·         A REST endpoint that exposes dynamically generated Sitecore content as structured JSON data for consumption by rendering hosts and other consumers.

When should I use this?

To provide an endpoint for the consumption of Sitecore content which will be consumed by

·         JSS apps

·         Asp.net Rendering SDK

·         Jamstack sites

We can consume JSON over HTTP request.

a company can have their corporate site built in .NET, a brand site built in Next.js, and a mobile app built in React Native, and all three could use the same API for data. This makes managing content across web assets easier for Content Authors.

What is difference from traditional Sitecore architecture?

·         No razor rendering

·         Shorter pipeline compared to MVC rendering

·         We can choose different front end technology

·         Separation of rendering from traditional layout

Who should use JSS

Any company that has chosen Sitecore as their enterprise web platform and wants to utilize the benefits of front-end JavaScript frameworks in their web app is perfectly suited for using JSS.

Mock Layout Service

The mock Layout Service emulates the data you would receive from the actual Sitecore Layout Service, while also preparing your JSS app for code-first deployment.

Why It's Important:

• The mock Layout Service provides a consistent API to create a complex single-page JSS application that includes components, routes, and custom route types as well as the needed data for each component.
• The mock Layout Service also provides integration with Sitecore.

Three Notable Factors for the Layout Service Process:

• Your disconnected JSS app is essentially built to consume and render a data-driven layout made available via the mock Layout Service.
• Normally, the component data is a set of fields from the datasource item.
• When the mock or Sitecore Layout Service renders a page, it returns a JSON representation of the layout of the route and the data for each component.

NOTE when connecting a JSS app to Sitecore:

• Currently, there are no tools built into the JSS SDK to retrieve and store Sitecore-connected Layout Service data as files.
• Should you later import your JSS app to Sitecore and no longer need the mock Layout Service that the sample apps use, you can instead save Layout Service data queried from Sitecore in a JSON file.
• Once you have that data locally (i.e., you're disconnected), you might consider building your own service layer to fetch "raw" Layout Service data from the JSON file(s) you saved.

Know more about Sitecore First Flow , Sitecore Layout Demo