
How to Set Up Your First Sanity Project
To set up your first Sanity project, install Node.js 22.12 or later, run npm create sanity@latest in your terminal, log in or create a free account, then answer the prompts to name the project, accept the default production dataset, pick a template and choose TypeScript. When the CLI finishes, cd into the new folder and run npm run dev to open Sanity Studio at http://localhost:3333. From there you add a schema type, create your first document and query it with GROQ.
The whole process takes about ten minutes, and nothing in it costs money. This guide walks through each step in order: checking prerequisites, running the initializer, understanding each prompt, starting the Studio, adding a content type, creating content, querying it and connecting it to a front end. If you're not yet sure what Sanity is, read what is Sanity first.
Prerequisites
You need three things before you start:
- Node.js 22.12 or later: current Sanity Studio versions require it, and older versions fail with an error. Check with
node -v. - A package manager: npm comes with Node.js. pnpm, Yarn and Bun also work.
- A browser and a free account: you can sign up with Google, GitHub or email during setup.
node -v
v22.12.0
If your version is older, install the current LTS release from nodejs.org or use a version manager such as nvm or fnm.
Step 1: Run the Initializer
Open a terminal in the folder where you keep projects and run:
npm create sanity@latest
The equivalents for other package managers are:
pnpm create sanity@latest
yarn create sanity@latest
bun create sanity@latest
This downloads the latest Sanity CLI and runs sanity init. You don't need to install anything globally. The CLI has many more commands for later, which are covered in installing the Sanity CLI and essential commands.
Step 2: Answer the Setup Prompts
The CLI walks you through a series of questions. Here's what each one means and what to choose for a first project.
Log In or Create an Account
? Please log in or create a new account
❯ Google
GitHub
E-mail / password
Pick a provider. A browser window opens, you sign in, and the terminal continues automatically. If you already have an account, you'll skip this.
Create a Project
? Create a new project or select an existing one
❯ Create new project
Choose Create new project, then enter a name such as My First Blog. The name is only a label and can be changed later in the project settings at sanity.io/manage. If you belong to more than one organisation, you'll also be asked which one owns the project.
Choose the Dataset Configuration
? Use the default dataset configuration? (Y/n)
Answer Yes. This creates a dataset called production with public visibility. A dataset is a separate collection of content inside your project, and public means anyone with your project ID can read published documents through the API (drafts and private data still need a token). That's normal for website content. You can create more datasets, such as staging, later. The Content Lake explained post covers datasets in more detail.
Pick an Output Path
? Project output path: /Users/you/projects/my-first-blog
Accept the suggested folder or type another path. The CLI creates the folder for you.
Select a Template
? Select project template
❯ Clean project with no predefined schema types
Blog (schema)
E-commerce (Shopify)
Movie project (schema + sample data)
Page Builder (presets)
For learning, choose Clean project with no predefined schema types. You'll build the schema yourself, which is the best way to understand how Sanity works. The Blog template is a good reference to come back to, and the Movie project includes sample data if you want something to query immediately.
TypeScript and Package Manager
? Do you want to use TypeScript? (Y/n)
Answer Yes. Schema helpers like defineType and defineField give you autocompletion and type checking. Then choose your package manager, and the CLI installs dependencies.
Depending on your CLI version, you may also be asked about setting up AI editor integrations (MCP). These are optional and you can skip them for now.
Step 3: Start the Studio Locally
When the install finishes, move into the project and start the development server:
cd my-first-blog
npm run dev
Sanity Studio using vite@x.x.x ready in 1204ms and running at http://localhost:3333/
Open http://localhost:3333 and log in with the same provider you used in the terminal. With the clean template, the Studio shows an empty Structure tool because there are no document types yet. That's expected.
npm run dev runs sanity dev, which reloads the Studio whenever you save a file. To use another port, run npx sanity dev --port 3334.
Step 4: Look at What Was Created
The clean template gives you a small set of files:
my-first-blog/
├── node_modules/
├── schemaTypes/
│ └── index.ts
├── static/
├── .gitignore
├── package.json
├── sanity.cli.ts
├── sanity.config.ts
└── tsconfig.json
The two files you'll touch most are:
sanity.config.ts: configures the Studio, including the project ID, dataset, plugins and schema types.schemaTypes/index.ts: exports an array of schema types, which starts empty.
Your generated sanity.config.ts looks like this, with your own project ID:
import { defineConfig } from 'sanity'
import { structureTool } from 'sanity/structure'
import { visionTool } from '@sanity/vision'
import { schemaTypes } from './schemaTypes'
export default defineConfig({
name: 'default',
title: 'My First Blog',
projectId: 'abc123xy',
dataset: 'production',
plugins: [structureTool(), visionTool()],
schema: {
types: schemaTypes,
},
})
The project ID isn't a secret. It appears in every public API URL. For a full explanation of every file and folder, see Sanity project structure explained.
Step 5: Add Your First Schema Type
Create a file for a simple blog post type:
// schemaTypes/postType.ts
import { defineField, defineType } from 'sanity'
export const postType = defineType({
name: 'post',
title: 'Post',
type: 'document',
fields: [
defineField({
name: 'title',
type: 'string',
validation: (rule) => rule.required(),
}),
defineField({
name: 'slug',
type: 'slug',
options: { source: 'title' },
validation: (rule) => rule.required(),
}),
defineField({
name: 'publishedAt',
type: 'datetime',
initialValue: () => new Date().toISOString(),
}),
defineField({
name: 'body',
type: 'array',
of: [{ type: 'block' }],
}),
],
})
Then register it:
// schemaTypes/index.ts
import { postType } from './postType'
export const schemaTypes = [postType]
Save both files. The Studio reloads and a Post item appears in the left-hand list. Building schemas properly is a topic of its own, and creating your first Sanity schema goes further with references, images and previews.
Step 6: Create and Publish a Document
- Click Post in the Structure tool.
- Click the + (create) button to start a new document.
- Enter a title, then click Generate next to the slug field.
- Write a few paragraphs in the body field.
- Click Publish in the bottom-right corner.
While you type, Sanity saves a draft in real time, so there's no save button. Publishing copies the draft to the published version that your website reads. Try leaving the title empty and you'll see the validation rule block publishing.
Step 7: Query Your Content with Vision
The clean template includes the Vision tool, a GROQ playground inside the Studio. Click Vision in the top toolbar and run:
*[_type == "post"]{
_id,
title,
"slug": slug.current,
publishedAt
}
You'll get a JSON array with your published post:
[
{
"_id": "6f1c2c1e-3b0a-4d8a-9a7e-2f0d1c9b8a77",
"title": "Hello Sanity",
"slug": "hello-sanity",
"publishedAt": "2026-11-04T09:30:00.000Z"
}
]
This is exactly what your front end will receive. The Vision plugin guide explains parameters, perspectives and other options in the tool.
Step 8: Fetch Content from Code
To prove the API works outside the Studio, create a quick Node script in any folder:
npm install @sanity/client
// fetch-posts.mjs
import { createClient } from '@sanity/client'
const client = createClient({
projectId: 'abc123xy',
dataset: 'production',
apiVersion: '2026-10-01',
useCdn: true,
})
const posts = await client.fetch(
`*[_type == "post"] | order(publishedAt desc){ title, "slug": slug.current }`,
)
console.log(posts)
node fetch-posts.mjs
Because the dataset is public and the post is published, no token is needed. For a Next.js App Router site, use next-sanity instead, which wraps the same client with caching helpers.
Allow Your Front End's Origin
Server-side code can query freely, but browsers need your site's origin in the project's CORS list. Add your local Next.js URL with the CLI:
npx sanity cors add http://localhost:3000
Answer No to allowing credentials unless that origin will host a Studio.
Step 9: Commit and Deploy
Initialise Git and commit the project. The generated .gitignore already excludes node_modules, dist and local env files.
git init
git add .
git commit -m "Initial Sanity Studio"
When you're ready to give editors access, deploy the Studio to a free *.sanity.studio URL:
npx sanity deploy
The CLI asks you to choose a hostname and then builds and uploads the Studio. The full process, including self-hosting and embedding in Next.js, is in how to deploy Sanity Studio.
Common Setup Problems
- "Unsupported Node.js version": upgrade to Node.js 22.12 or later and run the command again.
- Studio shows a login loop: make sure you're signing in with the same provider you used in the CLI, and that third-party cookies aren't blocked for
localhost. - CORS error in the browser: add the origin with
npx sanity cors add, including the correct port. - Empty query results: check you published the document. The default perspective for recent API versions returns published content only, so drafts won't appear without a token.
- Wrong project: check
projectIdanddatasetin bothsanity.config.tsandsanity.cli.ts.
FAQ: Setting Up Sanity
No. New projects start on the free plan, and you can create a project, deploy a Studio and use the API without entering payment details. You only need a card if you upgrade to a paid plan.
Choose the clean template if you want to learn how schemas work, because you'll build everything yourself. Choose the movie project template if you want sample content to explore queries straight away, or the blog template as a reference.
They run the same initializer. npm create sanity@latest downloads the latest CLI and starts setup in one step, while sanity init is the command you run when the CLI is already available, such as inside an existing Next.js project.
Yes. Run npx sanity@latest init inside the Next.js project. The CLI detects the framework and can add config files, append environment variables to your env file and embed the Studio as a route.
Public is fine for website content, because only published documents are readable without a token. Use a private dataset for content that shouldn't be readable without authentication. Private datasets require a paid plan.
Sanity Studio runs on port 3333 by default. You can change it with the port flag, for example npx sanity dev --port 3334, or set it in the server options of sanity.cli.ts.
Conclusion
Setting up a Sanity project is a short, guided process: run npm create sanity@latest, log in, accept the default dataset, choose the clean template with TypeScript and start the Studio with npm run dev. Adding one schema type, publishing a document and running a GROQ query in Vision shows you the whole content flow in a few minutes.
From here, the natural next steps are learning how the project files fit together, building a richer schema and connecting a real front end. Keep this first project around as a sandbox. It's the easiest place to test new schema ideas and queries before they reach a production Studio.


