Getting Started
Let’s create a simple React application that can display and interact with collectibles. We’ll set up wallet connection and basic collectible viewing functionality.1
Create a Project in Sequence Builder
Before you begin coding, you’ll need to set up your project:
- Go to Sequence Builder
- Create a new project
- Follow our White-label Marketplace Guide
- Note down your Project ID and API Access Key
2
Create a New React Project
We’ll use Vite with React and TypeScript for this guide. You can use any package manager, but we’ll use pnpm in our examples:
3
Install Required Dependencies
Install the Marketplace SDK and its peer dependencies:
4
Create SDK Configuration
Create a new file
src/config/sdk.ts
to store your SDK configuration:Make sure to replace
YOUR_PROJECT_ID
and YOUR_PROJECT_ACCESS_KEY
with your actual project credentials. You can find your Project ID at https://sequence.build/project/{YOUR_PROJECT_ID}/overview
and your Project Access Key at https://sequence.build/project/{YOUR_PROJECT_ID}/settings/apikeys
in the Sequence Builder dashboard.5
Set Up Providers
Create a new file
src/providers.tsx
to configure the necessary providers:6
Update Main Entry Point
Update your
main.tsx
to use the Providers component:7
Create Collectible Card Component
Create a new component
src/components/CollectibleCard.tsx
to display and interact with collectibles:Make sure you have minted at least one collectible in your collection, then use that collectible’s ID as the
collectibleId
While Sequence Connect is recommended for the best experience, you can use other wallet providers with the Marketplace SDK. For custom wallet connectors, see our guide on custom connectors.
8
Update App Component
Update your
App.tsx
to use the new components:9
Run Your Application
Start your development server:Your marketplace application will be running at
http://localhost:5173
. You can now:- Connect your wallet using the connect button
- View collectible details
- Make offers on the collectible using the Make Offer button
Next Steps
Now that you have the basics working, you can:- Create collectible listings
- Manage orders
- Customize the UI
- Check out our other guides for more features