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.

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 🙏.