Quickstart

In this quickstart, we will be creating a new wallet address via Crossmint’s wallet API. Looking for WalletConnect functionality specifically? Jump here

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: In order to use wallet APIs in production, please contact our team to whitelist your project.

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 your new wallet address

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: we can support any arbitrary string being passed as a UUID to map to the wallet. Contact us if you prefer a different option than email.
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: "solana",
    publicKey: "<SOL_ADDRESS>",
  },
  {
    chain: "ethereum",
    publicKey: "<ETH_ADDRESS>",
  },
];

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

You have now visualized a wallet you just created!

You can find more examples here: Wallet UI Components