Getting Started with Sitecore Content SDK for XM Cloud

 


Sitecore has announced the release of the Content SDK. The Content SDK helps developers integrate XM Cloud content with their front-end applications. It is set to replace the existing JSS SDK for XM Cloud. This new Content SDK will exclusively support XM Cloud, providing a cleaner and more streamlined solution.

In this blog, I’ll discuss the key features of the Content SDK, how to install it locally, and how to connect it with an XM Cloud instance for local development.


Key Features

  • Starter Template: Provides a ready-to-use Next.js template for fast project setup and seamless integration.

  • Framework-Specific Support: Leverages Next.js features like locale-based routing for multilingual sites, plus multiple rendering modes including SSR (server-side rendering) and SSG (static site generation).

  • GraphQL Utilities: Includes prebuilt queries to fetch content, layouts, site information, and dictionary data directly from Sitecore APIs.

  • Multi-Site Capabilities: Supports running and managing multiple independent websites from a single environment.

  • Personalization & Testing: Enables audience-based personalization and A/B/n component testing without custom code, making it simple to deliver tailored experiences and run experiments across visitor segments.

  • Analytics Integration: Offers built-in analytics and event tracking through the Sitecore Cloud SDK.

  • XM Cloud Pages Integration: Works seamlessly with XM Cloud Pages for visual authoring, component editing, and experience testing.

Prerequisites

  • Access to an XM Cloud instance.

  • Ensure you have the latest version of Node.js installed on your machine. It’s recommended to use the latest Long-Term Support (LTS) version.

  • A suitable IDE, such as Visual Studio Code.

Getting Started with Content SDK Installation

  1. Create a folder where you want to install the Content SDK.

    • For example: create a folder named Content SDK POC.

    • Open your terminal and execute the following command:
      npx @sitecore-content-sdk/create-sitecore-jss nextjs


  2. If prompted to install the create-sitecore-jss package, type Y to confirm.


  3. When asked, provide the folder path for your new app. You’ll also be asked to choose a rendering strategy between SSG (Static Site Generation) and SSR (Server-Side Rendering).


  4. Installed Successfully. 


Install Content SDK CLI

The Content SDK CLI provides various commands to work with Content SDK applications. By installing this tool globally, you can use these commands while developing any Content SDK applications on your local machine, such as when creating new components.

To install, run:

npm install -g @sitecore-content-sdk/cli



Once installed, the following folder structure will be generated on your file system.



Connecting to an XM Cloud Instance

To connect the app to the XM Cloud instance:

  1. Retrieve the required environment variables from the deployment portal.

  2. Create a .env.local file in the root folder of your newly created app.

  3. Add the environment variables into the .env.local file.


After setting up the environment variables, open a terminal, navigate to the Content SDK app’s folder, and run the following commands:

npm install

npm run start

Conclusion

The Sitecore Content SDK for XM Cloud offers a streamlined way to bring XM Cloud content into modern front-end applications. With its Next.js starter template, GraphQL utilities, CLI support, and seamless integration with XM Cloud Pages, it empowers developers to deliver scalable, personalized, and high-performing digital experiences. Whether using static generation or server-side rendering, the Content SDK provides a strong foundation to accelerate your headless Sitecore development journey.

References

Location: Kolkata, West Bengal, India

Comments

Post a Comment

Popular posts from this blog

Setup New Project in Sitecore XMCloud – Part 1

Image
In my previous blog , I discussed about the XMCloud Introduction and features of XMCloud. In this blog I will show, how to create a new Project and environments in the Sitecore XM cloud. In the next blog, I will show how easily you can set up your local app development for XM Cloud and run the Sitecore XM Cloud project on your development machine. Prerequisites: • You must have one Organization account in Sitecore portal ( https://portal.sitecorecloud.io/ ) which has access to XMCloud.  And your account should be associated with that Organization account with admin access.  • Organization must have proper Sitecore licensing to run the XMCloud site in local docker environments. • Create your own Github account to link with XMCloud project. Steps to setup your project 1. Click on “Manage My projects” menu to open https://deploy.sitecorecloud.io/projects.io/projects site to Create a new project or manage existing one. 2. Then click on “Create New Project” button to cr...
Read more

Step by Step installation of Sitecore 10.3 on Azure PaaS

Image
  In this document we will learn how to setup Sitecore 10.3 XP on Azure PaaS. We shall briefly cover the step by step process and overview of Sitecore 10.3 XP setup. While doing the installation, I follow Deploying a new Sitecore environment to the Microsoft Azure App service . Thanks, Sitecore Team! Prerequisites: To setup Sitecore 10.3 on Azure PaaS, we shall need the following: Check PowerShellGet Module. If not found please install PowerShell Gallery Install the Azure Az PowerShell module. Download Sitecore Azure Toolkit 2.8.0 . This will provide a zip file that can be extracted and used for setup.  Deployment Topologies We will do the setup for Sitecore 10.3 XP. Sitecore XP product edition is the full Sitecore Experience Platform, which includes all Sitecore roles and services, including xConnect. This is a Sitecore Experience Platform configuration that runs: Three Sitecore roles: Content Delivery, Content Management, and Processing, as a single WebA...
Read more

Step by Step installation of Sitecore 10.3 on Docker

Image
  In this document, we will learn how to setup Sitecore 10.3 on docker desktop in Windows 11. We shall briefly cover the step-by-step process and overview of Sitecore 10.3 setup. While doing the installation in my windows, I followed Installation Guide for Developer Workstation with Containers . Thanks, Sitecore Team! Prerequisites - To setup Sitecore 10.3 on docker, we shall need the following - Docker Desktop Installed on Windows Desktop Docker Desktop support for windows containers 16 GB of RAM Approximately 50GB of free disk space for Sitecore container images. SSD storage is highly recommended. The default Sitecore container configuration uses specific ports. To avoid any conflicts, we should ensure the following ports are not being used by another process: 443, 8079, 8081, 8984, and 14330 To check the prerequisites for Sitecore 10.3 installation, please check the below link - Support Information - Sitecore compatibility table for Sitecore XP 9.0 and later Setup Files - Docker...
Read more