# JSS for SitecoreAI 21.7+

> SitecoreAI documentation for developers, in English, version 21.7+.

- Product: SitecoreAI
- Audience: Developers
- Language: English
- Version: 21.7+
- Status: Previous version
- Canonical URL: https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai

## Overview

- [Introducing Sitecore JavaScript Services SDK](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/introducing-sitecore-javascript-services-sdk.md)
- [Features and capabilities of JSS](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/features-and-capabilities-of-jss.md)
- [Upgrade JSS 21.5 Next.js apps to version 21.6](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/upgrade-jss-21-5-next-js-apps-to-version-21-6.md)
- [Upgrade JSS 21.6.4 Next.js apps to version 21.7](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/upgrade-jss-21-6-4-next-js-apps-to-version-21-7.md)
- [Upgrade JSS 21.7 Next.js apps to version 21.10](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/upgrade-jss-21-7-next-js-apps-to-version-21-10.md)

## Architecture overview

- [Architecture overview](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/architecture-overview.md)
- [Sitecore editors and content management](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/sitecore-editors-and-content-management.md)
- [Route handling and data fetching](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/route-handling-and-data-fetching-in-jss-apps.md)
- [Multilingual applications](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/supporting-multilingual-applications-in-jss.md)

### Page composition in JSS apps using Sitecore data

- [Page composition in JSS apps using Sitecore data](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/page-composition-in-jss-apps-using-sitecore-data.md)
- [Dynamic placeholders](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/sitecoreai-dynamic-placeholders-and-jss.md)
- [Placeholders](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/placeholders-in-jss-apps.md)
- [Components](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/components-in-jss-apps.md)
- [Scaffolding components](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/scaffolding-components-in-jss-apps.md)
- [The Component Factory](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-component-factory.md)
- [Manually maintain the Component Factory](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/manually-maintain-the-component-factory.md)

### Services and APIs

- [Services and APIs](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-services-and-apis.md)
- [JSS App Configuration API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-app-configuration-api.md)
- [JSS Layout API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-layout-api.md)
- [Fetching layout data with the JSS Layout API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetching-layout-data-with-the-jss-layout-api.md)
- [Fetch layout data with the JSS GraphQL Layout Service](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetch-layout-data-with-the-jss-graphql-layout-service.md)
- [Fetch layout data with the JSS REST Layout Service](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetch-layout-data-with-the-jss-rest-layout-service.md)
- [Fetch layout data using a custom REST data fetcher](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetch-layout-data-using-a-custom-rest-data-fetcher.md)
- [Field values in JSS layout data](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/field-values-in-jss-layout-data.md)
- [Using a custom Layout Service configuration with JSS](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/using-a-custom-layout-service-configuration-with-jss.md)
- [JSS Dictionary API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-dictionary-api.md)
- [Fetching dictionary data with the JSS Dictionary API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetching-dictionary-data-with-the-jss-dictionary-api.md)
- [Fetch dictionary data with the JSS GraphQL Dictionary Service](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetch-dictionary-data-with-the-jss-graphql-dictionary-service.md)
- [Fetch dictionary data with the JSS REST Dictionary Service](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetch-dictionary-data-with-the-jss-rest-dictionary-service.md)
- [Fetch dictionary data using a custom REST data fetcher](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/fetch-dictionary-data-using-a-custom-rest-data-fetcher.md)
- [JSS GraphQL API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-graphql-api.md)
- [Best practices and recommendations for using GraphQL in JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/best-practices-and-recommendations-for-using-graphql-in-jss-apps.md)
- [Integrated GraphQL in JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/integrated-graphql-in-jss-apps.md)
- [JSS Media API](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-media-api.md)
- [Use images in JSS applications](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/use-images-in-jss-applications.md)
- [The image size parameters](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-image-size-parameters.md)

## More topics

- [JSS and Sitecore Experience Edge for Experience Manager (XM)](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-and-sitecore-experience-edge-for-experience-manager--xm-.md)
- [JavaScript frameworks and JSS](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/javascript-frameworks-and-jss.md)
- [The JSS app initializer](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-jss-app-initializer.md)
- [Create a JSS project for the latest versions of JSS and Sitecore](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/create-a-jss-project-for-the-latest-versions-of-jss-and-sitecore.md)

