---
title: "Walkthrough: Creating a JSS Next.js application with the JSS initializer"
slug: "walkthrough--creating-a-jss-next-js-application-with-the-jss-initializer"
abstract: "Get started with developing a Next.js app with JSS capabilities for front-end development."
---
# Walkthrough: Creating a JSS Next.js application with the JSS initializer

If you are a front-end/JavaScript developer, who doesn't need to customize the CMS functionality or you use an operating system other than Windows, you can scaffold a JSS Next.js app quickly with the [JSS app initializer](https://doc.sitecore.com/sai/en/developers/jss/216/jss-sai/the-jss-app-initializer.html "The JSS app initializer").

Use this application to connect directly to your SitecoreAI environment and start developing your front-end solution immediately.

> [!note]
> **Before you begin**
> -   You must have a running SitecoreAI instance.

This walkthrough describes how to:

- Create a JSS Next.js application.
- Integrate your app with SitecoreAI.

## Create a JSS Next.js application

To create a JSS application based on the Next.js template:

1. In a console, run the following command:

    ```shell
    npx create-sitecore-jss nextjs
    ```

2. If prompted to install the `create-sitecore-jss@<latest-version>` package, answer *y*.
3. Enter the folder path for the JSS 21.6 Next.js app. For example, *./my-first-jss-app* to create the app folder in your current working directory.
4. For the data fetching strategy, select `GraphQL`.
5. For the rendering strategy, choose `SSG` or `SSR` , depending on your needs.
6. To connect to your SitecoreAI environment, you must install the XM Cloud add-on. When asked if you are building for Sitecore XM Cloud, answer *y* to install the XM Cloud add-on.

    > [!note]
    > **XM Cloud is now SitecoreAI**
    > Some code examples, images, and UI labels may still use XM Cloud while engineering assets are being updated.

7. Select the add-ons you might need in your application- `nextjs-sxa` and/or `nextjs-multisite` and press Enter.

The command creates the JSS Next.js application for the latest version of JSS and installs the necessary packages.

## Integrate your app with SitecoreAI

Developing a front-end application for SitecoreAI requires a running XM instance. The instance can run in the cloud or locally.

You must connect your application to that instance's environment to bootstrap your integration configurations and fetch content and layout data.

To connect your application to:

- A SitecoreAI instance: follow the [walkthrough to connect your application directly to Experience Edge](https://doc.sitecore.com/sai/en/developers/jss/216/jss-sai/walkthrough--connecting-the-next-js-application-directly-to-the-experience-edge-endpoint.html "Walkthrough: Connecting the Next.js application directly to the Experience Edge endpoint").
- A local XM instance: configure the editing host if you plan on deploying items, components, and templates to the instance. You can also [connect SitecoreAI Pages to your local SitecoreAI instance](https://doc.sitecore.com/xmc/en/developers/xm-cloud/en/connect-sitecoreai-page-builder-to-your-local-xm-instance.html).