thirdweb ile mint etme

thirdweb birden fazla blok zinciri ağında merkeziyetsiz uygulamalar geliştirmek için araçlar ve altyapı sunan bir platformdur. SDK’ler, API’ler ve önceden hazırlanmış bileşenlerle blok zinciri entegrasyonunu basitleştirir.

NFT mint etme söz konusu olduğunda, thirdweb; denetlenmiş sözleşmeleri ve kapsamlı SDK’leriyle birlikte şık bir kontrol paneli ve IPFS yükleme özelliği sunar.

Tek bir NFT’yi manuel olarak mint etme

Sadece tek bir görüntü yüklemek ve mint etmek istiyorsanız, thirdweb tıkla-dağıt arayüzü sunar.

İlk olarak, sahibi olarak Web3 cüzdanınızı kullanarak bir thirdweb hesabı oluşturun. Bu size thirdweb kontrol panelinize erişim sağlar.

Buradan iki yoldan birini seçebilirsiniz:

• Şunu kullanın: TokenERC721 sayfasını ve "Deploy Now" düğmesini.

• Ya da kontrol panelinizdeki "Create Token" arayüzünü kullanın.

Bu sayfada her birini kısaca inceleyelim. Şuradaki thirdweb Geliştirici Portalı ihtiyacınız olursa size daha fazla bilgi verecektir.

TokenERC721 sayfasını kullanma

1. Şuraya gidin: TokenERC721 sayfası. Bu, bir NFT Koleksiyonu oluşturmak için onların sözleşmesine dayanır.

2. Sözleşme dağıtım sayfasına erişmek için "Deploy Now"a tıklayın.

1. "Contract metadata" bölümünü doldurun:

   1. NFT koleksiyonunuzu temsil etmesini istediğiniz görseli yükleyin (ya da sadece mint etmek istediğiniz görseli).

   2. Koleksiyonunuza benzersiz bir ad ve bir sembol/ticker verin.

   3. Bir açıklama ekleyin.

2. thirdweb, "Primary Sales" ve "Royalties" için alıcı adreslerini otomatik olarak doldurur; Web3 adreslerinin gerçekten cüzdanınıza ait olup olmadığını kontrol ettiğinizden emin olun.

3. "Deploy Options" bölümünde Chiliz Chain’i seçin (ya da bu yalnızca bir testse Chiliz Spicy Testnet’i) ve "Deploy Now"a tıklayın:

1. thirdweb sözleşmeyi dağıtmaya başlayacak ve Web3 cüzdanınızdan bir onay penceresi tetiklenecektir. Dağıtımı tamamlamak için onaylayın.

2. İşlem tamamlandığında, "View Contract" düğmesine tıklayın. Sizi, bir kontrol listesi/ilerleme çubuğu ile birlikte thirdweb kontrol panelinizde sözleşmenin sayfasına götürecektir:

3. Kontrol listesinden de görebileceğiniz gibi, şu ana kadar yaptığınız tek şey bir sözleşme dağıtmak; NFT’yi gerçekten mint etmeniz gerekiyor. Sol sütunda, yeni bir sayfa açmak için "NFTs" menü öğesine tıklayın; bu sayfa şu anda boş:

4. "Mint" düğmesine tıklayın; NFT’nizin her bir özelliği için alanlar içeren bir yan panel açılacaktır. NFT’niz için metadata’yı burada oluşturursunuz:

5. Çeşitli alanları doldurun. "Artist_name" veya "Type_of_work" gibi NFT koleksiyonunuza özgü alanlar oluşturabilir ve gelişmiş seçenekleri inceleyebilirsiniz; ancak bu test için sade tutabilirsiniz: ad, medya dosyası, açıklama.

6. Yan panelin altındaki "Mint NFT" düğmesine tıklayın ve cüzdanınızdan işlemi onaylayın.

7. thirdweb ardından "NFTs" sayfasını gösterecek ve NFT’niz artık NFT sözleşmenize bağlı olarak görünür olacaktır.

