Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vercel/vrs
A serverless virtual reality e-commerce experience powered by Vercel
https://github.com/vercel/vrs
Last synced: 27 days ago
JSON representation
A serverless virtual reality e-commerce experience powered by Vercel
- Host: GitHub
- URL: https://github.com/vercel/vrs
- Owner: vercel
- License: apache-2.0
- Created: 2019-03-25T15:44:31.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-07-13T20:39:06.000Z (over 1 year ago)
- Last Synced: 2024-09-30T12:42:14.176Z (about 1 month ago)
- Language: TypeScript
- Homepage: https://vrs.vercel.app
- Size: 118 MB
- Stars: 518
- Watchers: 61
- Forks: 85
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: license.md
Awesome Lists containing this project
- vr-resources - vrs, A serverless virtual reality e-commerce experience powered by Vercel
- awesome - vercel/vrs - A serverless virtual reality e-commerce experience powered by Vercel (TypeScript)
README
[](https://serverless-vrs.now.sh)
---
# VRS
VRS is a fully-functional e-commerce store using Next.js 12, three.js, NextAuth.js, Stripe Elements, and Airtable.
## Demo
https://serverless-vrs.vercel.app/
## Configuration
### Step 1
Clone the repository
```bash
$ git clone https://github.com/vercel/vrs.git
```
### Step 2
In order to run this example locally, you have to set up your environment in the `.env.local` file.
Copy the `.env.local.example` file in this directory to `.env.local` (which will be ignored by Git):
```
cp .env.local.example .env.local
```
Then, open `.env.local` and add the missing environment variables:
- `NEXTAUTH_SECRET`: A secret value that's used by NextAuth.js to encrypt JWTs. Read more about NextAuth.js's secret value [here](https://next-auth.js.org/configuration/options#nextauth_secret).
- `STRIPE_PK`: Stripe's publishable key. Read more about Stripe's API keys [here](https://stripe.com/docs/keys#obtain-api-keys).
- `STRIPE_SK`: Stripe's secret key. Read more about Stripe's API keys [here](https://stripe.com/docs/keys#obtain-api-keys).
- `GITHUB_CLIENT_ID`: Client ID of your registered OAuth application within Github. Read more about creating a Github app [here](https://docs.github.com/en/developers/apps/building-oauth-apps/creating-an-oauth-app).
- `GITHUB_CLIENT_SECRET`: Client Secret of your registered OAuth application within Github. Read more about creating a Github app [here](https://docs.github.com/en/developers/apps/building-oauth-apps/creating-an-oauth-app).
In this example, we're using [Airtable](https://airtable.com/) as our data source. If you haven't configured Airtable, this example uses the local mock data that can be found in `mockdata.ts`. You can optionally provide the necessary environment variables in the `.env.local` file.
- `AIRTABLE_API_KEY` (_optional_): Airtable's API key. Read more about Airtable's API keys [here](https://support.airtable.com/hc/en-us/articles/219046777-How-do-I-get-my-API-key-)
- `AIRTABLE_BASE_NAME` (_optional_): Your Airtable's base name. Read more about Airtable's API keys [here](https://support.airtable.com/hc/en-us/articles/219046777-How-do-I-get-my-API-key-)
- `AIRTABLE_TABLE_NAME` (_optional_): Your Airtable's Table name. Read more about using data from Airtable [here](https://help.appsheet.com/en/articles/1785063-using-data-from-airtable#:~:text=The%20base%20ID%20can%20be,must%20be%20separated%20by%20commas).
- `AIRTABLE_VIEW_NAME` (_optional_): Your Airtable's View name. Read more about using data from Airtable [here](https://help.appsheet.com/en/articles/1785063-using-data-from-airtable#:~:text=The%20base%20ID%20can%20be,must%20be%20separated%20by%20commas).