| name | slug | description | framework | useCase | css | deployUrl | demoUrl |
|---|---|---|---|---|---|---|---|
Web3 Sessions |
web3-sessions |
In a decentralized application, a user is often identified by a Cryptocurrency wallet such as Metamask. However, since Metamask works by injecting a script into the page, it is only available on the client, cutting off the ability to use getServerSideProps to fetch user data. |
Next.js |
Documentation |
Tailwind |
This example shows how create sessions in Next.js with Metamask and NextAuth.js.
https://web3-sessions.vercel.app
This Demo will show how to configure NextAuth.js and create a custom hook to protect routes.
You can choose from one of the following two methods to use this repository:
Deploy the example using Vercel:
Execute create-next-app with npm or Yarn to bootstrap the example:
npx create-next-app --example https://github.com/vercel/examples/tree/main/solutions/web3-sessions
# or
yarn create next-app --example https://github.com/vercel/examples/tree/main/solutions/web3-sessionsRename the .env.example file to .env and add your own secrets:
// generate random secrets on https://passwordsgenerator.net/ or anywhere else similar
NEXT_AUTH_SECRET="eE*[email protected]*Vxd9vW..X!"
JWT_SECRET="R9Hkbi2Ahoy9wNQH*7Jj4a*Y4NxF"
Next, run Next.js in development mode:
npm install
npm run dev
# or
yarn
yarn devDeploy it to the cloud with Vercel (Documentation).
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent