# Content SDK > SitecoreAI documentation for developers, in English, version 2.x. - Product: SitecoreAI - Audience: Developers - Language: English - Version: 2.x - Status: Current - Canonical URL: https://doc.sitecore.com/sai/en/developers/content-sdk/20 ## Overview - [Content SDK for SitecoreAI](https://doc.sitecore.com/sai/en/developers/content-sdk/20/sitecore-content-sdk-for-sitecoreai.md): What the Sitecore Content SDK is, what it is used for, and an overview of its main features. ## Getting started - [Prerequisites](https://doc.sitecore.com/sai/en/developers/content-sdk/20/prerequisites.md) - [Install the Content SDK CLI](https://doc.sitecore.com/sai/en/developers/content-sdk/20/install-the-content-sdk-cli.md): How to install the Content SDK command line interface (CLI) and verify the installation is successful. - [Connect your app to SitecoreAI](https://doc.sitecore.com/sai/en/developers/content-sdk/20/connect-your-content-sdk-app-to-sitecoreai.md) ### Creating a Content SDK app - [Creating a Content SDK app](https://doc.sitecore.com/sai/en/developers/content-sdk/20/creating-a-content-sdk-app.md) - [Create a Content SDK app locally](https://doc.sitecore.com/sai/en/developers/content-sdk/20/create-a-content-sdk-app-locally.md): Create a Content SDK app locally. - [Content SDK initializer parameters](https://doc.sitecore.com/sai/en/developers/content-sdk/20/content-sdk-initializer-parameters.md) ## Concepts - [Architecture overview](https://doc.sitecore.com/sai/en/developers/content-sdk/20/architecture-overview.md): Overview of Sitecore Content SDK architecture. - [Components for rendering Sitecore fields](https://doc.sitecore.com/sai/en/developers/content-sdk/20/components-for-rendering-sitecore-fields.md): Describes Content SDK components for React that help you render Sitecore fields in Next.js applications. - [Route handling and data fetching](https://doc.sitecore.com/sai/en/developers/content-sdk/20/route-handling-and-data-fetching-in-content-sdk-apps.md): Content SDK apps in SitecoreAI resolve routes using the content tree structure and fetch data via GraphQL from the LayoutService. Next.js apps use catch-all routes and custom resolvers to map paths to Sitecore items. - [Multilingual applications](https://doc.sitecore.com/sai/en/developers/content-sdk/20/supporting-multilingual-applications-in-content-sdk.md): Overview of how Content SDK apps handle multilingual content and dictionaries. - [Plugins](https://doc.sitecore.com/sai/en/developers/content-sdk/20/plugins.md): Learn about plugins that extend the Content SDK with specific functionality. - [Adapters](https://doc.sitecore.com/sai/en/developers/content-sdk/20/adapters.md): Learn about adapters that provide environment-specific implementations for plugins. - [Lightweight tracking](https://doc.sitecore.com/sai/en/developers/content-sdk/20/lightweight-tracking.md): How Content SDK identifies bots and supports lightweight tracking. ### Page composition - [Page composition](https://doc.sitecore.com/sai/en/developers/content-sdk/20/page-composition-in-content-sdk-apps-using-sitecoreai-data.md): Understand how Content SDK composes layouts and renders pages defined in SitecoreAI. - [Placeholders](https://doc.sitecore.com/sai/en/developers/content-sdk/20/placeholders-in-content-sdk-apps.md): Placeholders in Content SDK apps, and best practices for naming them. - [React Suspense in placeholders](https://doc.sitecore.com/sai/en/developers/content-sdk/20/react-suspense-in-placeholders.md): How disabling React Suspense by default in placeholders led to reduced JavaScript execution time. - [Dynamic placeholders](https://doc.sitecore.com/sai/en/developers/content-sdk/20/sitecoreai-dynamic-placeholders-and-content-sdk.md): Overview of how Content SDK handles SitecoreAI dynamic placeholders. - [Components](https://doc.sitecore.com/sai/en/developers/content-sdk/20/components-in-content-sdk-apps.md): Describes components in Content SDK apps and the infrastructure that supports them. ### Services and APIs - [Services and APIs](https://doc.sitecore.com/sai/en/developers/content-sdk/20/content-sdk-services-and-apis.md): Overview of the services and APIs available in Sitecore Content SDK packages and applications, with links to information about specific items. - [GraphQL API](https://doc.sitecore.com/sai/en/developers/content-sdk/20/content-sdk-graphql-api.md): The GraphQL API hosts your SitecoreAI data (such as layout and dictionary data) and lets you fetch it using GraphQL queries. - [The SitecoreClient API](https://doc.sitecore.com/sai/en/developers/content-sdk/20/the-sitecoreclient-api.md): Overview of the SitecoreClient API class used to interact with SitecoreAI headless services. - [Customize SitecoreClient](https://doc.sitecore.com/sai/en/developers/content-sdk/20/customize-sitecoreclient.md): The behavior of the SitecoreClient API can be customized in various ways. This includes modifying fetch options, overriding methods, and more. - [Layout data for fields](https://doc.sitecore.com/sai/en/developers/content-sdk/20/sitecoreai-layout-data-for-fields.md): Fetched layout data for SitecoreAI fields contains field values and field metadata to support rendering and editing those fields, respectively. - [Use retry strategies for requests to Experience Edge](https://doc.sitecore.com/sai/en/developers/content-sdk/20/use-retry-strategies-for-requests-to-experience-edge.md): Using a retry strategy can help prevent excessive calls to the rate-limited Experience Edge GraphQL endpoint. - [Media API](https://doc.sitecore.com/sai/en/developers/content-sdk/20/content-sdk-media-api.md): The Media API supports images in Content SDK applications, including media handling for Image and NextImage components. - [Image parameters](https://doc.sitecore.com/sai/en/developers/content-sdk/20/image-parameters-in-content-sdk-apps.md): Use parameters to resize or configure images rendered by Content SDK Image and NextImage components. - [The Image component](https://doc.sitecore.com/sai/en/developers/content-sdk/20/the-content-sdk-image-component.md): How to implement Image components in your Content SDK app. - [The NextImage component](https://doc.sitecore.com/sai/en/developers/content-sdk/20/the-content-sdk-nextimage-component.md): How to implement NextImage components in your Next.js Content SDK app. - [Search API](https://doc.sitecore.com/sai/en/developers/content-sdk/20/search-api.md): Overview of the SearchService class used to search for content in SitecoreAI indexes. - [Search hooks for React and Next.js](https://doc.sitecore.com/sai/en/developers/content-sdk/20/search-hooks-for-react-and-next-js.md): Learn more about the Search hooks available for Content SDK's React and Next.js packages that enable searching with pagination and infinite scrolling. - [useSearch](https://doc.sitecore.com/sai/en/developers/content-sdk/20/usesearch.md): Learn about the useSearch hook that enables searching with pagination. - [useInfiniteSearch](https://doc.sitecore.com/sai/en/developers/content-sdk/20/useinfinitesearch.md): Learn about the useInfiniteSearch hook that enables searching with infinite scrolling. - [useSuggest](https://doc.sitecore.com/sai/en/developers/content-sdk/20/usesuggest.md): Learn about the useSuggest hook that provides typeahead suggestions and preview results. ## Developer guides - [The Sitecore configuration file](https://doc.sitecore.com/sai/en/developers/content-sdk/20/the-sitecore-configuration-file.md): Content SDK apps include a standard config file with various mandatory properties that you can modify as needed. You can also add optional properties to control aspects of your app's behaviour, including how it interacts with services and middleware. - [CLI commands and configuration](https://doc.sitecore.com/sai/en/developers/content-sdk/20/cli-commands-and-configuration.md): Overview of the Content SDK command-line interface (CLI), including supported commands and how you can configure its behaviour. - [Register a component](https://doc.sitecore.com/sai/en/developers/content-sdk/20/register-a-component-in-the-component-map.md): Learn how automatic component map generation works and how to manually register a component in the component map if required. - [Editor integration using metadata](https://doc.sitecore.com/sai/en/developers/content-sdk/20/editor-integration-using-metadata.md): Overview of the architecture and APIs for integrating Content SDK Next.js Pages Router apps with the Page builder using metadata. - [Integrate custom proxy](https://doc.sitecore.com/sai/en/developers/content-sdk/20/integrate-custom-proxy.md) - [Implement GraphQL code generation](https://doc.sitecore.com/sai/en/developers/content-sdk/20/implement-graphql-code-generation.md): Add GraphQL code generation to your Content SDK application using an example based on graphql-codegen. - [Integrated GraphQL](https://doc.sitecore.com/sai/en/developers/content-sdk/20/integrated-graphql-in-content-sdk-apps.md): Modify the Layout service output for a component using GraphQL queries. - [GraphQL best practices](https://doc.sitecore.com/sai/en/developers/content-sdk/20/graphql-best-practices-in-content-sdk-apps.md): Tips and best practices for using GraphQL in front-end apps. - [Example environment variable files](https://doc.sitecore.com/sai/en/developers/content-sdk/20/example-environment-variable-files.md): Content SDK includes example environment variable files to help you configure your application according to whether you will use a remote SitecoreAI instance or a Docker container when running the application locally. - [Debug logging in Content SDK apps](https://doc.sitecore.com/sai/en/developers/content-sdk/20/debug-logging-in-content-sdk-apps.md): Use Content SDK debug logging to enhance your developer experience with production debugging for some or all of your application. - [Generate page metadata and Open Graph tags](https://doc.sitecore.com/sai/en/developers/content-sdk/20/generate-page-metadata-and-open-graph-tags.md): Learn how to generate , metadata, and Open Graph tags for a page from Sitecore route fields, in both App Router and Pages Router Content SDK Next.js apps. - [Configure llms.txt support](https://doc.sitecore.com/sai/en/developers/content-sdk/20/configure-llms-txt-support.md): Learn how to serve llms.txt content managed via SitecoreAI in a Content SDK Next.js app, using an API Route Handler (App Router) or middleware (Pages Router). - [Editing and preview render optimization](https://doc.sitecore.com/sai/en/developers/content-sdk/20/editing-and-preview-render-optimization.md): The EditingRenderMiddleware offers better performance by directly returning HTML via server-side requests, eliminating preview redirection. - [Update ESLint to version 9](https://doc.sitecore.com/sai/en/developers/content-sdk/20/update-eslint-to-version-9.md): How to update to ESLint version 9 for clearer and more maintainable linting configurations. - [AI-powered Content SDK development](https://doc.sitecore.com/sai/en/developers/content-sdk/20/ai-powered-content-sdk-development.md): Use AI-powered recommendations to streamline Content SDK development by enforcing best practices, improving consistency, and accelerating productivity. - [Understanding import maps](https://doc.sitecore.com/sai/en/developers/content-sdk/20/understanding-import-maps.md): How import maps help in enabling the code generation feature of the Design studio. - [Understanding code extraction in the Design studio](https://doc.sitecore.com/sai/en/developers/content-sdk/20/understanding-code-extraction-in-the-design-studio.md): How code extraction helps in providing accurate and context-aware code suggestions when using code generation in the Design studio. - [Initializing tracking, events, and personalization in the Content SDK](https://doc.sitecore.com/sai/en/developers/content-sdk/20/initializing-tracking-events-and-personalization-in-the-content-sdk.md): How Content SDK implements tracking, events, and personalization through the use of plugins and adapters. - [Using custom query parameters in editing render handlers](https://doc.sitecore.com/sai/en/developers/content-sdk/20/using-custom-query-parameters-in-editing-render-handlers.md): How to use the allowedQueryParams configuration option to set custom query parameters in editing render handlers. - [Implement wildcard routing](https://doc.sitecore.com/sai/en/developers/content-sdk/20/implement-wildcard-routing.md): How to use wildcard routing to support large numbers of dynamic URLs without creating a Sitecore item for each one. - [Running a Content SDK app behind a corporate proxy](https://doc.sitecore.com/sai/en/developers/content-sdk/20/running-a-content-sdk-app-behind-a-corporate-proxy.md): How to run a Content SDK app behind a corporate proxy. - [Using the proxy execution context](https://doc.sitecore.com/sai/en/developers/content-sdk/20/using-the-proxy-execution-context.md): How to inspect the execution result of each proxy in your Next.js middleware. ### Component-level data fetching in Next.js apps - [Component-level data fetching in Next.js apps](https://doc.sitecore.com/sai/en/developers/content-sdk/20/component-level-data-fetching-in-next-js-apps.md): Overview of how Content SDK Next.js apps retrieve component-level data and how it can be accessed. - [Enable component-level data fetching for error pages in Next.js apps](https://doc.sitecore.com/sai/en/developers/content-sdk/20/enable-component-level-data-fetching-for-error-pages-in-next-js-apps.md): How to enable component-level data fetching for error pages in Next.js apps. - [Use GraphQL to fetch component-level data in a Next.js app](https://doc.sitecore.com/sai/en/developers/content-sdk/20/use-graphql-to-fetch-component-level-data-in-a-next-js-content-sdk-app.md): How to use server-side GraphQL queries to fetch component-level data in a Next.js Content SDK app. ### App Router - [App Router](https://doc.sitecore.com/sai/en/developers/content-sdk/20/getting-started-with-next-js-app-router-using-content-sdk.md): Content SDK 1.2.0 introduces support for the Next.js App Router, enabling React Server Components, server functions, and more. - [Use AppPlaceholder to render server and client components](https://doc.sitecore.com/sai/en/developers/content-sdk/20/use-appplaceholder-to-render-server-and-client-components.md): Learn how to use Content SDK's AppPlaceholder in the Next.js App Router template to render server and client components consistently, improve context access, and handle client-only error components. - [Manage component maps for client and server components](https://doc.sitecore.com/sai/en/developers/content-sdk/20/manage-component-maps-for-client-and-server-components.md): Learn how the Sitecore Content SDK generates dual component maps in the Next.js App Router to separate server and client components, prevent server code in browser bundles, and optimize performance. - [Configure robots.txt using a Route Handler](https://doc.sitecore.com/sai/en/developers/content-sdk/20/configure-robots-txt-using-a-route-handler.md): Learn how to configure and serve robots.txt in a Content SDK Next.js App Router template, including caching controls and multisite host resolution. - [Configure sitemap.xml using a Route Handler](https://doc.sitecore.com/sai/en/developers/content-sdk/20/configure-sitemap-xml-using-a-route-handler.md): Learn how to configure and serve sitemap.xml (single or index) in a Content SDK Next.js App Router template, including caching controls and multisite host resolution. - [Internationalization using next-intl](https://doc.sitecore.com/sai/en/developers/content-sdk/20/internationalization-using-next-intl.md): Implement multilingual localization in Sitecore Content SDK Next.js App Router apps using next-intl for locale-aware routing, multisite dictionaries, and SSG. - [Disable multisite and locale proxies](https://doc.sitecore.com/sai/en/developers/content-sdk/20/disable-multisite-and-locale-proxies.md) - [Enable Cache Components](https://doc.sitecore.com/sai/en/developers/content-sdk/20/enable-cache-components.md) - [Using the page prop vs the useSitecore() hook](https://doc.sitecore.com/sai/en/developers/content-sdk/20/using-the-page-prop-vs-the-usesitecore---hook.md): How Sitecore context data is primarily accessed via the page prop passed into components instead of the useSitecore() hook in Content SDK Next.js App Router apps. - [On-demand static revalidation for App Router apps](https://doc.sitecore.com/sai/en/developers/content-sdk/20/on-demand-static-revalidation-for-app-router-apps.md): How on-demand static revalidation (OSR) allows published Sitecore content to refresh in your Next.js App Router application. ### Troubleshooting - [Troubleshooting](https://doc.sitecore.com/sai/en/developers/content-sdk/20/troubleshooting.md): Fix common errors in the console or terminal related to the Content SDK. - [Troubleshooting personalization and tracking events](https://doc.sitecore.com/sai/en/developers/content-sdk/20/troubleshooting-personalization-and-tracking-events.md): Troubleshoot personalization, page view tracking, and missing analytics data in Content SDK 2.x Next.js applications. ## Upgrade guides - [Upgrade Content SDK 1.5.1 Next.js apps to version 2.0](https://doc.sitecore.com/sai/en/developers/content-sdk/20/upgrade-content-sdk-1-5-1-next-js-apps-to-version-2-0.md): How to upgrade your Content SDK 1.5.1 Next.js apps to version 2.0.0 to get the latest features like Next.js 16, Node.js 24, tracking, events, personalization, and more. ## What's new - [What's new in Content SDK 2.1](https://doc.sitecore.com/sai/en/developers/content-sdk/20/what-s-new-in-content-sdk-2-1.md): Learn about the new improvements and features in Content SDK 2.1 and how to update your existing application to take advantage of them. - [What's new in Content SDK 2.2](https://doc.sitecore.com/sai/en/developers/content-sdk/20/what-s-new-in-content-sdk-2-2.md): Learn about the new improvements and features in Content SDK 2.2 and how to update your existing application to take advantage of them. - [What's new in Content SDK 2.3](https://doc.sitecore.com/sai/en/developers/content-sdk/20/what-s-new-in-content-sdk-2-3.md): Learn about the new improvements and features in Content SDK 2.3 and how to update your existing application to take advantage of them. - [What's new in Content SDK 2.4](https://doc.sitecore.com/sai/en/developers/content-sdk/20/what-s-new-in-content-sdk-2-4.md): Learn about the new improvements and features in Content SDK 2.4 and how to update your existing application to take advantage of them. ## Upgrade JSS Next.js apps to Content SDK - [Upgrade JSS Next.js apps to Content SDK](https://doc.sitecore.com/sai/en/developers/content-sdk/20/upgrade-jss-next-js-apps-to-content-sdk.md) - [Upgrade JSS 22.0 Next.js apps to Content SDK 2.1](https://doc.sitecore.com/sai/en/developers/content-sdk/20/upgrade-jss-22-0-next-js-apps-to-content-sdk-2-1.md): How to upgrade your JSS 22.0 Next.js apps to Content SDK 2.1. ## More topics - [Release notes](https://doc.sitecore.com/sai/en/developers/content-sdk/20/release-notes.md): Release notes for Content SDK packages. - [Glossary](https://doc.sitecore.com/sai/en/developers/content-sdk/20/content-sdk-glossary.md): This glossary defines key terms used across the Content SDK. ## Optional - [Full publication as Markdown](https://doc.sitecore.com/sai/en/developers/content-sdk/20/llms-full.txt): Every article in this publication in a single file. - [Version 1.x](https://doc.sitecore.com/sai/en/developers/content-sdk/10/llms.txt): Previous version.