Gatsby Sanity Starter

What you have

Quick start

I made a step-by-step tutorial on YouTube HERE

Or follow the steps below:

  1. Clone this repository
  2. cd sanity
  3. npm install -g @sanity/cli
  4. sanity init and follow the prompts (you will need to create a Sanity account if you haven't already)
  5. npm run graphql-deploy
  6. cd .. to navigate back to the root folder
  7. npm install in the project's root folder
  8. npm run dev to start the studio and frontend locally
  9. Open http://localhost:3333 and copy the project ID from the Project info section
  10. Navigate to the client-config.js file in the gatsby directory
  11. Replace the project ID with your Project ID
  12. npm run build to build to production locally

Enable real-time content preview on development

  1. Go to your project’s API settings on manage.sanity.io and create a token with read rights.
  2. Rename .env.development.template to .env.development and paste in the token: SANITY_READ_TOKEN="yourTokenHere".
  3. Restart the development server (ctrl + C and npm run dev).

If you want to turn off preview you can set watchMode: false in gatsby-config.js. If you just want to preview published changes you can set overlayDrafts: false in gatsby-config.js.

Stuck? Get help

Slack Community Button

Join Sanity’s developer community or ping us on twitter.