Cara Membuat NFT Marketplace Sederhana

Membuat marketplace NFT adalah proyek ambisius yang melibatkan banyak komponen di Web3, mulai dari smart contract di blockchain hingga antarmuka pengguna yang interaktif. Ini adalah langkah besar dalam memahami ekosistem aset digital terdesentralisasi.

Tutorial ini akan memandu Anda melalui langkah-langkah dasar untuk membuat NFT Marketplace sederhana, berfokus pada konsep inti dan teknologi yang terlibat. Kita akan menggunakan Ethereum (atau testnet-nya) sebagai blockchain, Solidity untuk smart contract, dan React.js dengan ethers.js untuk frontend.

Memahami Komponen Utama NFT Marketplace

Sebuah marketplace NFT, bahkan yang sederhana, setidaknya memiliki komponen berikut:

NFT Smart Contract: Kontrak ini mendefinisikan standar NFT (ERC-721 atau ERC-1155), memungkinkan pembuatan (minting) NFT, dan mengelola kepemilikan NFT. Ini adalah aset digital unik yang akan diperdagangkan.
Marketplace Smart Contract: Kontrak ini adalah jantung dari marketplace. Ini mengelola daftar NFT untuk dijual, proses pembelian, lelang (jika ada), dan transfer dana antar pembeli dan penjual.
IPFS (InterPlanetary File System): Digunakan untuk menyimpan metadata NFT (gambar, deskripsi, atribut) secara terdesentralisasi. Smart contract NFT hanya akan menyimpan hash IPFS (CID) dari metadata ini.
Frontend (UI): Antarmuka pengguna di mana pengguna dapat melihat NFT, menghubungkan dompet MetaMask mereka, membeli NFT, atau bahkan menjual NFT mereka. Ini akan berinteraksi dengan kedua smart contract di atas.
Dompet Kripto (MetaMask): Untuk pengguna berinteraksi dengan dApp Anda, menandatangani transaksi, dan menyimpan aset digital mereka.

Langkah 1: Buat dan Deploy NFT Smart Contract (ERC-721)

Ini adalah kontrak dasar untuk membuat NFT.

A. Instal Lingkungan Pengembangan (Hardhat Direkomendasikan)

Hardhat adalah lingkungan pengembangan Ethereum yang bagus.

Bash

mkdir my-nft-marketplace
cd my-nft-marketplace
npm init -y
npm install --save-dev hardhat @nomiclabs/hardhat-ethers @openzeppelin/contracts ethers
npx hardhat
# Pilih 'Create a basic sample project'

B. Buat Smart Contract ERC-721 (contracts/MyNFT.sol)

Gunakan OpenZeppelin untuk kontrak yang aman dan teruji.

Solidity

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.20; // Ubah sesuai versi solidity di hardhat.config.js

import "@openzeppelin/contracts/token/ERC721/ERC721.sol";
import "@openzeppelin/contracts/token/ERC721/extensions/ERC721URIStorage.sol";
import "@openzeppelin/contracts/access/Ownable.sol";
import "@openzeppelin/contracts/utils/Counters.sol";

contract MyNFT is ERC721URIStorage, Ownable {
    using Counters for Counters.Counter;
    Counters.Counter private _tokenIdCounter;

    // Tambahkan referensi ke kontrak marketplace nanti
    address public marketplaceAddress;

    constructor(address initialOwner)
        ERC721("MyAwesomeNFT", "MANFT")
        Ownable(initialOwner)
    {}

    // Fungsi untuk menetapkan alamat marketplace
    function setMarketplaceAddress(address _marketplaceAddress) public onlyOwner {
        marketplaceAddress = _marketplaceAddress;
    }

    // Fungsi untuk mint NFT baru
    function mintNFT(address receiver, string memory tokenURI) public onlyOwner returns (uint256) {
        _tokenIdCounter.increment();
        uint256 newItemId = _tokenIdCounter.current();
        _mint(receiver, newItemId);
        _setTokenURI(newItemId, tokenURI);
        return newItemId;
    }

    // Fungsi untuk mengizinkan marketplace mengambil NFT
    function approve(address to, uint256 tokenId) public override {
        // Izinkan approval hanya jika pengirim adalah owner atau jika disetujui oleh owner
        require(_isApprovedOrOwner(msg.sender, tokenId), "ERC721: approve caller is not token owner or approved for all");
        super.approve(to, tokenId);
    }
}

