---
title: "如何開發 NFT 檢視器（5 步驟教學）"
description: "學習如何使用 Alchemy NFT API 打造一個能查看指定錢包地址 NFT 的 dapp。"
---

# 如何開發 NFT 檢視器（5 步驟教學）

NFT 智能合約最顯著的特點之一,就是它們並不包含作品、圖片或檔案本身,而只是指向這些檔案及其元資料的連結或 URI。這些代幣標記的是檔案與資料的鏈下位置,因此區塊鏈本身並不負責託管這些內容。

在下一節中我們會看到,ERC-1155 是 ERC-721 的改進版,因為它的程式碼同時適用於非同質化代幣與半同質化代幣(NFT)。

### NFT 檢視器需求

- Node >= 16.13.x
- Alchemy
- React.js
- TailwindCSS
- [NFT Viewer GitHub repo](https://github.com/alchemyplatform/Build-Your-NFT-Explorer)

### NFT 檢視器教學

以下是使用 Alchemy 建立 NFT 檢視器 dapp 的步驟。

### 1. 複製儲存庫

要複製 NFT Viewer 儲存庫,請開啟終端機並執行以下指令:

<CodeSnippet
  code={`git clone https://github.com/alchemyplatform/Build-Your-NFT-Explorer.git`}
  language="text"
  theme="dark"
/>

### 2. 安裝 npm

NPM 代表「node package manager」。要安裝 npm,只需在終端機中執行以下指令:

<CodeSnippet code={`npm install`} language="text" theme="dark" />

### 3. 在 Alchemy 建立帳號

建立一個[新的 Alchemy 帳號](https://dashboard.alchemy.com/signup/?a=d30817db92),或者如果你已經是 Alchemy 開發者,建立一個新的 app。

取得你的 app 後,複製你的 API Key。

<ImageBlock
  src="https://media.alchemy.com/1703688790-copy-api-key-on-alchemy.jpeg"
  alt="Alchemy 儀表板：建立新 app 並複製 API key"
  width={1223}
  height={1009}
  caption="建立新的 Alchemy app 並複製你的 API Key"
/>

### 4. 在 fetNFTs.js 檔案中替換你的 API key

接著在 src/utils/fetchNFTs.js 中,將 const apiKey = "demo"; 更新為你的 Alchemy API Key。

然後在終端機中執行以下指令:

<CodeSnippet code={`npm start`} language="text" theme="dark" />

### 5. 輸入錢包地址

要檢視某個錢包地址所持有的 NFT,只需輸入該錢包的地址字串。

<ImageBlock
  src="https://media.alchemy.com/1703688886-nft-viewer-user-interface.jpg"
  alt="NFT Viewer Dapp 使用者介面"
  width={1600}
  height={817}
  caption="NFT Viewer Dapp 使用者介面"
/>

想了解更多本教學的相關資訊,請參考[這支影片](https://www.youtube.com/watch?v=YehktV6LSqw)!

### 使用 Alchemy NFT API

Alchemy 的 NFT API 讓你能快速取得區塊鏈上關於 NFT 的所有所需資訊,並支援 Ethereum、Polygon、Arbitrum、Optimism 以及 Ethereum 測試網。

現在你不必再手動掃描、索引與儲存資料,只需提交一次請求,即可取得 ERC-721 與 ERC-1155 代幣的特定 NFT 資訊。這包括找出某地址持有的所有 NFT,或取得某個 NFT 代幣的元資料/屬性等資訊。

如需更多資訊,請參閱 [NFT API 文件。](https://www.alchemy.com/docs/reference/nft-api-quickstart)

## 什麼是 NFT(非同質化代幣)?

**「NFT」一詞指的是代表現實世界物品的數位資產,例如藝術品、音樂或電玩遊戲資產。**‍

儘管 NFT 自 2014 年才問世,但用它來買賣數位藝術品的做法仍持續受到歡迎。如今 Ethereum 上有多種 NFT 智能合約實作方式,其中兩種主要代幣標準是 [ERC-721 與 ERC-1155](https://www.alchemy.com/blog/comparing-erc-721-to-erc-1155)。

### 什麼是 ERC-721 代幣?

ERC721 代幣自 2017 年 9 月首次以 Ethereum 改進提案(EIP)形式發布以來,也被稱為非同質化代幣(NFT),讓開發者能夠將 Ethereum 區塊鏈上任意資料的所有權代幣化。

ERC-721 定義了智能合約在技術上必須實作的最小介面。這個基本介面支援代幣的持有、交易與管理。ERC-721 並不要求代幣相關資訊的標準,也不排除加入超出最低要求的功能。

ERC-721 代幣標準大幅擴展了代幣的設計空間。由於每個非同質化代幣都連結到一個獨特的身分,因此對其持有者而言都是獨一無二的。相對地,遵循 ERC-20 代幣標準的代幣是同質化的,意味著它們可以互相替代使用。

[Dapper Labs](https://www.alchemy.com/dapps/dapper-labs) 的技術長 Dieter Shirley 設計了 ERC-721,最初是作為一份 EIP(Ethereum 改進提案)草案,最終成為遊戲 [CryptoKitties](https://www.alchemy.com/dapps/cryptokitties) 的基礎。其他 ERC-721 的作者還包括 William Entriken、Jacob Evans 與 Nastassia Sachs。

### 什麼是 ERC-1155?

**ERC-1155 代幣標準用於半同質化代幣,由 Enjin 的一組開發者所建立,用以解決 ERC20 與 ERC721 代幣的限制。**

在此之前,ERC-20 與 ERC-721 分別要求為每種同質化或非同質化貨幣建立獨立的合約。此外,舊有標準將每個合約劃分到不同的地址,限制了某些功能的實現。結果導致 Ethereum 區塊鏈上散布著大量未使用的位元組碼。

## 結語

雖然 NFT 仍處於發展初期,但它們已經為藝術家帶來了非凡的好處,例如數位所有權、新的收入來源,以及更強的社群參與度。

若要繼續了解 NFT [應用](https://www.alchemy.com/dapps/top/defi-dapps),可以參考以下相關教學:

1. [如何建立 ERC-721 代幣](https://www.alchemy.com/docs/how-to-interact-with-erc-721-tokens-in-solidity)
1. [如何建立 ERC-1155 代幣](https://www.alchemy.com/docs/how-to-interact-with-erc-20-tokens-in-solidity)
1. [如何用 ERC721A 批次鑄造 NFT](https://www.alchemy.com/overviews/erc721-vs-erc721a-batch-minting-nfts)