BİTTİ! NFT’nizi mint ettiniz!

Gerçekten Chiliz Chain üzerinde olduğunu kontrol etmek için şunu açın: Chiliscan (veya Testnet sürümü Spicy Testnet kullanıyorsanız) ve NFT’nin hash’ini arama alanına kopyalayıp yapıştırın. Sözleşmenizin zincir üzerinde olduğunu hemen doğrulamalı ve "Inventory" sekmesinde NFT’nizi sizinle (veya en azından cüzdanınızın kimliğiyle) birlikte sahibi olarak listelemelidir.

NFT’nizi Chiliz Chain Mainnet’te mint ettiyseniz, bunun Rarible gibi pazar yerlerindeki hesabınızda görünmesi gerekir Rarible veya OKX, ve oradan satışa başlayabilirsiniz!

"Create Token" düğmesini kullanma

Bu aslında yukarıdaki yola göre daha doğrudan bir yöntemdir ve thirdweb’e yakın zamanda eklenmiştir.

1. thirdweb kontrol panelinizdeki herhangi bir proje klasöründen, sol kenar çubuktaki "Tokens" seçeneğine tıklayın:

2. Açılan "Tokens" sayfasında, sağ taraftaki "Create Token" düğmesine tıklayın. 2 seçenekli bir modal pencere açılacak, "Create NFT Collection" seçeneğini seçin.

3. Bu sizi aşağıdaki sayfanın adım adım bir sürümüne götürecektir: TokenERC721 dağıtım sayfası (aslında, bir ERC-721 Drop sözleşmesi dağıtacaktır). Bu sözleşme için gerekli tüm alanları doldurun, ardından "Next" düğmesine basın.

4. Bir sonraki ekran NFT’nin kendisiyle ilgilidir: görseli yükleyin ve görselinizi açıklayan alanları doldurun, ardından "Next" düğmesine basın.

5. thirdweb şimdi başlatmak üzere olduğunuz NFT koleksiyonunun bir özetini gösterir. Her şeyin doğru olduğunu kontrol edin, ardından "Launch NFT Collection" düğmesine tıklayın.

6. thirdweb, sözleşmeyi dağıtma, NFT’yi mint etme ve koşulları ayarlama işini tek seferde üstlenir. Web3 cüzdanınız aracılığıyla üç işlemi onaylamanız gerekir.

7. Bu işlem tamamlandığında, "View NFT" düğmesine tıklayın ve thirdweb kontrol panelinize geri götürüleceksiniz; burada bu sözleşmeye özel sayfa ve bağlı NFT’leri görüntülenecektir.

Buradan, gerçekten zincir üzerinde olduğunu bir blok gezgini aracılığıyla kontrol edebilir veya NFT’nizi bir pazar yeri üzerinden satmaya başlayabilirsiniz.

Programatik olarak tek bir NFT mint etme

İşte kullanan bir kod örneği thirdweb v5 SDK; bu, medya dosyasını IPFS’ye yükler ve metadata.json dosyasını oluşturup onu da IPFS’ye yükler.

Bunun için şunlara sahip olmanız gerekir:

• Chiliz Chain üzerinde önceden dağıtılmış bir ERC-721 sözleşmesi. Bu durumda bunu başka bir araç yerine thirdweb kullanarak yapmalısınız.

• thirdweb üzerinden dağıttığınız ERC-721 sözleşmesine bağlı bir thirdweb API anahtarı. Bunu akıllı sözleşmenin proje sayfasında "Client ID" adı altında bulabilirsiniz.

• thirdweb SDK’nin yerel kurulumu. Bunu kullanarak yapabilirsiniz: npm:

npm install thirdweb dotenv

Şu dotenv parametresi bir .env dosyası oluşturur; bu dosya özel değerleri saklamak için gereklidir:

