Quickstart

📢

Promotion: 10,000 Free Wallets

Sign up and start using Wallets today, and get 10,000 free monthly active wallets and a developer OG NFT.

In this quickstart, we will create a new wallet for your users, and then showcase the NFTs inside it, all in under 5 minutes.

Step 1: Create a Crossmint developer account

To get started, the first thing you'll need to do is to register as a developer in the Crossmint developer console.
Crossmint has two consoles: one for production, at crossmint.com/console and one for testing and development, at staging.crossmint.com/console.

In this guide we'll be developing a test integration, therefore we will use staging.crossmint.com/console. Open that link, sign in, and accept the dialog to continue.

Note: You can get started for free in production once you are ready, with up to 10,000 monthly active wallets included. See more detail on pricing and monthly active wallet definition here

Step 2: Create API keys with Wallet API scopes

In the developer console, navigate to the API keys section and create a new API key. This key should have 3 scopes: [wallets.read, wallets.create, wallets:nfts.read].

❗️

These keys are extremely sensitive! These are server side APIs only. If they are leaked, an attacker may take control of your customers' custodial wallets. This includes the ability to transfer the assets held in those wallets.

Step 3: Create a wallet

Once you have your API key created, you’re ready to create your first wallet via API.

Our API takes the following parameters:

email: User email address. Note: Crossmint supports passing in any arbitrary string as a UUID to map to the wallet. Contact us if you wish to enable this option on your project.
chain: Indicate which blockchain you want to create a new wallet on. For this example, we’ve specified “ethereum” as our chain, which will create a public address on the Goerli testnet (as this is in staging)

Simply fill in the client-secret and project-id headers with the information from the API keys you just created

curl --request POST \
     --url https://staging.crossmint.com/api/v1-alpha1/wallets \
     --header 'X-CLIENT-SECRET: <YOUR_PROJECT_ID>' \
     --header 'X-PROJECT-ID: <YOUR_CLIENT_SECRET>' \
     --header 'accept: application/json' \
     --header 'content-type: application/json' \
     --data '
{
  "chain": "ethereum",
  "email": "[email protected]"
}'

import fetch from 'node-fetch';

const body = {
  email: "[email protected]", 
  chain: "ethereum", 
}

const response = await fetch(
  `https://staging.crossmint.com/api/v1-alpha1/wallets`,
  {
    method: 'POST',
    headers: {
      'X-PROJECT-ID': '<YOUR_PROJECT_ID>',
      'X-CLIENT-SECRET': '<YOUR_CLIENT_SECRET>'
    },
    body: JSON.stringify(body),
  }
);

const wallet = await response.json();

Once you’ve run this, your new wallet will be created! You can enter that wallet’s public address into a block explorer (for the example above, that will be a Goerli block explorer: https://goerli.etherscan.io/) to see transactions as you make them.

[Optional] Step 4: Show your users their NFTs

Pre-requisite: You’ll need to send an NFT on goerli ETH to this newly created wallet

If you want to display a visualization of the NFTs held in a wallet, you can use the CrossmintNFTCollectionView component from the @crossmint/client-sdk-react-ui library. This component renders a grid with all the NFTs based on a list of wallets you send.

To use the component:

1. Add the Crossmint Client SDK to your project

yarn add @crossmint/client-sdk-react-ui

2. Retrieve the wallet addresses you created Fetch wallets endpoint. You can skip this step if you persist the returned wallet addresses from calling the ‘Create Wallet’ endpoint

curl --request GET \
     --url 'https://staging.crossmint.com/api/v1-alpha1/wallets?email=youremailhere%40gmail.com' \
     --header 'X-CLIENT-SECRET: <YOUR_PROJECT_ID>' \
     --header 'X-PROJECT-ID: <YOUR_CLIENT_SECRET>' \
     --header 'accept: application/json'

3. Pass the list of wallets to the wallets prop of the CrossmintNFTCollectionView component. Here's an example:

import { CrossmintNFTCollectionView } from "@crossmint/client-sdk-react-ui";

const wallets = [
  {
    chain: "ethereum",
    publicKey: "<ETH_ADDRESS>",
  },
];

export function yourPage() {
  return (
    <div style={{ height: "100vh" }}>
      <CrossmintNFTCollectionView wallets={wallets} />
    </div>
  );
}

You are now displaying the contents of the wallet you just created!

You can find more examples here: Wallet UI Components

Where to go from here

To finish building a fully functional experience around wallets, consider checking out some of the following guides:

• How to tie wallet creation to user login using one of our out-of-the box integrations with solutions like Dynamic, Stytch, Auth0, Firebase, and more.
• How to token-gate experiences for your users, either digitally or in real life
• How to sign transactions and messages on behalf of your users

Test all of this out from our API reference page here!