C. Deploy NFT Smart Contract

Buat script deployment (scripts/deploy_nft.js):

JavaScript

const { ethers } = require("hardhat");

async function main() {
  const [deployer] = await ethers.getSigners();
  console.log("Deploying contracts with the account:", deployer.address);

  const MyNFT = await ethers.getContractFactory("MyNFT");
  const myNFT = await MyNFT.deploy(deployer.address); // Deploy dengan owner awal
  await myNFT.waitForDeployment(); // Menggunakan waitForDeployment()

  console.log("MyNFT deployed to:", await myNFT.getAddress());
}

main()
  .then(() => process.exit(0))
  .catch((error) => {
    console.error(error);
    process.exit(1);
  });

Konfigurasi Hardhat: Pastikan hardhat.config.js Anda terkonfigurasi untuk testnet (misal Sepolia) dan memiliki kunci pribadi serta URL RPC.

Jalankan Deployment:

Bash

npx hardhat run scripts/deploy_nft.js --network sepolia # atau network testnet lainnya

Catat alamat kontrak MyNFT yang di-deploy.

Langkah 2: Buat dan Deploy Marketplace Smart Contract

Kontrak ini akan mengelola fungsionalitas jual beli.

A. Buat Marketplace Smart Contract (contracts/NFTMarketplace.sol)

Solidity

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.20;

import "@openzeppelin/contracts/token/ERC721/IERC721.sol";
import "@openzeppelin/contracts/token/ERC20/IERC20.sol"; // Jika ingin menggunakan token ERC20 untuk pembayaran

contract NFTMarketplace {
    address payable public owner; // Pemilik marketplace
    IERC721 public nftContract; // Alamat kontrak NFT yang akan diperdagangkan

    // Struct untuk item yang dijual
    struct MarketItem {
        uint256 itemId;
        uint256 tokenId;
        address payable seller;
        uint256 price; // Harga dalam Wei (ETH) atau token ERC20
        bool sold;
    }

    // Pemetaan itemId ke MarketItem
    mapping(uint256 => MarketItem) public idToMarketItem;
    uint256 public itemCount;

    // Event saat item terdaftar atau terjual
    event ItemListed(
        uint256 itemId,
        uint256 tokenId,
        address seller,
        uint256 price
    );
    event ItemSold(
        uint256 itemId,
        uint256 tokenId,
        address buyer,
        uint256 price
    );

    constructor(address _nftContractAddress) {
        owner = payable(msg.sender);
        nftContract = IERC721(_nftContractAddress);
    }

    // Fungsi untuk mendaftarkan NFT untuk dijual
    function listItem(uint256 tokenId, uint256 price) public {
        require(price > 0, "Price must be at least 1");
        // Pastikan penjual adalah pemilik NFT
        require(nftContract.ownerOf(tokenId) == msg.sender, "You are not the owner of this NFT");
        // Pastikan marketplace diizinkan untuk mentransfer NFT
        require(nftContract.getApproved(tokenId) == address(this), "Marketplace not approved to transfer NFT");

        itemCount++;
        idToMarketItem[itemCount] = MarketItem(
            itemCount,
            tokenId,
            payable(msg.sender),
            price,
            false
        );

        emit ItemListed(itemCount, tokenId, msg.sender, price);
    }

    // Fungsi untuk membeli NFT
    function buyItem(uint256 itemId) public payable {
        MarketItem storage item = idToMarketItem[itemId];
        require(item.seller != address(0), "Item does not exist");
        require(!item.sold, "Item already sold");
        require(msg.value >= item.price, "Not enough ETH to cover item price");
        require(msg.sender != item.seller, "Cannot buy your own item");

        item.sold = true;
        
        // Transfer NFT ke pembeli
        nftContract.transferFrom(item.seller, msg.sender, item.tokenId);
        
        // Kirim pembayaran ke penjual
        (bool success, ) = item.seller.call{value: msg.value}("");
        require(success, "Failed to send ETH to seller");

        emit ItemSold(itemId, item.tokenId, msg.sender, item.price);
    }

    // Fungsi untuk membatalkan daftar NFT (jika belum terjual)
    function cancelListing(uint256 itemId) public {
        MarketItem storage item = idToMarketItem[itemId];
        require(item.seller == msg.sender, "You are not the seller");
        require(!item.sold, "Item already sold");

        item.sold = true; // Tandai sebagai terjual agar tidak bisa dibeli lagi
        // Optional: transfer NFT kembali ke owner jika diinginkan.
        // Jika NFT sudah di-approve ke marketplace, owner perlu mengambilnya kembali secara manual atau fungsi khusus
        // nftContract.transferFrom(address(this), msg.sender, item.tokenId); // Jika marketplace pegang NFT
    }
}