THIRDWEB_SECRET_KEY=YOUR_TW_SECRET_KEY # thirdweb projenizin sayfasından.
PRIVATE_KEY=0xabc...                   # İşlemi gönderecek Web3 cüzdanı.
CONTRACT_ADDRESS=0xYour721Address      # Dağıtılmış TokenERC721 sözleşmeniz.
CHAIN_ID=88882                         # 88888=Mainnet, 88882=Spicy
IMAGE_PATH=./art/image.png             # Medya dosyanızın yerel yolu.
NAME=My Chiliz NFT
DESCRIPTION=Chiliz Chain üzerinde mint edildi

Asla PRIVATE_KEY ve THIRDWEB_SECRET_KEY değerlerinizi istemci tarafı kodunda açığa çıkarmayın! Bu dosyayı güvenli bir sunucuda/CI’da tutun ve herkese açık bir depoya yüklemeyin.

Şimdi her şey hazır olduğuna göre, şu betikten ilham alabilirsiniz; bu betik şunları yapacaktır:

1. Medya dosyasını IPFS’ye yükleme

2. Şunu oluşturup yükleme: metadata.json dosyayı

3. Sözleşmenin mintTo yöntemini kullanarak NFT’yi mint etme.

4. Ortaya çıkan tokenId’yi ve tokenUrl’yi size gösterme.

Bu yalnızca örnek bir koddur; bunu kendi proje kodunuza uyarlamanız gerekecek!

import 'dotenv/config';
import fs from 'fs';
import path from 'path';

import { createThirdwebClient, getContract, sendTransaction, waitForReceipt, parseEventLogs } from "thirdweb";
import { defineChain } from "thirdweb/chains";
import { privateKeyToAccount } from "thirdweb/wallets";
import { mintTo, transferEvent, getNFT } from "thirdweb/extensions/erc721";
import { upload } from "thirdweb/storage";

function guessMime(p: string) {
  const ext = path.extname(p).toLowerCase();
  if (ext === ".png") return "image/png";
  if (ext === ".jpg" || ext === ".jpeg") return "image/jpeg";
  if (ext === ".webp") return "image/webp";
  if (ext === ".gif") return "image/gif";
  if (ext === ".mp4") return "video/mp4";
  if (ext === ".webm") return "video/webm";
  return "application/octet-stream";
}

async function main() {
  const client = createThirdwebClient({ secretKey: process.env.THIRDWEB_SECRET_KEY! });
  const chain = defineChain(Number(process.env.CHAIN_ID)); // 88888 veya 88882
  const account = privateKeyToAccount({ client, privateKey: process.env.PRIVATE_KEY! });

  const contract = getContract({
    client,
    chain,
    address: process.env.CONTRACT_ADDRESS as `0x${string}`,
  });

  // Medya dosyasını IPFS’ye yükle
  const filePath = process.env.IMAGE_PATH!;
  const buffer = fs.readFileSync(filePath);
  const file = new File([buffer], path.basename(filePath), { type: guessMime(filePath) });

  const [imageUri] = await upload({ client, files: [file] }); // ipfs://... döner 
  // console.log("imageUri:", imageUri);

  // IPFS imageUri’sine referans veren metadata.json’u oluştur ve yükle
  const metadata = {
    name: process.env.NAME!,
    description: process.env.DESCRIPTION!,
    image: imageUri
  };
  const metaBlob = new Blob([JSON.stringify(metadata, null, 2)], { type: "application/json" });
  const metaFile = new File([metaBlob], "metadata.json", { type: "application/json" });

  const [metadataUri] = await upload({ client, files: [metaFile] });
  // console.log("metadataUri:", metadataUri);

  // metadata URI’yi kullanarak mintTo işlemini hazırlayın ve gönderin
  // mintTo, tokenURI olarak doğrudan kullanılacak bir string kabul eder.
  const tx = mintTo({
    contract,
    to: account.address,
    nft: metadataUri, // tokenURI
  });

  const { transactionHash } = await sendTransaction({ transaction: tx, account });
  //console.log("tx:", transactionHash);

  const receipt = await waitForReceipt({ client, chain, transactionHash });

  // tokenId’yi göstermek için Transfer event’ini ayrıştırın
  const events = parseEventLogs({ logs: receipt.logs, events: [transferEvent()] });
  const minted = events.find(e => e.eventName === "Transfer" && e.args.from === "0x0000000000000000000000000000000000000000");
  const tokenId = minted ? (minted.args.tokenId as bigint) : undefined;
  //console.log("tokenId:", tokenId?.toString() ?? "(bulunamadı)");

  if (tokenId !== undefined) {
    const nft = await getNFT({ contract, tokenId });
    //console.log("tokenURI (geri okundu):", nft.tokenURI);
  }
}

main().catch((err) => (console.error(err), process.exit(1)));

Örnek almanız gereken önemli kısımlar şunlardır:

• upload dosyaları (ve JSON’u) IPFS’ye kaydeder ve ipfs://… URI’lerini döndürür.

• mintTo doğrudan tokenURI.

• olarak kullanılacak bir string kabul eder. Standart ERC-721 Transfer tokenId’yi.

event’ini ayrıştırarak mint edilen

NFT koleksiyonunu programatik olarak mint etme .env NFT koleksiyonu mint etmek, tek bir tane mint etmekten çok farklı değildir. En belirgin fark, dosyanızın tüm görselleri içeren klasöre işaret etmesi,IMAGE_DIR kullanarak tek bir görsele işaret etmek yerine.

THIRDWEB_SECRET_KEY=YOUR_TW_SECRET_KEY # thirdweb projenizin sayfasından.
PRIVATE_KEY=0xabc...                   # İşlemi gönderecek Web3 cüzdanı.
CONTRACT_ADDRESS=0xYour721Address      # Dağıtılmış TokenERC721 sözleşmeniz.
CHAIN_ID=88882                         # 88888=Mainnet, 88882=Spicy
IMAGE_PATH=./art                       # Medya dosyalarınızın yerel yolu.
NAME_PREFIX=My Chiliz NFT              # Bu şu hale gelecek: "My Chiliz NFT <n>"
DESCRIPTION=Chiliz Chain üzerinde mint edildi

Burada gösterdiğimiz örnek kod bunu dikkate alır:

import 'dotenv/config';
import fs from 'fs';
import path from 'path';

import { createThirdwebClient, getContract, sendTransaction, waitForReceipt, parseEventLogs } from "thirdweb";
import { defineChain } from "thirdweb/chains";
import { privateKeyToAccount } from "thirdweb/wallets";
import { mintTo, transferEvent, getNFT } from "thirdweb/extensions/erc721";
import { upload } from "thirdweb/storage";

function guessMime(p: string) {
  const ext = path.extname(p).toLowerCase();
  if (ext === ".png") return "image/png";
  if (ext === ".jpg" || ext === ".jpeg") return "image/jpeg";
  if (ext === ".webp") return "image/webp";
  if (ext === ".gif") return "image/gif";
  if (ext === ".mp4") return "video/mp4";
  if (ext === ".webm") return "video/webm";
  return "application/octet-stream";
}

// Tüm dosyaları toplamanın bir yolu
function listMediaFiles(dir: string) {
  const allow = new Set([".png", ".jpg", ".jpeg", ".webp", ".gif", ".mp4", ".webm", ".svg"]);
  return fs
    .readdirSync(dir)
    .filter((f) => allow.has(path.extname(f).toLowerCase()))
    .map((f) => path.join(dir, f));
}

