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.example
file to an.env.local
file. 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.tsx
for how to use thePrivyProvider
and initialize it with your Privy App IDpages/index.tsx
for how to use theusePrivy
hook and implement a simplelogin
buttonpages/dashboard.tsx
for how to use theusePrivy
hook, fields likeready
,authenticated
, anduser
, and methods likelinkWallet
andlogout
Check out our docs for more guidance around using Privy in your app!