SDK Quickstart

Install and configure @chainportal/sdk to integrate token and NFT creation into your own dApp.

Overview

The ChainPortal SDK (@chainportal/sdk) provides 100+ React hooks for integrating multi-chain token and NFT operations into your own application.

Installation

npm install @chainportal/sdk @chainportal/config

Requirements

React 18+
Next.js 14+ (recommended) or any React framework
Wallet libraries for your target ecosystems:
- EVM: wagmi + viem + @rainbow-me/rainbowkit
- Solana: @solana/wallet-adapter-react
- Cosmos: @cosmos-kit/react
- Aptos: @aptos-labs/wallet-adapter-react
- SUI: @mysten/dapp-kit
- NEAR: @near-wallet-selector/core

Basic Setup

Install dependencies

Run: npm install @chainportal/sdk @chainportal/config — along with wallet libraries for your target ecosystems.

Configure chain settings

Use @chainportal/config to get chain configs and supported networks for your ecosystem.

Use a creation hook

Import useTokenCreation() or useNftCreation() and call the action function from your component.

Handle the result

The hook returns isCreating, error, and result — all you need to build the full UI.

Configure Chain Settings

import { getChainConfig, getSupportedChains } from '@chainportal/config';
 
// Get config for a specific chain
const sepoliaConfig = getChainConfig(11155111);
 
// Get all supported chains for an ecosystem
const evmChains = getSupportedChains('evm');

Use Token Creation Hook

import { useTokenCreation } from '@chainportal/sdk';
 
function CreateTokenForm() {
  const {
    createToken,
    isCreating,
    error,
    result,
  } = useTokenCreation();
 
  const handleCreate = async () => {
    await createToken({
      name: 'My Token',
      symbol: 'MTK',
      decimals: 18,
      initialSupply: '1000000',
      features: {
        mintable: true,
        burnable: true,
        pausable: false,
      },
    });
  };
 
  return (
    <div>
      <button onClick={handleCreate} disabled={isCreating}>
        {isCreating ? 'Creating...' : 'Create Token'}
      </button>
      {error && <p>Error: {error.message}</p>}
      {result && <p>Token created: {result.contractAddress}</p>}
    </div>
  );
}

Use NFT Creation Hook

import { useNftCreation } from '@chainportal/sdk';
 
function CreateNFTForm() {
  const { createCollection, isCreating } = useNftCreation();
 
  const handleCreate = async () => {
    await createCollection({
      name: 'My NFT Collection',
      symbol: 'MNFT',
      maxSupply: 10000,
      baseURI: 'ipfs://QmXxx.../',
      royaltyBps: 500, // 5%
      royaltyReceiver: '0x...',
    });
  };
 
  return (
    <button onClick={handleCreate} disabled={isCreating}>
      Create Collection
    </button>
  );
}

All hooks follow the same pattern: const { action, isLoading, error, result } = useHookName(). Once you learn one hook, the rest feel identical.

Architecture

@chainportal/sdk
├── hooks/           # 100+ React hooks
│   ├── adapters/    # 7 wallet adapters (EVM, Solana, etc.)
│   ├── use-token-creation.ts
│   ├── use-nft-creation.ts
│   ├── use-airdrop.ts
│   └── ... (ecosystem-specific hooks)
├── services/        # Business logic
├── stores/          # Zustand state management
├── abis/            # Smart contract ABIs
└── utils/           # Shared utilities

Next Steps

External Resources

Resource	URL
wagmi Docs	https://wagmi.sh
viem Docs	https://viem.sh
RainbowKit Docs	https://www.rainbowkit.com/docs
@solana/web3.js	https://solana-labs.github.io/solana-web3.js
@coral-xyz/anchor	https://www.anchor-lang.com
Turborepo Docs	https://turbo.build/repo/docs
React 18 Docs	https://react.dev
TypeScript Handbook	https://www.typescriptlang.org/docs

SDK Quickstart

Install dependencies

Configure chain settings

Use a creation hook

Handle the result

On this page