/create-next-app

Primary LanguageTypeScriptMIT LicenseMIT

Privy Auth create-next-app Starter

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.

Setup

  1. Clone this repository and open it in your terminal.
git clone https://github.com/privy-io/create-next-app
  1. Install the necessary dependencies (including Privy Auth) with npm.
npm i
  1. 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>

Building locally

In your project directory, run npm run dev. You can now visit http://localhost:3000 to see your app and login with Privy!

Check out:

  • pages/_app.tsx for how to use the PrivyProvider and initialize it with your Privy App ID
  • pages/index.tsx for how to use the usePrivy hook and implement a simple login button
  • pages/dashboard.tsx for how to use the usePrivy hook, fields like ready, authenticated, and user, and methods like linkWallet and logout

Check out our docs for more guidance around using Privy in your app!