This is a template for integrating Privy Auth into a NextJS project. Check out the deployed app here!
This demo uses NextJS's Pages Router. If you'd like to see an example using the App Router, just change the branch of this repository to app-router.
- Clone this repository and open it in your terminal.
git clone https://github.com/privy-io/create-next-app- Install the necessary dependencies (including Privy Auth) with
npm.
npm i - Initialize your environment variables by copying the
.env.examplefile to an.env.localfile. Then, in.env.local, paste your Privy App ID from the dashboard.
# In your terminal, create .env.local from .env.example
cp .env.example .env.local
# Add your Privy App ID to .env.local
NEXT_PUBLIC_PRIVY_APP_ID=<your-privy-app-id>In your project directory, run npm run dev. You can now visit http://localhost:3000 to see your app and login with Privy!
pages/_app.tsxfor how to use thePrivyProviderand initialize it with your Privy App IDpages/index.tsxfor how to use theusePrivyhook and implement a simpleloginbuttonpages/dashboard.tsxfor how to use theusePrivyhook, fields likeready,authenticated, anduser, and methods likelinkWalletandlogout
Check out our docs for more guidance around using Privy in your app!