{"id":27513095,"url":"https://github.com/chenaski/sanity-template-vercel-visual-editing","last_synced_at":"2025-07-08T10:05:11.278Z","repository":{"id":198725368,"uuid":"701400944","full_name":"chenaski/sanity-template-vercel-visual-editing","owner":"chenaski","description":null,"archived":false,"fork":false,"pushed_at":"2023-10-06T15:43:18.000Z","size":619,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2023-10-06T16:31:49.283Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://sanity-template-vercel-visual-editing-mu-six.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chenaski.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-10-06T14:55:00.000Z","updated_at":"2023-10-06T16:31:50.423Z","dependencies_parsed_at":null,"dependency_job_id":"734928d1-470f-44e1-82a1-770bc6759aa5","html_url":"https://github.com/chenaski/sanity-template-vercel-visual-editing","commit_stats":null,"previous_names":["chenaski/sanity-template-vercel-visual-editing"],"tags_count":null,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenaski%2Fsanity-template-vercel-visual-editing","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenaski%2Fsanity-template-vercel-visual-editing/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenaski%2Fsanity-template-vercel-visual-editing/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chenaski%2Fsanity-template-vercel-visual-editing/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chenaski","download_url":"https://codeload.github.com/chenaski/sanity-template-vercel-visual-editing/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249396011,"owners_count":21264203,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-04-18T00:17:59.386Z","updated_at":"2025-04-18T00:17:59.929Z","avatar_url":"https://github.com/chenaski.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Vercel Visual Editing Demo\u003c!-- omit in toc --\u003e\n\n## [Live demo](https://sanity-template-vercel-visual-editing-git-preview.sanity.build/)\n\n\u003e **Note**\n\u003e\n\u003e [Vercel Visual Editing][visual-editing] is an opt-in feature for Enterprise customers of both Sanity and Vercel. If you are an existing enterprise customer, [contact our sales team][sales-cta] to have Visual Editing enabled on your project. [Learn more about Sanity for Enterprise organizations here.][enterprise-cta]\n\nThis starter is preconfigured to support [Visual Editing][visual-editing-intro], a new feature that enables you to make changes using Vercel's draft mode and new edit functionality. It is a statically generated personal website that uses [Next.js][nextjs] for the frontend and [Sanity][sanity-homepage] to handle its content.\n\nIt comes with a native Sanity Studio that offers features like real-time collaboration, instant side-by-side content previews, and intuitive editing.\n\nThe Studio connects to Sanity Content Lake, which gives you hosted content APIs with a flexible query language, on-demand image transformations, powerful patching, and more.\n\nYou can use this starter to kick-start a personal website to learn more about Visual Editing or other awesome Sanity features.\n\n[![Deploy with Vercel](https://vercel.com/button)][vercel-deploy]\n\n## Features\n\n- A performant, static personal personal website with editable projects\n- A native and customizable authoring environment, accessible on `yourpersonalwebsite.com/studio`\n- Real-time and collaborative content editing with fine-grained revision history\n- Support for block content and the most advanced custom fields capability in the industry\n- Free Sanity project with unlimited admin users, free content updates, and pay-as-you-go for API overages\n- A project with starter-friendly and not too heavy-handed TypeScript and Tailwind.css\n\n## Table of Contents\n\n- [Features](#features)\n- [Table of Contents](#table-of-contents)\n- [Project Overview](#project-overview)\n  - [Important files and folders](#important-files-and-folders)\n- [Configuration](#configuration)\n  - [Step 1. Set up the environment](#step-1-set-up-the-environment)\n  - [Step 2. Set up the project locally](#step-2-set-up-the-project-locally)\n  - [Step 3. Run Next.js locally in development mode](#step-3-run-nextjs-locally-in-development-mode)\n  - [Step 4. Deploy to production](#step-4-deploy-to-production)\n- [Questions and Answers](#questions-and-answers)\n  - [It doesn't work! Where can I get help?](#it-doesnt-work-where-can-i-get-help)\n  - [How can I remove the \"Next steps\" block from my personal site?](#how-can-i-remove-the-next-steps-block-from-my-personal-site)\n- [Next steps](#next-steps)\n\n## Project Overview\n\n| [Personal Website](https://template-vercel-visual-editing.sanity.build)                                                   | [Studio](https://template-vercel-visual-editing.sanity.build/studio)                                                   |\n| ------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------- |\n| ![Personal Website](https://user-images.githubusercontent.com/6951139/206395107-e58a796d-13a9-400a-94b6-31cb5df054ab.png) | ![Sanity Studio](https://user-images.githubusercontent.com/6951139/206395521-8a5f103d-4a0c-4da8-aff5-d2a1961fb2c0.png) |\n\n### Important files and folders\n\n| File(s)                                     | Description                                             |\n| ------------------------------------------- | ------------------------------------------------------- |\n| `sanity.config.ts`                          | Config file for Sanity Studio                           |\n| `sanity.cli.ts`                             | Config file for Sanity CLI                              |\n| `/pages/studio/[[...index]]/page.tsx`       | Where Sanity Studio is mounted                          |\n| `/schemas`                                  | Where Sanity Studio gets its content types from         |\n| `/plugins`                                  | Where the advanced Sanity Studio customization is setup |\n| `/lib/sanity.api.ts`,`/lib/sanity.image.ts` | Configuration for the Sanity Content Lake client        |\n\n## Configuration\n\n### Step 1. Set up the environment\n\nUse the Deploy Button below. It will let you deploy the starter using [Vercel](https://vercel.com?utm_source=github\u0026utm_medium=readme\u0026utm_campaign=next-sanity-example) as well as connect it to your Sanity Content Lake using [the Sanity Vercel Integration][integration].\n\n[![Deploy with Vercel](https://vercel.com/button)][vercel-deploy]\n\n### Step 2. Set up the project locally\n\n[Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository) that was created for you on your GitHub account. Once cloned, run the following command from the project's root directory:\n\n```bash\nnpx vercel link\n```\n\nDownload the environment variables needed to connect Next.js and the Studio to your Sanity project:\n\n```bash\nnpx vercel env pull\n```\n\n### Step 3. Run Next.js locally in development mode\n\n```bash\nnpm install \u0026\u0026 npm run dev\n```\n\nWhen you run this development server, the changes you make in your frontend and studio configuration will be applied live using hot reloading.\n\nYour personal website should be up and running on [http://localhost:3000][localhost-3000]! You can create and edit content on [http://localhost:3000/studio][localhost-3000-studio].\n\n### Step 4. Deploy to production\n\nTo deploy your changes to production you use `git`:\n\n```bash\ngit add .\ngit commit\ngit push\n```\n\nAlternatively, you can deploy without a `git` hosting provider using the Vercel CLI:\n\n```bash\nnpx vercel --prod\n```\n\n## Questions and Answers\n\n### How do I enable Visual Editing on my own Vercel project?\n\n[Read our guide.][visual-editing]\n\n### It doesn't work! Where can I get help?\n\nIn case of any issues or questions, you can post:\n\n- [GitHub Discussions for Next.js][vercel-github]\n- [Sanity's GitHub Discussions][sanity-github]\n- [Sanity's Community Slack][sanity-community]\n\n### How can I remove the \"Next steps\" block from my personal website?\n\nYou can remove it by deleting the `IntroTemplate` component in `/components/shared/Layout.tsx` and\nthe `/intro-template` directory.\n\n## Next steps\n\n- [Join our Slack community to ask questions and get help][sanity-community]\n- [How to edit my content structure?][sanity-schema-types]\n- [How to query content?][sanity-groq]\n- [What is content modelling?][sanity-content-modelling]\n\n[vercel-deploy]: https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fsanity-io%2Fsanity-template-vercel-visual-editing\u0026project-name=sanity-template-vercel-visual-editing\u0026repository-name=sanity-template-vercel-visual-editing\u0026demo-title=Visual%20Editing%20Demo\u0026demo-description=A%20Sanity-powered%20personal%20website%20that%20showcases%20Visual%20Editing%20on%20Vercel.\u0026demo-url=https%3A%2F%2Ftemplate-vercel-visual-editing.sanity.build%2F\u0026demo-image=https%3A%2F%2Fuser-images.githubusercontent.com%2F81981%2F235943631-9c0cd33b-6534-4f82-98f3-641f72970590.png\u0026integration-ids=oac_hb2LITYajhRQ0i4QznmKH7gx\u0026external-id=nextjs;template=sanity-template-vercel-visual-editing\n[integration]: https://www.sanity.io/docs/vercel-integration?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[`.env.local.example`]: .env.local.example\n[nextjs]: https://github.com/vercel/next.js\n[sanity-create]: https://www.sanity.io/get-started/create-project?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[sanity-deployment]: https://www.sanity.io/docs/deployment?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[sanity-homepage]: https://www.sanity.io?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[sanity-community]: https://slack.sanity.io/\n[sanity-schema-types]: https://www.sanity.io/docs/schema-types?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[sanity-github]: https://github.com/sanity-io/sanity/discussions\n[sanity-groq]: https://www.sanity.io/docs/groq?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[sanity-content-modelling]: https://www.sanity.io/docs/content-modelling?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[sanity-webhooks]: https://www.sanity.io/docs/webhooks?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=nextjs-v3vercelstarter\n[localhost-3000]: http://localhost:3000\n[localhost-3000-studio]: http://localhost:3000/studio\n[vercel]: https://vercel.com\n[vercel-github]: https://github.com/vercel/next.js/discussions\n[app-dir]: https://beta.nextjs.org/docs/routing/fundamentals#the-app-directory\n[visual-editing]: https://www.sanity.io/docs/vercel-visual-editing?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=may-vercel-launch\n[visual-editing-intro]: https://www.sanity.io/blog/visual-editing-sanity-vercel?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=may-vercel-launch\n[sales-cta]: https://www.sanity.io/contact/sales?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=may-vercel-launch\n[enterprise-cta]: https://www.sanity.io/enterprise?utm_source=github.com\u0026utm_medium=referral\u0026utm_campaign=may-vercel-launch\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchenaski%2Fsanity-template-vercel-visual-editing","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchenaski%2Fsanity-template-vercel-visual-editing","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchenaski%2Fsanity-template-vercel-visual-editing/lists"}