Sitecore JavaScript Rendering SDK (JSS) for Next.js
Next.js is a framework built on top of React that aims to help developers create production-ready applications with minimal need for configuration and boilerplate code.
JSS for Next.js uses many of the features of Next.js, to simplify and enhance the development workflow and experience.
This module is provided as a part of Sitecore JavaScript Rendering SDK. It contains Next.js components and integration for JSS.
The following video highlights the benefits of Next.js.
View the entire Master Sitecore "Headless & JSS" playlist on YouTube.
Improvements over previous JSS SDKs
JSS for Next.js distinguishes itself from JSS for React, Angular, and Vue.js.
Some of the key advantages for using JSS for Next.js compared to other framework-specific SDKs are:
-
Development and production runtime parity, including server-side rendering (SSR) during development.
-
Fewer application modes and deployment requirements.
-
SSR in production or integrating Sitecore tracking does not require the headless SSR proxy.
-
Simpler integration with advanced Sitecore content and layout editors without the need to deploy your application bundle to the Content Management instance.
Features supported by JSS for Next.js
JSS for Next.js supports the following features:
-
Next.js static HTML export, incremental static site generation, server-side rendering, and hybrid rendering.
-
Dynamic author-defined URLs through the Next.js file-based router and the Sitecore Layout Service.
-
Dynamic component rendering based on author-defined page layouts.
-
Helper components for rendering various Sitecore field types.
-
Integration with advanced Sitecore content and layout editors through Next.js Preview Mode.
-
Next.js client-side routing support for Sitecore link and rich text fields.
-
Internationalization support through Sitecore language versions and Next.js internationalized routing.
-
Component-level data fetching for Sitecore-driven components.
-
Sitecore analytics and personalization support. This features requires you SSR the Next.js app and use the Sitecore Layout Service REST API.
-
Support for JSS code-first workflow and mock Sitecore services.
-
A TypeScript-enabled app sample demonstrating common use cases.
-
Other built-in Next.js features like component-level CSS, code splitting, fast refresh, and more.
-
Apps compatible with Vercel deployment.