B. Deploy Marketplace Smart Contract

Buat script deployment (scripts/deploy_marketplace.js):

JavaScript

const { ethers } = require("hardhat");

async function main() {
  const [deployer] = await ethers.getSigners();
  console.log("Deploying contracts with the account:", deployer.address);

  // Ganti ini dengan alamat MyNFT yang sudah Anda deploy sebelumnya
  const nftContractAddress = "ALAMAT_CONTRACT_MYNFT_ANDA";

  const NFTMarketplace = await ethers.getContractFactory("NFTMarketplace");
  const marketplace = await NFTMarketplace.deploy(nftContractAddress);
  await marketplace.waitForDeployment();

  console.log("NFTMarketplace deployed to:", await marketplace.getAddress());

  // Penting: Setel alamat marketplace di kontrak NFT Anda
  const MyNFT = await ethers.getContractFactory("MyNFT");
  const myNFT = MyNFT.attach(nftContractAddress); // Attach ke kontrak NFT yang sudah ada
  await myNFT.setMarketplaceAddress(await marketplace.getAddress());
  console.log("Marketplace address set in MyNFT contract.");
}

main()
  .then(() => process.exit(0))
  .catch((error) => {
    console.error(error);
    process.exit(1);
  });

Jalankan Deployment:

Bash

npx hardhat run scripts/deploy_marketplace.js --network sepolia

Catat alamat kontrak NFTMarketplace.

Langkah 3: Siapkan IPFS untuk Metadata NFT

Anda perlu layanan pinning IPFS seperti Pinata, Infura, atau menggunakan node IPFS lokal.

A. Daftar di Pinata (Mudah untuk Pemula)

Buka Pinata Cloud dan daftar akun gratis.
Unggah gambar NFT Anda (misalnya image.png). Anda akan mendapatkan CID (misalnya Qm...).

Buat file JSON untuk metadata NFT (misalnya metadata.json):

JSON

{
  "name": "Nama NFT Saya",
  "description": "Deskripsi singkat tentang NFT ini.",
  "image": "ipfs://CID_GAMBAR_ANDA_DI_SINI" // Ganti dengan CID gambar dari Pinata
}

Unggah file metadata.json ini ke Pinata. Anda akan mendapatkan CID lain (misalnya QmXYZ...). Ini adalah tokenURI yang akan Anda gunakan saat minting NFT.

Langkah 4: Bangun Frontend dengan React.js dan Ethers.js

Ini adalah antarmuka pengguna marketplace.

A. Buat Proyek React

Bash

npx create-react-app nft-marketplace-frontend
cd nft-marketplace-frontend
npm install ethers

B. Konfigurasi Kontrak di Frontend

Buat file src/config.js:

JavaScript

export const NFT_CONTRACT_ADDRESS = "ALAMAT_CONTRACT_MYNFT_ANDA";
export const MARKETPLACE_CONTRACT_ADDRESS = "ALAMAT_CONTRACT_MARKETPLACE_ANDA";

export const NFT_ABI = [
    // Tempelkan ABI JSON dari MyNFT.sol di sini
];

export const MARKETPLACE_ABI = [
    // Tempelkan ABI JSON dari NFTMarketplace.sol di sini
];

Anda bisa mendapatkan ABI dari folder artifacts/contracts setelah deployment Hardhat.

C. Buat Komponen Utama (src/App.js)

Ini adalah kerangka untuk frontend Anda.

JavaScript

import React, { useState, useEffect } from 'react';
import { ethers } from 'ethers';
import { NFT_CONTRACT_ADDRESS, MARKETPLACE_CONTRACT_ADDRESS, NFT_ABI, MARKETPLACE_ABI } from './config';
import './App.css'; // Untuk styling sederhana

