Instalasi Paket

Instal CreateKit menggunakan package manager pilihan Anda:
npm install @b3dotfun/basemint
CreateKit dibangun dengan TypeScript dan menyediakan definisi tipe lengkap langsung dari kotak.

Dependensi

CreateKit dibangun di atas teknologi web3 modern dan memerlukan dependensi peer berikut:
npm install viem @wagmi/core

Pengaturan Lingkungan

1. Konfigurasi Jaringan Chain

CreateKit menyediakan definisi chain yang telah dikonfigurasi sebelumnya untuk jaringan B3:
chains.ts
import { b3Mainnet, b3Testnet } from '@b3dotfun/basemint'

// B3 Mainnet (Produksi)
console.log('Chain ID:', b3Mainnet.id) // 8333
console.log('Nama:', b3Mainnet.name)
console.log('URL RPC:', b3Mainnet.rpcUrls.default.http[0])

// B3 Testnet (Pengembangan)
console.log('Chain ID:', b3Testnet.id) // 1993
console.log('Nama:', b3Testnet.name)
console.log('URL RPC:', b3Testnet.rpcUrls.default.http[0])

2. Inisialisasi Klien Viem

Siapkan klien viem Anda untuk berinteraksi dengan blockchain:
client.ts
import { createPublicClient, createWalletClient, http } from 'viem'
import { privateKeyToAccount } from 'viem/accounts'
import { b3Testnet } from '@b3dotfun/basemint'

// Klien publik untuk membaca data
export const publicClient = createPublicClient({
  chain: b3Testnet,
  transport: http()
})

// Klien dompet untuk transaksi (untuk penggunaan sisi server)
export const walletClient = createWalletClient({
  chain: b3Testnet,
  transport: http(),
  account: privateKeyToAccount(process.env.PRIVATE_KEY as `0x${string}`)
})

3. Variabel Lingkungan

Buat file .env di akar proyek Anda:
.env
# Diperlukan untuk menandatangani transaksi
PRIVATE_KEY=0x...

# Opsional: Endpoint RPC kustom
B3_MAINNET_RPC=https://your-custom-rpc.com
B3_TESTNET_RPC=https://your-custom-testnet-rpc.com
Jangan pernah commit private keys ke kontrol versi. Gunakan variabel lingkungan atau solusi manajemen kunci yang aman.

Integrasi Kerangka Kerja

Pengaturan Next.js

Untuk aplikasi Next.js, buat file konfigurasi:
lib/createkit.ts
import { createPublicClient, http } from 'viem'
import { b3Testnet } from '@b3dotfun/basemint'
import { 
  CollectionManager, 
  RewardTracker, 
  BaseMintStorage 
} from '@b3dotfun/basemint'

// Inisialisasi klien
export const publicClient = createPublicClient({
  chain: b3Testnet,
  transport: http()
})

// Inisialisasi manajer CreateKit
export const collectionManager = new CollectionManager(publicClient)
export const rewardTracker = new RewardTracker(publicClient)
export const storage = new BaseMintStorage({
  baseUrl: 'https://api.basemint.fun'
})

Pengaturan React/Vite

src/lib/createkit.ts
import { createPublicClient, http } from 'viem'
import { b3Testnet } from '@b3dotfun/basemint'
import { CollectionManager } from '@b3dotfun/basemint'

export const publicClient = createPublicClient({
  chain: b3Testnet,
  transport: http(import.meta.env.VITE_RPC_URL)
})

export const collectionManager = new CollectionManager(publicClient)

Verifikasi Instalasi

Tes instalasi Anda dengan skrip sederhana:
test-installation.ts
import { b3Testnet, CollectionManager } from '@b3dotfun/basemint'
import { createPublicClient, http } from 'viem'

async function testInstallation() {
  try {
    // Buat klien
    const client = createPublicClient({
      chain: b3Testnet,
      transport: http()
    })

    // Inisialisasi manajer
    const manager = new CollectionManager(client)
    
    // Tes koneksi
    const blockNumber = await client.getBlockNumber()
    console.log('✅ Berhasil terhubung ke B3 Testnet')
    console.log(`📊 Nomor blok saat ini: ${blockNumber}`)
    
    // Tes interaksi kontrak
    const factoryAddress = manager.getFactoryAddress()
    console.log(`🏭 Alamat pabrik: ${factoryAddress}`)
    
    console.log('🎉 Instalasi CreateKit berhasil!')
  } catch (error) {
    console.error('❌ Tes instalasi gagal:', error)
  }
}

testInstallation()
Jalankan skrip tes:
npx tsx test-installation.ts

Konfigurasi TypeScript

Pastikan tsconfig.json Anda mencakup konfigurasi yang diperlukan:
tsconfig.json
{
  "compilerOptions": {
    "strict": true,
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "target": "ES2020",
    "module": "ESNext",
    "lib": ["ES2020", "DOM"]
  }
}

Langkah Selanjutnya

Sekarang Anda telah menginstal dan mengonfigurasi CreateKit, Anda siap untuk mulai membangun:

Pemecahan Masalah