Key Differences Between Sitecore JSS and Content SDK
Sitecore has released the production-ready version of the Content SDK for XM Cloud, Content SDK 1.0. This modern, lightweight, and scalable foundation enables developers to build composable digital experiences on XM Cloud. The GitHub Starter Kit project based on JSS has been archived, and Sitecore now recommends that developers adapt to the Starter Kit project built on the Content SDK.
Before upgrading from JSS to Content SDK, it is crucial to understand the new features introduced in Content SDK 1.0, as well as the technical differences between Content SDK and Sitecore JSS.
Features of Content SDK
Unified Sitecore client - Content SDK introduces a unified Sitecore client to handle all Sitecore interactions, including Layout, Dictionary, Robots, Sitemap, Personalize, Editing, SiteInfo and Error services.
Unified configuration - centralized config files (sitecore.config.ts and sitecore.cli.config.ts) streamline both build-time and runtime behaviour.
Composable middleware - the new defineMiddleware utility introduces a modular, transparent approach to request handling.
Environment variable standardization - variables have been renamed for clarity and consistency.
Cleanup of Experience Editor Related Methods - Content SDK doesn't support the Experience Editor tool and, for that reason, doesn't include the chromes-based integration required by Experience Editor. Instead, all visual editing with Content SDK is done with the XM Cloud page builder using metadata integration.
Differences Between JSS and Content SDK
Most of the JSS scripts and folders have been replaced by centralized configuration files and new CLI commands in the Content SDK. Key build and scaffolding processes are now handled by sitecore.config.ts, sitecore.cli.config.ts.
sitecore-tools:build command is introduced to Generate build time artifacts.
Various custom plugins, config types, and service factories in the src/lib folder have been replaced or moved to new centralized functions and types within SitecoreClient and the Content SDK’s Next.js package.
All middleware is now defined in middleware.tsx and executed using the defineMiddleware utility function.
SitecoreContext Interface is replaced with the new Page interface in SitecoreClient.
The getServerSideProps and getStaticProps methods have been replaced by the new getComponentServerProps method.
All interface and class names that previously used the prefixes Rest or GraphQL have been updated to remove these prefixes.
Environment Variable Updates
| JSS | Content SDK |
| SITECORE_API_KEY | NEXT_PUBLIC_SITECORE_API_KEY |
| SITECORE_API_HOST | NEXT_PUBLIC_SITECORE_API_HOST |
| SITECORE_SITE_NAME | NEXT_PUBLIC_DEFAULT_SITE_NAME |
| DEFAULT_LANGUAGE | NEXT_PUBLIC_DEFAULT_LANGUAGE |
| JSS_EDITING_SECRET | SITECORE_EDITING_SECRET |
| SITECORE_EDGE_URL | NEXT_PUBLIC_SITECORE_EDGE_URL |
| SITECORE_EDGE_CONTEXT_ID | NEXT_PUBLIC_SITECORE_EDGE_CONTEXT_ID |
Interface Name Updates
| SitecoreContextProps | SitecoreProviderProps |
| SitecoreContextState | SitecoreProviderState |
| SitecoreContextReactContext | SitecoreProviderReactContext |
| WithSitecoreContextOptions | WithSitecoreOptions |
| WithSitecoreContextProps | WithSitecoreProps |
| WithSitecoreContextHocProps | WithSitecoreHocProps |
