{"id":19958079,"url":"https://github.com/rolling-scopes/rs-site","last_synced_at":"2026-05-06T16:07:49.683Z","repository":{"id":81564738,"uuid":"540355933","full_name":"rolling-scopes/rs-site","owner":"rolling-scopes","description":"The Rolling Scopes ","archived":false,"fork":false,"pushed_at":"2023-05-05T16:25:43.000Z","size":3253,"stargazers_count":1,"open_issues_count":23,"forks_count":1,"subscribers_count":6,"default_branch":"develop","last_synced_at":"2025-01-12T07:21:59.146Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://rs-site.vercel.app/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mpl-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rolling-scopes.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null},"funding":{"github":["dzmitry-varabei"],"patreon":null,"open_collective":"rsschool","ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2022-09-23T08:53:02.000Z","updated_at":"2023-03-24T00:32:33.000Z","dependencies_parsed_at":"2023-06-17T17:15:54.392Z","dependency_job_id":null,"html_url":"https://github.com/rolling-scopes/rs-site","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rolling-scopes%2Frs-site","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rolling-scopes%2Frs-site/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rolling-scopes%2Frs-site/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rolling-scopes%2Frs-site/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rolling-scopes","download_url":"https://codeload.github.com/rolling-scopes/rs-site/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241389165,"owners_count":19955107,"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":"2024-11-13T01:40:07.957Z","updated_at":"2025-11-26T16:04:01.422Z","avatar_url":"https://github.com/rolling-scopes.png","language":"TypeScript","funding_links":["https://github.com/sponsors/dzmitry-varabei","https://opencollective.com/rsschool"],"categories":[],"sub_categories":[],"readme":"# Rolling Scopes Site\n\n## Setting up Next app\n\n1. Make sure you have the latest [node](https://nodejs.org/en)\n\n1. Install dependencies:\n\n   ```bash\n   pnpm install\n   ```\n\n1. \u003cdetails\u003e\n   \u003csummary\u003eDRAFT: setup sanity env variables\u003c/summary\u003e\n\n   \u003e Copy [`.env.local.example`] to `.env.local`:\n   \u003e\n   \u003e ```bash\n   \u003e cp .env.local.example .env.local\n   \u003e ```\n   \u003e\n   \u003e Then set these variables in `.env.local`:\n   \u003e\n   \u003e - `NEXT_PUBLIC_SANITY_PROJECT_ID` should be the \"Project ID\" from Sanity project dashboard .\n   \u003e - `NEXT_PUBLIC_SANITY_DATASET` should be the desired dataset from Sanity project (**`develop`**).\n   \u003e - `SANITY_API_READ_TOKEN` create an API token with `read-only` permissions on https://manage.sanity.io/:\n   \u003e   - Go to **API** and the **Tokens** section at the bottom, launch its **Add API token** button.\n   \u003e   - Name it `SANITY_API_READ_TOKEN`, set **Permissions** to `Viewer`.\n   \u003e   - Hit **Save** and you can copy/paste the token.\n\n   \u003c/details\u003e\n\n### Running locally\n\n**Running website:**\n\n```bash\npnpm dev\n```\n\nSite should be up and running on [http://localhost:3000](http://localhost:3000)\n\n### Deployment\n\nTODO.\n\n## Setting up Sanity Studio\n\n[Sanity Studio](https://github.com/sanity-io/sanity) is customizable UI for sanity CMS.\nUsing it requires editor access to the rs-site content.\n\n```bash\ncd studio\npnpm install\npnpm dev\n```\n\nStudio should be up and running on [http://localhost:3333](http://localhost:3333)\n\n### Deployment\n\nSanity studio is deployed separately from the main website.\n\nTODO.\n\n## Contributing\n\nSee [CONTRIBUTING](https://github.com/rolling-scopes/rsschool-app/blob/master/CONTRIBUTING.md) guide\n\n## License\n\n[Mozilla Public License 2.0](https://github.com/rolling-scopes/rsschool-app/blob/master/LICENSE)\n\n---\n\n\u003cdetails\u003e\n\u003csummary\u003e\u003cstrong\u003eOld next.js cms-sanity example README.md\u003c/strong\u003e\u003c/summary\u003e\n\nhttps://github.com/vercel/next.js/blob/v13.2.0/examples/cms-sanity/README.md\n\n# A statically generated blog example using Next.js and Sanity\n\nThis example showcases Next.js's [Static Generation](https://nextjs.org/docs/basic-features/pages) feature using [Sanity](https://www.sanity.io/) as the data source.\n\nYou'll get:\n\n- Next.js deployed with the [Sanity Vercel Integration][integration].\n- Sanity Studio running on localhost and deployed in the [cloud](https://www.sanity.io/docs/deployment).\n- Sub-second as-you-type previews in Next.js\n- [On-demand revalidation of pages](https://nextjs.org/blog/next-12-1#on-demand-incremental-static-regeneration-beta) with [GROQ powered webhooks](https://www.sanity.io/docs/webhooks)\n\n## Step 1. Set up the environment\n\n[Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository) that Vercel created for you and from the root directory of your local checkout.\nThen link your clone to Vercel:\n\n```bash\nnpx vercel link\n```\n\nDownload the environment variables needed to connect Next.js and Studio to your Sanity project:\n\n```bash\nnpx vercel env pull\n```\n\n\u003cdetails\u003e\n\u003csummary\u003eYou can also set up manually\u003c/summary\u003e\n\n- [Bootstrap the example](#bootstrap-the-example)\n- [Connect to a Sanity project](#connect-to-a-sanity-project)\n- [Set up environment variables](#set-up-environment-variables)\n\nIf using the [integration] isn't an option. Or maybe you want to work locally first and deploy to Vercel later. Whatever the reason this guide shows you how to setup manually.\n\n### Bootstrap the example\n\nExecute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init), [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/), or [pnpm](https://pnpm.io):\n\n```bash\nnpx create-next-app --example cms-sanity cms-sanity-app\n```\n\n```bash\nyarn create next-app --example cms-sanity cms-sanity-app\n```\n\n```bash\npnpm create next-app --example cms-sanity cms-sanity-app\n```\n\n### Connect to a Sanity project\n\nRun this to select from your existing Sanity projects, or create a new one:\n\n```bash\n(cd studio \u0026\u0026 npx @sanity/cli init)\n```\n\nThe CLI will update [`sanity.json`] with the project ID and dataset name.\n\n### Set up environment variables\n\nCopy the [`.env.local.example`] file in this directory to `.env.local` (which will be ignored by Git):\n\n```bash\ncp .env.local .env.local\n```\n\nThen set these variables in `.env.local`:\n\n- `NEXT_PUBLIC_SANITY_PROJECT_ID` should be the `projectId` value from [`sanity.json`].\n- `NEXT_PUBLIC_SANITY_DATASET` should be the `dataset` value from [`sanity.json`].\n- `SANITY_API_READ_TOKEN` create an API token with `read-only` permissions:\n  - Run this to open your project settings or go to https://manage.sanity.io/ and open your project:\n    ```bash\n    (cd studio \u0026\u0026 npx @sanity/cli manage)\n    ```\n  - Go to **API** and the **Tokens** section at the bottom, launch its **Add API token** button.\n  - Name it `SANITY_API_READ_TOKEN`, set **Permissions** to `Viewer`.\n  - Hit **Save** and you can copy/paste the token.\n\nYour `.env.local` file should look like this:\n\n```bash\nNEXT_PUBLIC_SANITY_PROJECT_ID=...\nNEXT_PUBLIC_SANITY_DATASET=...\nSANITY_API_READ_TOKEN=...\n```\n\n\u003c/details\u003e\n\n## Step 2. Configure CORS for localhost\n\nNeeded for live previewing unpublished/draft content.\n\n```bash\nnpm --prefix studio run cors:add -- http://localhost:3000 --credentials\n```\n\n## Step 3. Run Next.js locally in development mode\n\n```bash\nnpm install \u0026\u0026 npm run dev\n```\n\n```bash\nyarn install \u0026\u0026 yarn dev\n```\n\nYour blog should be up and running on [http://localhost:3000](http://localhost:3000)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions).\n\n## Step 4. Populate content\n\nIn another terminal start up the studio:\n\n```bash\nnpm run studio:dev\n```\n\nYour studio should be up and running on [http://localhost:3333](http://localhost:3333)!\n\nCreate content in Sanity Studio and live preview it in Next.js, side-by-side, by opening these URLs:\n\n- [`http://localhost:3333`](http://localhost:3333)\n- [`http://localhost:3000/api/preview`](http://localhost:3000/api/preview)\n\n\u003cdetails\u003e\n\u003csummary\u003eView screenshot ✨\u003c/summary\u003e\n\n![screenshot](https://user-images.githubusercontent.com/81981/182991870-7a0f6e54-b35e-4728-922b-409fcf1d6cc3.png)\n\n\u003c/details\u003e\n\nWe're all set to do some content creation!\n\n- Click on the **\"Create new document\"** button top left and select **Post**\n- Type some dummy data for the **Title**\n- **Generate** a **Slug**\n  \u003cdetails\u003e\n  \u003csummary\u003eView screenshot ✨\u003c/summary\u003e\n\n  ![screenshot](https://user-images.githubusercontent.com/81981/182993687-b6313086-f60a-4b36-b038-4c1c63b53c54.png)\n\n  \u003c/details\u003e\n\n- Set the **Date**\n- Select a **Cover Image** from [Unsplash].\n  \u003cdetails\u003e\n  \u003csummary\u003eView screenshot ✨\u003c/summary\u003e\n\n  ![screenshot](https://user-images.githubusercontent.com/81981/182994571-f204c41c-e1e3-44f4-82b3-99fefbd25bec.png)\n\n  \u003c/details\u003e\n\n- Let's create an **Author** inline, click **Create new**.\n- Give the **Author** a **Name**.\n- After selecting a **Picture** of a **face** from [Unsplash], set a hotspot to ensure pixel-perfect cropping.\n  \u003cdetails\u003e\n  \u003csummary\u003eView screenshot ✨\u003c/summary\u003e\n\n  ![screenshot](https://user-images.githubusercontent.com/81981/182995772-33d63e45-4920-48c5-aa47-ccb7ce10170c.png)\n\n  \u003c/details\u003e\n\n- Create a couple more **Posts** and watch how the layout adapt to more content.\n\n**Important:** For each post record, you need to click **Publish** after saving for it to be visible outside Preview Mode.\n\nTo exit Preview Mode, you can click on _\"Click here to exit preview mode\"_ at the top.\n\n## Step 5. Deploy to production \u0026 use Preview Mode from anywhere\n\n### If you didn't [Deploy with Vercel earlier](#step-1-set-up-the-environment) do so now\n\nTo deploy your local project to Vercel, push it to [GitHub](https://docs.github.com/en/get-started/importing-your-projects-to-github/importing-source-code-to-github/adding-locally-hosted-code-to-github)/GitLab/Bitbucket and [import to Vercel](https://vercel.com/new?utm_source=github\u0026utm_medium=readme\u0026utm_campaign=next-example).\n\n**Important**: When you import your project on Vercel, make sure to click on **Environment Variables** and set them to match your `.env.local` file.\n\nAfter it's deployed link your local code to the Vercel project:\n\n```bash\nnpx vercel link\n```\n\n### Configure CORS for production\n\nAdd your `production url` to the list over CORS origins.\n\n\u003cdetails\u003e\n\u003csummary\u003eDon't remember the production url? 🤔\u003c/summary\u003e\n\nNo worries, it's easy to find out. Go to your [Vercel Dashboard](https://vercel.com/) and click on your project:\n\n![screenshot](https://user-images.githubusercontent.com/81981/183002637-6aa6b1d8-e0ee-4a9b-bcc0-d49799fcc984.png)\n\nIn the screenshot above the `production url` is `https://cms-sanity.vercel.app`.\n\n\u003c/details\u003e\n\n```bash\nnpm --prefix studio run cors:add -- [your production url] --credentials\n```\n\n### Add the preview secret environment variable\n\nIt's required to set a secret that makes Preview Mode activation links unique. Otherwise anyone could see your unpublished content by just opening `[your production url]/api/preview`.\nRun this and it'll prompt you for a value:\n\n```bash\nnpx vercel env add SANITY_STUDIO_PREVIEW_SECRET\n```\n\nThe secret can be any combination of random words and letters as long as it's URL safe.\nYou can generate one in your DevTools console using `copy(Math.random().toString(36).substr(2, 10))` if you don't feel like inventing one.\n\nYou should see something like this in your terminal afterwards:\n\n```bash\n$ npx vercel env add SANITY_STUDIO_PREVIEW_SECRET\nVercel CLI 27.3.7\n? What’s the value of SANITY_STUDIO_PREVIEW_SECRET? 2whpu1jefs\n? Add SANITY_STUDIO_PREVIEW_SECRET to which Environments (select multiple)? Production, Preview, Development\n✅  Added Environment Variable SANITY_STUDIO_PREVIEW_SECRET to Project cms-sanity [1s]\n```\n\nRedeploy production to apply the secret to the preview api:\n\n```bash\nnpx vercel --prod\n```\n\nAfter it deploys it should now start preview mode if you launch `[your production url]/api/preview?secret=[your preview secret]`. You can send that preview url to people you want to show the content you're working on before you publish it.\n\n### How to test locally that the secret is setup correctly\n\nIn order to test that the secret will prevent unauthorized people from activating preview mode, start by updating the local `.env` with the secret you just made:\n\n```bash\nnpx vercel env pull\n```\n\nRestart your Next.js and Studio processes so the secret is applied:\n\n```bash\nnpm run dev\n```\n\n```bash\nnpm run studio:dev\n```\n\nAnd now you'll get an error if `[secret]` is incorrect when you try to open `https://localhost:3000/api/preview?secret=[secret]`.\n\n### How to start Preview Mode for Next.js in production from a local Studio\n\nRun this to make the Studio open previews at `[your production url]/api/preview` instead of `http://localhost:3000/api/preview`\n\n```bash\nSANITY_STUDIO_PREVIEW_URL=[your production url] npm run studio:dev\n```\n\n### If you regret sending a preview link to someone\n\nRevoke their access by creating a new secret:\n\n```bash\nnpx vercel env rm SANITY_STUDIO_PREVIEW_SECRET\nnpx vercel env add SANITY_STUDIO_PREVIEW_SECRET\nnpx vercel --prod\n```\n\n## Step 6. Deploy your Studio and publish from anywhere\n\nLive previewing content is fun, but collaborating on content in real-time is next-level:\n\n```bash\nSANITY_STUDIO_PREVIEW_URL=[your production url] npm run studio:deploy\n```\n\nIf it's successful you should see something like this in your terminal:\n\n```bash\nSANITY_STUDIO_PREVIEW_URL=\"https://cms-sanity.vercel.app\" npm run studio:deploy\n? Studio hostname (\u003cvalue\u003e.sanity.studio): cms-sanity\n\nIncluding the following environment variables as part of the JavaScript bundle:\n- SANITY_STUDIO_PREVIEW_URL\n- SANITY_STUDIO_PREVIEW_SECRET\n- SANITY_STUDIO_API_PROJECT_ID\n- SANITY_STUDIO_API_DATASET\n\n✔ Deploying to Sanity.Studio\n\nSuccess! Studio deployed to https://cms-sanity.sanity.studio/\n```\n\nThis snippet is stripped from verbose information, you'll see a lot of extra stuff in your terminal.\n\n## Step 7. Setup Revalidation Webhook\n\nUsing GROQ Webhooks Next.js can rebuild pages that have changed content. It rebuilds so fast it can almost compete with Preview Mode.\n\nCreate a secret and give it a value the same way you did for `SANITY_STUDIO_PREVIEW_SECRET` in [Step 4](#add-the-preview-secret-environment-variable). It's used to verify that webhook payloads came from Sanity infra, and set it as the value for `SANITY_REVALIDATE_SECRET`:\n\n```bash\nnpx vercel env add SANITY_REVALIDATE_SECRET\n```\n\nYou should see something like this in your terminal afterwards:\n\n```bash\n$ npx vercel env add SANITY_REVALIDATE_SECRET\nVercel CLI 27.3.7\n? What’s the value of SANITY_REVALIDATE_SECRET? jwh3nr85ft\n? Add SANITY_REVALIDATE_SECRET to which Environments (select multiple)? Production, Preview, Development\n✅  Added Environment Variable SANITY_REVALIDATE_SECRET to Project cms-sanity [1s]\n```\n\nApply the secret to production:\n\n```bash\nnpx vercel --prod\n```\n\nWormhole into the [manager](https://manage.sanity.io/) by running:\n\n```bash\n(cd studio \u0026\u0026 npx @sanity/cli hook create)\n```\n\n- **Name** it \"On-demand Revalidation\".\n- Set the **URL** to`[your production url]/api/revalidate`, for example: `https://cms-sanity.vercel.app/api/revalidate`\n- Set the **Trigger on** field to \u003clabel\u003e\u003cinput type=checkbox checked\u003e Create\u003c/label\u003e \u003clabel\u003e\u003cinput type=checkbox checked\u003e Update\u003c/label\u003e \u003clabel\u003e\u003cinput type=checkbox checked\u003e Delete\u003c/label\u003e\n- Set the **Filter** to `_type == \"post\" || _type == \"author\"`\n- Set the **Secret** to the same value you gave `SANITY_REVALIDATE_SECRET` earlier.\n- Hit **Save**!\n\n### Testing the Webhook\n\n- Open the Deployment function log. (**Vercel Dashboard \u003e Deployment \u003e Functions** and filter by `api/revalidate`)\n- Edit a Post in your Sanity Studio and publish.\n- The log should start showing calls.\n- And the published changes show up on the site after you reload.\n\n\u003c/details\u003e\n\n[integration]: https://www.sanity.io/docs/vercel-integration\n[`sanity.json`]: studio/sanity.json\n[`.env.local.example`]: .env.local.example\n[unsplash]: https://unsplash.com\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frolling-scopes%2Frs-site","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frolling-scopes%2Frs-site","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frolling-scopes%2Frs-site/lists"}