Create a Sanity project

Sanity is a platform for creating and working with structured content. Your content is stored in the cloud and can be distributed anywhere, for example on a website or in an app.

This step will help you create a Sanity project.

Protip

👉 Look for the pointing finger emoji to quickly locate the actionable steps in the guide if you prefer more action and less explanation.

Step 1: Install Sanity Studio

You start by setting up your content editing environment. It’s called Sanity Studio, and you can configure and customize it with JavaScript. It runs in the browser. To develop locally, we need to run a development server so you can see your changes instantly.

Gotcha

To install Sanity Studio you'll first need to have node and npm installed.

How to install node and npm?

👉 To get started, run this in your command line:

npm create sanity@latest -- --template clean --create-project "Sanity Project" --dataset production

Trouble installing?

This will take you through a setup process by guiding you through the following steps:

1. 👉 Create an account. Select a login provider from the list of options, and confirm with Enter. After creating an account in the browser, come back to the command line window.
2. 👉 Choose an output path. Press Enter to accept the default path, or change it to fit your needs first.
3. 👉 Wait a bit for the installation process to complete. When you get a Success! message, you're good to move on to the next step!! 🎉

Step 2: Run the Studio locally

Having installed the studio in the previous step, it’s time to start it up and run it in your browser!

👉 Enter the Studio's directory:

If you chose a custom output path, remember to change it respectively.

cd sanity-project

👉 Run this command within the Studio's folder:

npm run dev

This will build the studio application and start a local development server so you can run the app in your browser. Once the build is complete, you can head over to http://localhost:3333.

You should now see the Sanity Studio running in your browser!

As you modify and save the code, the server will automatically rebuild the studio and refresh the browser.

You can stop your development server by pressing Ctrl-C in the terminal where the server is running.

Summary

At this point, we've set up the following:

• Sanity account – you need it to access your projects.
• Sanity project – a place for your content represented as documents, stored by Sanity in the cloud. A single Sanity account can have an unlimited number of Sanity projects.
• Sanity Studio – a React app to edit and publish content. Connected to a Sanity project via APIs. For now, it is installed on your computer. In the next steps, we'll cover how to deploy it to the web and share it with others.