async function main() {
  const client = createThirdwebClient({ secretKey: process.env.THIRDWEB_SECRET_KEY! });
  const chain = defineChain(Number(process.env.CHAIN_ID)); // 88888 veya 88882
  const account = privateKeyToAccount({ client, privateKey: process.env.PRIVATE_KEY! }); 

  const contract = getContract({
    client,
    chain,
    address: process.env.CONTRACT_ADDRESS as `0x${string}`,
  });

  // Bir klasördeki medya dosyalarını IPFS’ye yükle
  const dirPath = process.env.IMAGES_DIR!;
  const filePaths = listMediaFiles(dirPath);
  if (!filePaths.length) {
    throw new Error(`${dirPath} içinde medya dosyası bulunamadı`);
  }

  const fileObjs = filePaths.map((p) => {
    const buffer = fs.readFileSync(p);
    return new File([buffer], path.basename(p), { type: guessMime(p) });
  });

  const imageUris = await upload({ client, files: fileObjs }); // ["ipfs://...", ...] döner
  //console.log("IPFS’ye yüklenen görseller:", imageUris.length, "dosya");

  // Her biri kendi imageUri’sine referans veren metadata.json’ları oluşturup yükle
  // NAME ve DESCRIPTION env’lerini kullanır; adlar "<NAME> #<index>" olur
  const namePrefix = process.env.NAME!;
  const description = process.env.DESCRIPTION!;

  // Metadata JSON’ları için bir File nesneleri dizisi oluştur
  const metaFiles = imageUris.map((imageUri, i) => {
    const metadata = {
      name: `${namePrefix} #${i + 1}`,
      description,
      image: imageUri
    };
    const metaBlob = new Blob([JSON.stringify(metadata, null, 2)], { type: "application/json" });
    return new File([metaBlob], `metadata-${i + 1}.json`, { type: "application/json" });
  });

  const metadataUris = await upload({ client, files: metaFiles }); // ["ipfs://.../metadata-1.json", ...]
  //console.log("IPFS’ye yüklenen metadata dosyaları:", metadataUris.length);

  // metadata URI’lerini kullanarak mintTo işlemlerini hazırlayın ve gönderin (sıralı)
  const ZERO = "0x0000000000000000000000000000000000000000";

  for (let i = 0; i < metadataUris.length; i++) {
    const metadataUri = metadataUris[i];

    const tx = mintTo({
      contract,
      to: account.address,
      nft: metadataUri, // tokenURI
    });

    const { transactionHash } = await sendTransaction({ transaction: tx, account });
    console.log(`[${i + 1}/${metadataUris.length}] tx:`, transactionHash);

    const receipt = await waitForReceipt({ client, chain, transactionHash });

    // Bu mint için tokenId almak üzere Transfer event’ini ayrıştırın
    const events = parseEventLogs({ logs: receipt.logs, events: [transferEvent()] });
    const minted = events.find(
      (e) => e.eventName === "Transfer" && typeof e.args.from === "string" && e.args.from.toLowerCase() === ZERO
    );
    const tokenId = minted ? (minted.args.tokenId as bigint) : undefined;

    // console.log(`[${i + 1}/${metadataUris.length}] tokenId:`, tokenId?.toString() ?? "(bulunamadı)");
    if (tokenId !== undefined) {
      const nft = await getNFT({ contract, tokenId });
      // console.log(`[${i + 1}/${metadataUris.length}] tokenURI (geri okundu):`, nft.tokenURI);
    }
  }
}

main().catch((err) => (console.error(err), process.exit(1)));

Ayrıntılı değişiklikler şunlardır:

• IMAGES_DIR şunun yerini alır: kullanarak tek bir görsele işaret etmek yerine.

• Eklendi listMediaFiles birden fazla girdi toplamak için.

• Toplu upload görseller ve metadata için (sıralamayı korur).

• Şuna yönelik döngü: mintTo her bir metadataUriiçin, her bir Standart ERC-721 event’ini ayrıştırarak onun tokenId’yi.

• Adlar otomatik numaralandırılır: NAME #1, NAME #2… mevcut NAME/DESCRIPTION.

Yine de, lütfen bunu kendi kodunuz için bir ilham kaynağı olarak kullanın, olduğu gibi kullanmayın!

Not: Eğer lazy minting yapmayı tercih ediyorsanız, thirdweb’in ERC-721 sözleşmesinde bir lazyMint yöntemi.