Skip to main content
1

Clone the repository

git clone git@github.com:gsinghjay/astro-shadcn-sanity.git
cd astro-shadcn-sanity
You need a GitHub account with SSH keys configured. If you prefer HTTPS, use https://github.com/gsinghjay/astro-shadcn-sanity.git instead.
2

Install dependencies

npm install
This is an npm workspaces monorepo. A single npm install from the root installs dependencies for both the astro-app and studio packages.
3

Configure environment variables

Create a .env file inside the astro-app/ directory:
cp astro-app/.env.example astro-app/.env
Then open astro-app/.env and fill in your Sanity project credentials at minimum:
PUBLIC_SANITY_STUDIO_PROJECT_ID=your_project_id
PUBLIC_SANITY_DATASET=production
Find your Sanity project ID at sanity.io/manage. Select your project — the ID is in the URL and on the project overview page.
See Environment variables for the full list of available variables.
4

Start the development servers

npm run dev
This command starts both servers concurrently:
ServerURLDescription
Astro apphttp://localhost:4321The frontend website
Sanity Studiohttp://localhost:3333The CMS authoring interface
5

Sign in to Sanity Studio

Open http://localhost:3333 and sign in with the same provider (Google, GitHub, or email) you used when creating your Sanity project.Once signed in, you can create and edit content that immediately reflects in the Astro app on the next build or hot reload.

​
Next steps

Prerequisites

Verify you have all required accounts and tools installed.

Environment variables

Explore all configuration options including Visual Editing and multi-site support.

Local development

Learn all available dev commands, test runners, and Storybook.

Block library

Understand how pages are built from reusable content blocks.