Tutorials
This section includes several tutorials for integrating Passport XYZ into your apps with v1 of the API.
- Gating access with Passport scores
- Retrieve Passport data and display it to your UI
- How to retrieve, handle and display Stamp metadata in a simple app
- Requiring a Passport score for airdrop claim
- Integrating onchain Stamp data using smart contracts
Please note:
In November 2024, we soft-launched Passport API v2.
We have not announced any deprecation or retirement timelines for v1 yet, but do strongly recommend using v2 moving forward.
We are actively working on updating the v1 tutorials to use v2.
You can learn more about the differences between v1 and v2 via our migration guide.
Where to start
If you are taking your first steps into building apps with the Passport API, please make sure to use Passport API v2. All of the below tutorials are still using v1 of the API.
If you need additional support or you have questions about developing with Passport, you can chat in our dedicated developer support channel on Telegram (opens in a new tab).
Tutorials
Gating access with Passport scores
This tutorial will guide you through building a simple "knowledge hub" app with some specific content that can only be accessed by users with a Passport score above a threshold. Read more about thresholds on the scoring thresholds page.
The app is built using Next.js (opens in a new tab), Chakra-ui (opens in a new tab), and ethers (opens in a new tab).
Integrating Stamps and scores
This tutorial will guide you through building a simple app that shows whether a user is "trusted" or not based upon their Passport score and ownership of specific Stamps. Multiple users can connect to the app and the Stamps they own are displayed in the app's UI.
The app is built using Next.js (opens in a new tab), Chakra-ui (opens in a new tab), and ethers (opens in a new tab).
How to retrieve, handle and display Stamp metadata in a simple app
This tutorial will guide you through building a simple app that displays the Stamps that are connected to a specified wallet and Passport.
The app is built using Next.js (opens in a new tab), Chakra-ui (opens in a new tab), and ethers (opens in a new tab).
Requiring a Passport score for airdrop claim
This guide demonstrates using Passport scores to shield your airdrop from airdrop farmers and other bad actors.
This app is built using Next.js (opens in a new tab), RainbowKit (opens in a new tab), and wagmi (opens in a new tab).
How to integrate onchain Passport data using smart contracts
Please note that this tutorial is not related to the Passport API, and instead uses the Passport smart contract stack.
This tutorial will guide you how to show different content to users depending on their Passport data, all pulled from the blockchain.
The app is built using Next.js (opens in a new tab), Chakra-ui (opens in a new tab), and ethers (opens in a new tab).