When 2 of my favorite technologies meet

Sitecore adds NextJS to it's headless stack

When we look at digital architectures today, we can differentiate 2 models with regards to rendering the website. In one hand we have the “Traditional CMS” where the rendering of the html pages takes place inside the CMS. And on the other side we have seen a big growth of the “Headless CMS” that exposes the content via API’s but doesn’t come with rendering capabilities.

Both models have there merits and downsides. If we look at a traditional CMS, we can embrace the inplace page editing and the flexible component based layout capabilities. This empowers the content creators to use there creativity in maintaining their website.

The headless CMS benefits from the decoupled aproach making it better suited for scaling, lightning fast response times and making it easier to change the design in future.

Sitecore

Sitecore has been a traditional CMS system for many years. With their experience editor offering in page design and embedded personalisation, this enterprise suite is a top of the notch platform that will suit many needs. The platform is highly customizable and can be tailored to the needs of any customer.

With version 9.0-update 2, Sitecore took it’s first steps in adding mature headless capabilities to the platform. With the introduction of Sitecore JSS we saw a combination of a headless rendering and premium content/page editing. Futhermore, JSS made it possible to use it’s xDB personalisation features in a headless architecture.

Static Rendering

Meanwhile in headless land, the latest trend is to use static rendering of your presentation layer. With static rendering, the website is rendered “at build time” and the result is stored in simple html files that can be served directly to the client. This aproach is embraced by frameworks like Gatsby and NextJS. My personal favorit in this is NextJS. Besides the seamless integration with client-side code, NextJS offers a hybrid solution combining static and server side rendering. In combination with the smart bundling optimizing your javascript and css as well as the route pre-fetching, NextJS is in my opinion the current platform to beat.

NextJS for Sitecore

With a firstclass platform like Sitecore on one hand, and a premium modern framework like NextJS on the other hand, wouldn’t it be great if you could combine both? With Sitecore 10.1 this symbiosis is put into reality. NextJS is now available as a framework for Sitecore JSS.

When creating your NextJS application on Sitecore, you will get a working solution that uses the layouting and graphQL API to interprit the component based pages that are created in Sitecore. The entire website can be staticaly rendered and you can benefit from all the features Sitecore and NextJS have to offer.

Leave a Reply