function App() {
  const [signer, setSigner] = useState(null);
  const [nftContract, setNftContract] = useState(null);
  const [marketplaceContract, setMarketplaceContract] = useState(null);
  const [walletAddress, setWalletAddress] = useState('');
  const [message, setMessage] = useState('');
  const [listedNFTs, setListedNFTs] = useState([]);

  // --- Fungsi Koneksi Dompet ---
  const connectWallet = async () => {
    if (typeof window.ethereum !== 'undefined') {
      try {
        const provider = new ethers.providers.Web3Provider(window.ethereum);
        await provider.send("eth_requestAccounts", []);
        const signer = provider.getSigner();
        setSigner(signer);
        setWalletAddress(await signer.getAddress());

        const nftContractInstance = new ethers.Contract(NFT_CONTRACT_ADDRESS, NFT_ABI, signer);
        const marketplaceContractInstance = new ethers.Contract(MARKETPLACE_CONTRACT_ADDRESS, MARKETPLACE_ABI, signer);
        
        setNftContract(nftContractInstance);
        setMarketplaceContract(marketplaceContractInstance);
        setMessage('Dompet terhubung!');

        // Listener untuk perubahan akun/jaringan MetaMask
        window.ethereum.on('accountsChanged', (accounts) => {
          if (accounts.length > 0) {
            setWalletAddress(accounts[0]);
            setMessage('Akun berubah.');
            fetchListedNFTs(); // Muat ulang data
          } else {
            setWalletAddress('');
            setSigner(null);
            setMessage('Dompet terputus.');
          }
        });

        window.ethereum.on('chainChanged', () => window.location.reload());

      } catch (error) {
        console.error("Error connecting wallet:", error);
        setMessage(`Error: ${error.message}`);
      }
    } else {
      setMessage("MetaMask tidak terdeteksi! Silakan instal.");
    }
  };

  // --- Fungsi Mint NFT (Hanya untuk Owner Kontrak NFT) ---
  const mintNFT = async () => {
    if (!nftContract || !signer) {
      setMessage("Hubungkan dompet dan pastikan kontrak termuat.");
      return;
    }
    setMessage("Meminta mint NFT... Konfirmasi di MetaMask.");
    try {
      const recipient = walletAddress; // Mint ke diri sendiri untuk contoh
      // Ganti dengan CID metadata NFT dari IPFS (misal: QmXYZ...)
      const tokenURI = "ipfs://QmbF6tQWpYnB8Zz3d5fXg7qH2o1c2v3x4y5z6a7b8c"; // Contoh saja
      const transaction = await nftContract.mintNFT(recipient, tokenURI);
      await transaction.wait();
      setMessage(`NFT berhasil di-mint! Tx Hash: ${transaction.hash}`);
      fetchListedNFTs(); // Muat ulang daftar NFT
    } catch (error) {
      console.error("Error minting NFT:", error);
      setMessage(`Error minting NFT: ${error.message}`);
    }
  };

  // --- Fungsi Daftar NFT untuk Dijual ---
  const listItem = async (tokenId, priceInEth) => {
    if (!marketplaceContract || !nftContract || !signer) {
      setMessage("Hubungkan dompet dan pastikan kontrak termuat.");
      return;
    }
    setMessage("Meminta persetujuan NFT dan daftar item... Konfirmasi di MetaMask.");
    try {
      // 1. Beri persetujuan marketplace untuk mentransfer NFT
      const approveTx = await nftContract.approve(MARKETPLACE_CONTRACT_ADDRESS, tokenId);
      await approveTx.wait();
      setMessage(`NFT ${tokenId} disetujui untuk marketplace. Sekarang mendaftarkan item...`);

      // 2. Daftarkan item di marketplace
      const priceWei = ethers.utils.parseEther(priceInEth.toString());
      const listTx = await marketplaceContract.listItem(tokenId, priceWei);
      await listTx.wait();
      setMessage(`NFT ${tokenId} berhasil didaftarkan dengan harga ${priceInEth} ETH!`);
      fetchListedNFTs(); // Muat ulang daftar NFT
    } catch (error) {
      console.error("Error listing NFT:", error);
      setMessage(`Error listing NFT: ${error.message}`);
    }
  };

  // --- Fungsi Beli NFT ---
  const buyItem = async (itemId, price) => {
    if (!marketplaceContract || !signer) {
      setMessage("Hubungkan dompet dan pastikan kontrak termuat.");
      return;
    }
    setMessage("Meminta pembelian NFT... Konfirmasi di MetaMask.");
    try {
      const transaction = await marketplaceContract.buyItem(itemId, { value: price });
      await transaction.wait();
      setMessage(`Berhasil membeli item ${itemId}!`);
      fetchListedNFTs(); // Muat ulang daftar NFT
    } catch (error) {
      console.error("Error buying NFT:", error);
      setMessage(`Error buying NFT: ${error.message}`);
    }
  };

  // --- Fungsi Ambil Data NFT yang Terdaftar ---
  const fetchListedNFTs = async () => {
    if (!marketplaceContract || !nftContract) return;

    setMessage("Memuat daftar NFT...");
    try {
      const currentItemCount = await marketplaceContract.itemCount();
      const nfts = [];
      for (let i = 1; i <= currentItemCount; i++) {
        const item = await marketplaceContract.idToMarketItem(i);
        if (!item.sold) {
          const tokenURI = await nftContract.tokenURI(item.tokenId);
          // Ambil metadata dari IPFS (gunakan gateway)
          const metadataUrl = tokenURI.replace('ipfs://', 'https://ipfs.io/ipfs/');
          const response = await fetch(metadataUrl);
          const metadata = await response.json();

          nfts.push({
            itemId: item.itemId.toNumber(),
            tokenId: item.tokenId.toNumber(),
            seller: item.seller,
            price: ethers.utils.formatEther(item.price), // Format harga ke ETH
            name: metadata.name,
            description: metadata.description,
            image: metadata.image.replace('ipfs://', 'https://ipfs.io/ipfs/')
          });
        }
      }
      setListedNFTs(nfts);
      setMessage("Daftar NFT berhasil dimuat.");
    } catch (error) {
      console.error("Error fetching listed NFTs:", error);
      setMessage(`Error memuat daftar NFT: ${error.message}`);
    }
  };

  // --- Efek Samping (Saat Komponen Dimuat/Diperbarui) ---
  useEffect(() => {
    if (nftContract && marketplaceContract) {
      fetchListedNFTs();
    }
  }, [nftContract, marketplaceContract]);

  return (
    <div className="App">
      <header className="App-header">
        <h1>NFT Marketplace Sederhana</h1>
        <button onClick={connectWallet}>
          {walletAddress ? `Terhubung: ${walletAddress.substring(0, 6)}...${walletAddress.substring(38)}` : "Hubungkan MetaMask"}
        </button>
        <p>{message}</p>
      </header>

      <div className="main-content">
        {walletAddress && (
          <section className="mint-section">
            <h2>Mint NFT Baru (Hanya Owner Kontrak)</h2>
            <button onClick={mintNFT}>Mint NFT</button>
            <small>Ini akan membuat NFT dan memberikannya ke dompet Anda.</small>
          </section>
        )}

        <section className="list-section">
          <h2>Daftar NFT untuk Dijual</h2>
          {/* Form untuk input Token ID dan Harga */}
          <input type="number" id="listTokenId" placeholder="Token ID NFT Anda" />
          <input type="number" step="0.001" id="listPrice" placeholder="Harga (ETH)" />
          <button onClick={() => listItem(
            document.getElementById('listTokenId').value,
            document.getElementById('listPrice').value
          )}>Daftarkan NFT</button>
          <small>Pastikan Anda sudah 'Approve' Marketplace untuk NFT ini di MetaMask jika diminta.</small>
        </section>

        <section className="marketplace-section">
          <h2>NFT Tersedia di Marketplace</h2>
          <div className="nft-grid">
            {listedNFTs.length === 0 ? (
              <p>Tidak ada NFT yang terdaftar saat ini.</p>
            ) : (
              listedNFTs.map((nft) => (
                <div key={nft.itemId} className="nft-card">
                  <img src={nft.image} alt={nft.name} />
                  <h3>{nft.name} (ID: {nft.tokenId})</h3>
                  <p>{nft.description}</p>
                  <p>Harga: {nft.price} ETH</p>
                  <p>Penjual: {nft.seller.substring(0, 6)}...</p>
                  {walletAddress && walletAddress.toLowerCase() !== nft.seller.toLowerCase() && (
                    <button onClick={() => buyItem(nft.itemId, ethers.utils.parseEther(nft.price))}>
                      Beli Sekarang
                    </button>
                  )}
                </div>
              ))
            )}
          </div>
        </section>
      </div>
    </div>
  );
}

