---
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/215/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. Select the add-ons you might need in your application, such as `nextjs-personalize`. `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 SitecoreAI instance.

Furthermore, 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 environment:

- A SitecoreAI instance: follow the [walkthrough to connect your application directly to Experience Edge](https://doc.sitecore.com/sai/en/developers/jss/215/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).