https://github.com/oceans404/fullstack-polygon-id-vc-gated-dapp
Fullstack Polygon ID verification template for creating VC gated dapps
https://github.com/oceans404/fullstack-polygon-id-vc-gated-dapp
decentralized-identity did iden3 polygon polygon-id polygonid vc verifiable-credential verifier
Last synced: 5 months ago
JSON representation
Fullstack Polygon ID verification template for creating VC gated dapps
- Host: GitHub
- URL: https://github.com/oceans404/fullstack-polygon-id-vc-gated-dapp
- Owner: oceans404
- Created: 2023-06-23T11:19:46.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2024-04-19T01:57:39.000Z (about 2 years ago)
- Last Synced: 2024-04-19T02:27:29.365Z (about 2 years ago)
- Topics: decentralized-identity, did, iden3, polygon, polygon-id, polygonid, vc, verifiable-credential, verifier
- Language: JavaScript
- Homepage: https://stephs-vc-gated-dapp.vercel.app
- Size: 308 KB
- Stars: 25
- Watchers: 1
- Forks: 23
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# This is a template for creating your own VC Gated Dapp
Live links
- Frontend: https://stephs-vc-gated-dapp.vercel.app
- Server: https://fullstack-polygon-id-vc-gated-dapp.onrender.com
This template spins up a dapp that is
- ✅ Built with the popular [NextJS](https://nextjs.org/) library
- ✅ VC Gated with a [Polygon ID KYCAgeCredential](https://oceans404.notion.site/How-to-get-a-KYCAgeCredential-Verifiable-Credential-f3d34e7c98ec4147b6b2fae79066c4f6?pvs=4)
- ✅ Fully connected with to all EVM chains including Polygon zkEVM Cardona Testnet and Polygon Amoy Testnet with [RainbowKit](https://www.rainbowkit.com/)
- ✅ Beautifully styled with configurable components and icons from the [Chakra UI](https://chakra-ui.com/docs/components) library
- ✅ Ready to interact with any smart contract thanks to working read and write examples from a Polygon zkEVM Testnet demo smart contract with [wagmi hooks](https://wagmi.sh/)
Use this template as a base to bootstrap a Polygon hackathon project **FAST** 🏃🏻♀️ so you can focus on your dapp's business logic & building the value layer of the internet. 🚀
Love or hate something about this template? Let me know by [tweeting your feedback](https://twitter.com/intent/tweet?text=gm%20Steph%20I'm%20building%20with%20your%20VC%20gated%20Dapp%20template%20%400ceans404%20https%3A%2F%2Fgithub.com%2Foceans404%2Ffullstack-polygon-id-vc-gated-dapp%20%400xPolygon)
## Getting started with the template
Node requirement: **node v20.2.0**
Here's how to check your node version.
```bash
node -v
```
If you're not running this version, you can switch your version with [nvm](https://www.freecodecamp.org/news/node-version-manager-nvm-install-guide/)
#### Setup
0. Visit the template repo https://github.com/oceans404/fullstack-polygon-id-vc-gated-dapp/tree/main and click "Use this template" to create a new repo
1. Get a KYCAgeCredential Verifiable Credential - [follow instructions here](https://oceans404.notion.site/How-to-get-a-KYCAgeCredential-Verifiable-Credential-f3d34e7c98ec4147b6b2fae79066c4f6?pvs=4)
2. Follow server setup instructions
https://github.com/oceans404/fullstack-polygon-id-vc-gated-dapp/tree/main/server
3. Follow frontend setup instructions
https://github.com/oceans404/fullstack-polygon-id-vc-gated-dapp/tree/main/did-frontend
## Default localhosts
- Frontend: localhost:3000
- Server: localhost:8080
## Here's the fullstack vc gated dapp this template spins up
Welcome page: In order to see the dapp, you need to prove your access rights. Click the "Prove access rights" button
A modal with a QR code appears. Scan this QR code with your Polygon ID mobile app. Note: you must hold a KYCAgeCredential with a birthday before this year. [Here's how to get the KYCAgeCredential VC](https://oceans404.notion.site/How-to-get-a-Verifiable-Credential-f3d34e7c98ec4147b6b2fae79066c4f6?pvs=4)
If you successfully complete age verification, you'll see a success message, then be redirected to the dapp.
This is the Dapp page that you see once you've proved access rights. It's set up with a RainbowKit wallet connector and has read and write to smart contract examples.
