Web3 & DApp Development Fundamentals · Pelajaran

Metadata Token

tokenURI dan JSON

Metadata Token adalah pelajaran Web3 & DApp Development Fundamentals gratis di CoddyKit. Ini adalah pelajaran 3 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Web3 & DApp Development Fundamentals, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Web3 & DApp Development Fundamentals mencakup 4 pelajaran total.

Bagian dari pelajaran ini belum diterjemahkan dan ditampilkan dalam bahasa Inggris.

What Is Token Metadata?

Metadata describes what an NFT actually represents: its name, description, image, and attributes. While ownership is stored on-chain, the descriptive data usually lives off-chain in a JSON file.

The link between them is the tokenURI.

The tokenURI Function

The metadata extension defines tokenURI(tokenId), which returns a URL pointing to the JSON metadata for that specific token.

<code>function tokenURI(uint256 tokenId) external view returns (string memory);</code>

The Metadata JSON Schema

The standard JSON has a few well-known fields. Marketplaces like OpenSea read these to display the NFT.

<code>{
  'name': 'Cool Cat #42',
  'description': 'A very cool cat.',
  'image': 'ipfs://Qm.../42.png',
  'attributes': [
    { 'trait_type': 'Color', 'value': 'Blue' }
  ]
}</code>

Attributes and Traits

The attributes array lists traits as objects with trait_type and value. These power rarity rankings and filtering on marketplaces.

<code>'attributes': [
  { 'trait_type': 'Background', 'value': 'Sky' },
  { 'trait_type': 'Level', 'value': 5 }
]</code>

Per-Token URIs

One approach stores a unique URI per token in a mapping. This is flexible but uses more storage.

<code>mapping(uint256 => string) private _tokenURIs;

function tokenURI(uint256 id) public view returns (string memory) {
    return _tokenURIs[id];
}</code>

Base URI Pattern

A cheaper approach stores a single base URI and appends the token id. This works when files are named sequentially like 1.json, 2.json, and so on.

<code>string private baseURI = 'ipfs://QmFolder/';

function tokenURI(uint256 id) public view returns (string memory) {
    return string(abi.encodePacked(baseURI, _toString(id), '.json'));
}</code>

Why IPFS?

Hosting metadata on a normal server is risky: if the server goes down or the file changes, the NFT breaks. IPFS uses content-addressed hashes, so a URI like ipfs://Qm... always points to the exact same immutable content.

Content Addressing

An IPFS hash (CID) is derived from the file's content. Change one byte and the hash changes. This guarantees the metadata cannot be silently swapped, preserving the NFT's integrity.

<code>// image: 'ipfs://bafybeih.../art.png'
// the CID itself proves the content is unaltered</code>

On-Chain Metadata

For fully decentralized NFTs, you can store metadata entirely on-chain by returning a base64-encoded data URI. This costs more gas but removes any off-chain dependency.

<code>// returns: data:application/json;base64,<encoded JSON>
// fully on-chain, no IPFS or server needed</code>

Reveal Mechanics

Many drops mint with a placeholder URI, then switch the base URI after sale to reveal the real art. This prevents buyers from sniping rare traits before mint.

<code>bool public revealed = false;

function setRevealed() public onlyOwner {
    baseURI = 'ipfs://QmRealArt/';
    revealed = true;
}</code>

How Marketplaces Read It

A marketplace calls tokenURI(id), fetches the returned JSON, then loads the image and renders attributes. Following the standard schema is what makes your NFT display correctly everywhere.

Quick Check

Test your understanding of token metadata.

Recap

You learned about NFT metadata:

tokenURI(id) returns a link to the token's JSON metadata
The JSON holds name, description, image, and attributes
Use per-token URIs or a base URI + id pattern
IPFS content addressing keeps metadata immutable; on-chain metadata removes dependencies entirely
Reveal patterns hide art until after mint

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Metadata Token” gratis?

Ya — teks lengkap “Metadata Token” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Web3 & DApp Development Fundamentals, upgrade ke CoddyKit PRO. Kursus Web3 & DApp Development Fundamentals mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Metadata Token”?

tokenURI dan JSON Kamu berlatih Web3 & DApp Development Fundamentals dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai Web3 & DApp Development Fundamentals?

Tidak diperlukan pengalaman sebelumnya. Web3 & DApp Development Fundamentals di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 4.

Berapa lama pelajaran “Metadata Token” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran Web3 & DApp Development Fundamentals ini?

Ya. Setiap pelajaran Web3 & DApp Development Fundamentals menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

← Kembali ke Web3 & DApp Development Fundamentals