## Development workflow

- [Development workflow](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/development-workflow.md)
- [Add additional root placeholders in a Sitecore-first JSS sample app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/add-additional-root-placeholders-in-a-sitecore-first-jss-sample-app.md)

## Sitecore JSS CLI tools

- [Sitecore JSS CLI tools](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/sitecore-jss-cli-tools.md)
- [Install the JSS CLI globally](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/install-the-jss-cli-globally.md)
- [Env file support](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/env-file-support.md)
- [Sitecore JavaScript Rendering SDK scripts and commands reference](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/sitecore-javascript-rendering-sdk-scripts-and-commands-reference.md)

## More topics

- [Sitecore JavaScript Rendering SDK NPM packages](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/sitecore-javascript-rendering-sdk-npm-packages.md)
- [JSS development best practices](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-development-best-practices.md)
- [Debug logging in JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/debug-logging-in-jss-apps.md)
- [Theming and styling JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/theming-and-styling-jss-apps.md)
- [Create a Sitecore services client API key](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/create-a-sitecore-services-client-api-key.md)
- [Configure Sitecore CA certificates for Node.js](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/configure-sitecore-ca-certificates-for-node-js.md)
- [Optimizing the performance of JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/optimizing-the-performance-of-jss-apps.md)
- [JSS deployment best practices and security](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-deployment-best-practices-and-security.md)

## JavaScript Services SDK (JSS) for Next.js

- [JavaScript Services SDK (JSS) for Next.js](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/javascript-services-sdk--jss--for-next-js.md)
- [Sitecore JSS for Next.js differences from JSS for React, Angular, and Vue.js](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/sitecore-jss-for-next-js-differences-from-jss-for-react-angular-and-vue-js.md)
- [Next.js for SitecoreAI environment variables](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/next-js-for-sitecoreai-environment-variables.md)
- [Routing and page composition in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/routing-and-page-composition-in-jss-next-js-apps.md)
- [Error pages in the JSS Next.js sample app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/error-pages-in-the-jss-next-js-sample-app.md)
- [Secure cookies and local JSS app development](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/secure-cookies-and-local-jss-app-development.md)
- [Working with placeholders in a JSS Next.js app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/working-with-placeholders-in-a-jss-next-js-app.md)
- [Create a new component in a JSS Next.js app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/create-a-new-component-in-a-jss-next-js-app.md)
- [Scaffold and auto-register your own components in a Next.JS app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/scaffold-and-auto-register-your-own-components-in-a-next-js-app.md)
- [API reference](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/api-reference.md)
- [Troubleshooting JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/troubleshooting-jss-next-js-apps.md)

### Getting started with JSS for Next.js development

- [Getting started with JSS for Next.js development](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/getting-started-with-jss-for-next-js-development.md)
- [Walkthrough: Creating a JSS Next.js application with the JSS initializer](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/walkthrough--creating-a-jss-next-js-application-with-the-jss-initializer.md)
- [Walkthrough: Connecting the Next.js application directly to the Experience Edge endpoint](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/walkthrough--connecting-the-next-js-application-directly-to-the-experience-edge-endpoint.md)
- [Disable Next.js telemetry](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/disable-next-js-telemetry.md)

### Add-ons for Next.js applications

- [Add-ons for Next.js applications](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/add-ons-for-next-js-applications.md)
- [The Next.js Multisite add-on](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-next-js-multisite-add-on.md)
- [Manually configure the sites in a multisite application](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/manually-configure-the-sites-in-a-multisite-application.md)
- [Troubleshooting the Next.js Multisite add-on](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/troubleshooting-the-next-js-multisite-add-on.md)
- [The JSS XM Cloud add-on for Next.js](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-jss-xm-cloud-add-on-for-next-js.md)
- [Personalization in JSS Next.js applications](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/personalization-in-jss-next-js-applications.md)
- [Configure personalization in a Next.js JSS app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/configure-personalization-in-a-next-js-jss-app.md)
- [Troubleshooting personalization and tracking events](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/troubleshooting-personalization-and-tracking-events.md)