export default App;

D. Styling Sederhana (src/App.css)

CSS

.App {
  text-align: center;
  font-family: Arial, sans-serif;
  padding: 20px;
}

.App-header {
  background-color: #282c34;
  padding: 20px;
  color: white;
  margin-bottom: 20px;
  border-radius: 8px;
}

button {
  background-color: #61dafb;
  color: #282c34;
  border: none;
  padding: 10px 20px;
  margin: 5px;
  border-radius: 5px;
  cursor: pointer;
  font-size: 16px;
}

button:hover {
  background-color: #21a1f1;
}

.main-content {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

section {
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

input {
  padding: 8px;
  margin: 5px;
  border-radius: 4px;
  border: 1px solid #ddd;
}

.nft-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 20px;
  margin-top: 20px;
  justify-content: center;
}

.nft-card {
  border: 1px solid #eee;
  padding: 15px;
  border-radius: 8px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.05);
  text-align: left;
}

.nft-card img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin-bottom: 10px;
}

E. Jalankan Frontend

Bash

npm start

Frontend akan terbuka di browser Anda (biasanya http://localhost:3000).

Alur Penggunaan Marketplace Sederhana Anda

Hubungkan MetaMask: Klik tombol "Hubungkan MetaMask". Beri izin di pop-up MetaMask.
Mint NFT: Jika Anda adalah pemilik kontrak MyNFT (alamat yang Anda gunakan untuk deploy), Anda bisa mengklik "Mint NFT". Ini akan membuat NFT baru dan memberikannya ke dompet Anda. Anda perlu mengganti tokenURI di kode mintNFT dengan CID metadata NFT yang sudah Anda unggah ke IPFS.
Daftarkan NFT:
- Masukkan Token ID dari NFT yang ingin Anda jual (lihat di MetaMask atau Etherscan setelah minting).
- Masukkan Harga dalam ETH.
- Klik "Daftarkan NFT".
- MetaMask akan muncul dua kali:
  - Pertama, untuk transaksi approve() pada kontrak NFT Anda, yang mengizinkan marketplace contract untuk mentransfer NFT dari dompet Anda. Ini penting!
  - Kedua, untuk transaksi listItem() pada kontrak marketplace.
Beli NFT:
- NFT yang berhasil didaftarkan akan muncul di bagian "NFT Tersedia di Marketplace".
- Klik "Beli Sekarang" pada NFT yang Anda inginkan (jika itu bukan NFT Anda sendiri).
- MetaMask akan muncul untuk konfirmasi transaksi pembelian dan pengiriman ETH.
- Setelah transaksi berhasil, NFT akan ditransfer ke dompet pembeli, dan penjual akan menerima ETH.

Penting: Pertimbangan Keamanan dan Skalabilitas

Keamanan:
- Audit Kontrak: Untuk marketplace sungguhan, smart contract harus diaudit secara profesional. Ada banyak vulnerability umum yang perlu dihindari.
- Penanganan Error: Implementasikan penanganan error yang lebih robust di frontend.
- Pembersihan: Kode ini hanya contoh. Untuk produksi, perlu banyak optimasi dan sanitasi input.
IPFS Pinning: Pastikan metadata NFT Anda di-pin dengan andal (menggunakan layanan pinning berbayar) agar tidak hilang dari jaringan IPFS.
Pengindeksan Data: Untuk marketplace yang lebih besar, memuat semua data NFT dan listing langsung dari blockchain di frontend tidak efisien. Anda akan memerlukan layanan pengindeksan data seperti The Graph untuk membuat subgraph yang dapat di-query dengan GraphQL.
Skalabilitas: Pertimbangkan menggunakan Layer-2 solution (Polygon, Arbitrum, Optimism) untuk biaya transaksi yang lebih rendah dan kecepatan yang lebih tinggi untuk pengalaman pengguna yang lebih baik.
Fitur Lanjutan: Lelang, penawaran, filter, pencarian, royalti kreator, lazy minting, integrasi dengan token ERC-20 lainnya untuk pembayaran, dll.

Meskipun ini adalah marketplace yang sangat sederhana, ini memberikan gambaran dasar tentang bagaimana komponen Web3 (blockchain, smart contract, IPFS, dompet) bekerja sama untuk menciptakan aplikasi terdesentralisasi yang fungsional. Ini adalah titik awal yang sangat baik untuk eksplorasi Anda di dunia NFT dan Web3.