https://permissionless-example.privy.io/
This is a template for integrating Privy and permissionless.js (Pimlico) into a NextJS project. Check out the deployed app here!
In this demo app, a user can login with their email or Google account, and get a Privy embedded wallet. Once the user has logged in and created an embedded wallet, permissionless.js will create a smart wallet for the user behind the scenes, which can then be used to incorporate gas sponsorship, batched transactions, and more into your app.
You can test this by logging into the app and attempting to mint an NFT with your smart wallet; it should cost you no gas!
- Fork this repository, clone it, and open it in your terminal.
git clone https://github.com/<your-github-handle>/permissionless-example- Install the necessary dependencies (including Privy and Permissionless) 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 Privy console and your Pimlico Bundler and Paymaster URLs from the Pimlico dashboard. This app uses the Base Sepolia testnet; you should make sure to apply the same settings to your Pimlico configuration in 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>
NEXT_PUBLIC_PIMLICO_PAYMASTER_URL=<your-pimlico-paymaster-url>
NEXT_PUBLIC_PIMLICO_BUNDLER_URL=<your-pimlico-bundler-url>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 set your app up with thePrivyProviderhooks/SmartAccountContext.tsxfor how to deploy a smart account for users, using their Privy embedded wallet as a signer, and how to store it in a React contextpages/dashboard.tsxfor how to use the customuseSmartAccounthook to send an NFT minting transaction
Check out our Pimlico integration guide for more guidance!