### Architecture and APIs for integrating JSS Next.js apps with Sitecore editors

- [Architecture and APIs for integrating JSS Next.js apps with Sitecore editors](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/architecture-and-apis-for-integrating-jss-next-js-apps-with-sitecore-editors.md)
- [Override default protocols using the EditingRenderMiddleware in Next.js JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/override-default-protocols-using-the-editingrendermiddleware-in-next-js-jss-apps.md)
- [Override the default directory used by the disk-based editing cache implementation](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/override-the-default-directory-used-by-the-disk-based-editing-cache-implementation.md)

### Prerendering methods and data fetching strategies in JSS Next.js apps

- [Prerendering methods and data fetching strategies in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/prerendering-methods-and-data-fetching-strategies-in-jss-next-js-apps.md)
- [Preparing the list of pages for static generation in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/preparing-the-list-of-pages-for-static-generation-in-jss-next-js-apps.md)
- [Customize build-time static paths in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/customize-build-time-static-paths-in-jss-next-js-apps.md)
- [Component-level data fetching in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/component-level-data-fetching-in-jss-next-js-apps.md)
- [Switch the pre-rendering method in a JSS Next.js app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/switch-the-pre-rendering-method-in-a-jss-next-js-app.md)
- [Switch between REST and GraphQL in Next.js JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/switch-between-rest-and-graphql-in-next-js-jss-apps.md)

### Using GraphQL in JSS Next.js apps

- [Using GraphQL in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/using-graphql-in-jss-next-js-apps.md)
- [Introspecting the GraphQL schema in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/introspecting-the-graphql-schema-in-jss-next-js-apps.md)
- [Use GraphQL to fetch component-level data in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/use-graphql-to-fetch-component-level-data-in-jss-next-js-apps.md)
- [Use retry strategies for requests to Experience Edge](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/use-retry-strategies-for-requests-to-experience-edge.md)

### Components provided by JSS for Next.js

- [Components provided by JSS for Next.js](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/components-provided-by-jss-for-next-js.md)
- [JSS components for rendering Sitecore fields in Next.js applications](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/jss-components-for-rendering-sitecore-fields-in-next-js-applications.md)
- [The JSS NextImage component](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-jss-nextimage-component.md)
- [Configuring the JSS NextImage component](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/configuring-the-jss-nextimage-component.md)
- [The FEaaSComponent and FEaaSWrapper components](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-feaascomponent-and-feaaswrapper-components.md)
- [Walkthrough: Registering an external React component](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/walkthrough--registering-an-external-react-component.md)
- [The registerComponent method](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/the-registercomponent-method.md)

### Internationalization in the JSS sample app for Next.js

- [Internationalization in the JSS sample app for Next.js](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/internationalization-in-the-jss-sample-app-for-next-js.md)
- [Internationalized routing in JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/internationalized-routing-in-jss-next-js-apps.md)
- [Remove content translation functionality from the JSS Next.js app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/remove-content-translation-functionality-from-the-jss-next-js-app.md)
- [Add or import languages in a JSS Next.js app](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/add-or-import-languages-in-a-jss-next-js-app.md)

### Deployment options for JSS Next.js apps

- [Deployment options for JSS Next.js apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/deployment-options-for-jss-next-js-apps.md)
- [Deploy your front-end application to Netlify](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/deploy-your-front-end-application-to-netlify.md)
- [Deploy your front-end application to Vercel](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/deploy-your-front-end-application-to-vercel.md)
- [Use the Vercel Deployment Protection feature with JSS apps](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/use-the-vercel-deployment-protection-feature-with-jss-apps.md)
- [Use an out-of-process editing data cache with Vercel deployments](https://doc.sitecore.com/sai/en/developers/jss/217/jss-sai/use-an-out-of-process-editing-data-cache-with-vercel-deployments.md)

## Optional

- [Version 22.x](https://doc.sitecore.com/sai/en/developers/jss/22/jss-sai/llms.txt): Current.
- [Version 21.6](https://doc.sitecore.com/sai/en/developers/jss/216/jss-sai/llms.txt): Previous version.
- [Version 21.5](https://doc.sitecore.com/sai/en/developers/jss/215/jss-sai/llms.txt): Previous version.