Vercel Integration

The Sanity.io Vercel integration lets you quickly create a connection between Sanity and Vercel projects or create a new Sanity project ready for use in your Vercel project. It adds environment variables to your Vercel project(s) with the Project ID, a given dataset name, and an editor token with read+write permissions.

You can use these environment variables to connect your project on Vercel to your Sanity.io content lake and fetch, create, and update data in it.

Head over to Vercel's integrations marketplace and follow the instructions.

The installation process will ask you about giving your Sanity.io account access to a personal or team account on Vercel. It will then ask for access to all or just a selected set of projects on the Vercel account.

The Sanity.io integration needs this access to be able to set the environment variables to your Vercel projects. It does not save any data about the projects or use the access in any other way. You can change this scope later if you want the Sanity integration to have access to more or fewer projects.

When you have chosen the scopes and access, you'll be taken to a screen that lists the Vercel projects you have given access to, where you can choose to “Enable Sanity” on each of them. Pushing this button will take you to a screen where you can create a new project on Sanity.io, or choose an existing one.

Once you have installed the Sanity.io integration for Vercel, you can configure and add Sanity.io to more projects selecting by pushing the “Configuration” button on the integration setting page, or configure the access with the “Manage access” button.

This integration adds your project information as environment variables. You can head over to Vercel's documentation to learn more about how to use and configure them.

The project ID will be exposed by the following environment variables in your Vercel project.

• SANITY_API_PROJECT_ID
• SANITY_STUDIO_API_PROJECT_ID
• NEXT_PUBLIC_SANITY_PROJECT_ID

Project IDs are considered public.

The dataset will be exposed by the following environment variables in your Vercel project.

• SANITY_API_DATASET
• NEXT_PUBLIC_SANITY_DATASET
• SANITY_STUDIO_API_DATASET

Dataset names are considered public.

The write token will be exposed on the following environment variables in your Vercel project:

• SANITY_API_WRITE_TOKEN

Since write tokens give access to changing data in your dataset, they should be considered secret.

Here is a basic example of a serverless function that can be run on Vercel that will take a request with some data, and create a new document of that data in the Sanity.io Content Lake:

const {createClient} = require('@sanity/client');

const config = {
  projectId: process.env.SANITY_API_PROJECT_ID,
  dataset: process.env.SANITY_API_DATASET,
  token: process.env.SANITY_API_WRITE_TOKEN,
  useCdn: false,
  apiVersion: '2021-03-25'
};

async function handleForm(req, res) {
  const payload = JSON.parse(req.body);
  try {
    const result = await createClient(config).create(payload);
    return res.status(200).send('ok');
  } catch (error) {
    return res.status(500)send('error');
  }
}

export default handleForm;