Sitecore Headless – Next.js middleware issue with Experience Editor

A few days ago we have been hit by an Experience Editor issue with Next.js. It was already working and configured locally before. So the investigation began, where (Sitecore repository or Next.js repository) and which commit is causing the issue. On the Sitecore side we started to check with simple and low data components and in this case all was working as expected – Experience Editor rendered and worked. Alright, this means something is probably going on on the frontend side. I started to check which commit introduced the bug, by using git bisect – which I never heard of, until Bálint Csák talked about it.

Continue reading “Sitecore Headless – Next.js middleware issue with Experience Editor”

Sitecore Headless – How to reuse Layout Service serialization in custom API Controllers

On one of our current project we have a close deadline, therefore we need to simplify implementation and cut from the scope as much as possible to roll out the MVP with the full functionality but without Experience Editor support – as it’s not priority for now. We had a long discussion about this, the main reason of cutting scope is to keep the frontend simple as possible and focus on business logic functionality instead of editing experience. Therefore on the Sitecore side we are providing a few APIs for the frontend and not creating any layout, rendering and placeholders; only pure templates and content.

Continue reading “Sitecore Headless – How to reuse Layout Service serialization in custom API Controllers”

Sitecore Headless – Demystifying item serializers

In my previous posts I showed how you can extend the Layout Service and implement your own custom Contents Resolvers. Until now I simply wanted to serialize all non-standard Sitecore fields with its values. Although there could be a case where you need to include or exclude fields from the Layout Service response.

Continue reading “Sitecore Headless – Demystifying item serializers”

Sitecore Headless Next.js – Forwarding custom query parameters to Layout Service

A few weeks ago the following question came up by Robbert Hock on Sitecore Chat:

Contents Resolver question: with Context.HttpContext.Request.Params["item"] I can read the url of the item. But when for example we have a url like /news?page=1, how would I read the page querystring prop in a contents resolver? Somehow I can’t find it, since the request is like /sitecore/api/layout/render/default

Robbert Hock

This is a fair question, if you would like to process custom parameters in your custom Contents Resolver.

Continue reading “Sitecore Headless Next.js – Forwarding custom query parameters to Layout Service”

Sitecore Headless Next.js – Runtime rewrites

When you create a Sitecore Next.js project you will notice there is a configuration file generated, called next.config.js. This config holds different Sitecore related config entries, but in this post I would like to focus on the async rewrites() method. This is a Next.js feature, to handle rewrites in the app. Rewrites can be useful for several things. By default Sitecore uses rewrites to proxy the media and some Sitecore API requests.

Continue reading “Sitecore Headless Next.js – Runtime rewrites”

Sitecore Headless Next.js – Generic component based external API response processing

Since Sitecore Headless and Composable DXP jumped in to our life, designing and architecting Sitecore solutions are changing. The integration layer is moving to the frontend layer and stays decoupled from Sitecore.

On the current project we are working on, almost all Sitecore components have to call different API routes to enrich the Sitecore component with data coming from these external sources. As it’s a requirement to almost all of our components, it makes sense to design a generic solution for serving the merged data to the frontend. I want to thank Richárd Palkó, we designed and implemented this generic solution together and thank you for guiding me on getting familiar with TypeScript, Next.js and React 🙏.

Continue reading “Sitecore Headless Next.js – Generic component based external API response processing”

Sitecore Headless – Wildcard item with datasource content resolver

On one of my first Sitecore Headless project I got a requirement to implement a dynamic URL resolving to display product data from a different root of the Sitecore tree. If it would have been a traditional Sitecore solution I could implement a custom item resolver but in the headless world we need a different kind of mindset to solve problems like this.

Continue reading “Sitecore Headless – Wildcard item with datasource content resolver”

Using translation API with Sitecore ASP .NET Core Rendering Host

Currently there is no client side API implementation done of the Sitecore dictionary translation API in the official Sitecore ASP .NET Core SDK, therefore I decided to implement a PoC. After googling a bit I found, Sitecore already provides an API endpoint to resolve dictionary items and it’s already implemented in the JSS clients. So based on this documentation I found the API endpoint on my local Sitecore CM instance, which is

/sitecore/api/jss/dictionary/<site>/<language>/?sc_apikey=<apikey>

The response of this endpoint is the following:

{
"lang": "en",
"app": "Discovering.Sitecore101",
"phrases": {
"label1": "label 1",
"label2": "label 2"
}
}
Continue reading “Using translation API with Sitecore ASP .NET Core Rendering Host”