# ゼロからNFT分散化取引プラットフォームを構築ERC-721プロトコルに従ったNFTに関しては、分散化取引の実現方法がERC-20トークンとは異なります。現在の主流なNFT取引モデルは、スーパーマーケットの棚に並ぶ商品の展示に似ており、買い手は気に入ったNFTを直接選んで購入できます。本文では、スマートコントラクトとシンプルなフロントエンドインターフェースを通じて、基礎的なNFT分散化取引プラットフォームを実現する方法を紹介します。注意が必要なのは、これは学習目的のデモプロジェクトであり、直接生産環境で使用するのには適していません。! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/social/moments-5d391cb28a9a6eafd3ef56f39b0dc5bc)## NFTの特徴と取引方法NFTは非代替性トークンを意味し、各トークンは唯一無二です。通常、NFTはウォレット内で異なる画像を表示し、ユニークなIDで識別されます。NFTのこの特性により、ERC-20トークンのように価格曲線を通じて価格を決定することはできません。現在一般的なNFTの取引方法は、オーダーブックの形式を通じて行われています。注文書取引モードには主に2種類があります:1. 価格設定: 売り手が価格を設定し、買い手が適切だと感じれば購入します2. 求購単:バイヤーが購買の需要と価格を発表し、売り手が適切だと感じたら販売することができます本文では、価格注文取引方法に重点を置いて紹介します。! [Web3初心者シリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-65746508ae31b6e3e418c31b6e8bcdc2)## NFT取引プラットフォームの核心機能基本的なNFT取引プラットフォームは、以下のいくつかのコア機能を含むべきです:1. NFTを出品: 売り手が価格を設定し、NFTを出品します。2. NFTの購入:バイヤーは定価でNFTを購入します3. 手数料の徴収: 成交価格に基づいて一定の割合の手数料を徴収します。### NFTの上場プロセス1. フロントエンド:ユーザーがNFTを選択し、価格を設定する2. 契約:ユーザーは契約にNFTの操作権限を付与します3. 契約:リスティング情報を記録する### NFT購入プロセス1. フロントエンド: ユーザーが購入したいNFTを選択します2. 契約: NFTを買い手に移転し、売り手に振込する! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/social/moments-f6f730a4e82de02e49d30d9089e8716e)## NFT取引プラットフォームの実現次に、ゼロからシンプルなNFT取引プラットフォームを実現します。### 1. テスト用NFTを作成する私たちはRemixを使用して、テスト用のERC-721プロトコルに準拠したNFTコントラクトを迅速にデプロイできます。! [Web3スターターシリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-b6b3dc59b2ca9328bb852240a2181119)### 2. スマートコントラクトを作成する契約は以下の主要なメソッドを実装する必要があります:#### 2.1 売り手がNFTを出品するプロセス:1. NFTの所有権を確認する2. リスティングレコードを追加する 3. 上場イベントをトリガーする#### 2.2 バイヤーがNFTを購入するプロセス:1. NFTの上場データを読み取る2. 手数料を計算して差し引く3. NFTを買い手に転送する4. 購入イベントをトリガーする#### 2.3 上架の取り消し上架記録を無効としてマークするだけです。#### 2.4 手数料の引き出し累積した手数料を引き出す。! [Web3スターターシリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-8dc32f1a83e46e857340f9841df2c7f5)### 3. フロントエンドインターフェースの開発私たちは次のツールを使用します:- Ant Design Web3:ウォレットを接続し、NFTを表示します- Wagmi:ウォレットとインタラクション- Next.js + Vercel:プロジェクトをデプロイするフロントエンドは3つの主要なページを実装する必要があります:- Mint:テストNFTを作成する- 購入:NFTマーケットプレイス- ポートフォリオ: ユーザーのNFTを管理する#### 3.1 ウォレットを接続するAnt Design Web3コンポーネントを使用してウォレット接続機能を実装します。! [Web3初心者シリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-64251e5648f68085d608a40fe42097c4)#### 3.2 ミントページ テストNFTを作成するために、契約のmintメソッドを呼び出します。! [Web3スターターシリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-b47304559c5b8978028d581df19049c8)#### 3.3 ポートフォリオページユーザーが保有するNFTを表示し、上架と下架の操作をサポートします。! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/social/moments-4dc46af090a3d3987626b915c0d5f1ac)#### 3.4 購入ページすべての上場しているNFTを表示し、購入機能をサポートします。! [Web3スターターシリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-4e5e1ba70137403b4ea0e0503378e14a)上記のステップを通じて、私たちは基本的なNFT分散化取引プラットフォームを実現しました。機能は比較的シンプルですが、NFT取引のコアロジックはすでに含まれています。この基盤の上に、さらに改良や最適化を行い、より多くの実際のアプリケーションシーンのニーズを満たすことができます。! [Web3スターターシリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-56f66de1a4bb30af91363bd5cc567e40)! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/social/moments-a11e2cb9eb62433a03adcf2abd7b56b5)! [Web3スターターシリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-0a338541b5f8b2aa130fb03a46027c47)! [Web3初心者シリーズ:NFT DEXをゼロから実装する](https://img-cdn.gateio.im/social/moments-6d344484abad011d83b96ff377ffae1f)
ゼロから始めるNFT分散化取引プラットフォームの完全ガイド
ゼロからNFT分散化取引プラットフォームを構築
ERC-721プロトコルに従ったNFTに関しては、分散化取引の実現方法がERC-20トークンとは異なります。現在の主流なNFT取引モデルは、スーパーマーケットの棚に並ぶ商品の展示に似ており、買い手は気に入ったNFTを直接選んで購入できます。
本文では、スマートコントラクトとシンプルなフロントエンドインターフェースを通じて、基礎的なNFT分散化取引プラットフォームを実現する方法を紹介します。注意が必要なのは、これは学習目的のデモプロジェクトであり、直接生産環境で使用するのには適していません。
! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/webp-social/moments-5d391cb28a9a6eafd3ef56f39b0dc5bc.webp)
NFTの特徴と取引方法
NFTは非代替性トークンを意味し、各トークンは唯一無二です。通常、NFTはウォレット内で異なる画像を表示し、ユニークなIDで識別されます。NFTのこの特性により、ERC-20トークンのように価格曲線を通じて価格を決定することはできません。現在一般的なNFTの取引方法は、オーダーブックの形式を通じて行われています。
注文書取引モードには主に2種類があります:
本文では、価格注文取引方法に重点を置いて紹介します。
! Web3初心者シリーズ:NFT DEXをゼロから実装する
NFT取引プラットフォームの核心機能
基本的なNFT取引プラットフォームは、以下のいくつかのコア機能を含むべきです:
NFTの上場プロセス
NFT購入プロセス
! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/webp-social/moments-f6f730a4e82de02e49d30d9089e8716e.webp)
NFT取引プラットフォームの実現
次に、ゼロからシンプルなNFT取引プラットフォームを実現します。
1. テスト用NFTを作成する
私たちはRemixを使用して、テスト用のERC-721プロトコルに準拠したNFTコントラクトを迅速にデプロイできます。
! Web3スターターシリーズ:NFT DEXをゼロから実装する
2. スマートコントラクトを作成する
契約は以下の主要なメソッドを実装する必要があります:
2.1 売り手がNFTを出品する
プロセス:
2.2 バイヤーがNFTを購入する
プロセス:
2.3 上架の取り消し
上架記録を無効としてマークするだけです。
2.4 手数料の引き出し
累積した手数料を引き出す。
! Web3スターターシリーズ:NFT DEXをゼロから実装する
3. フロントエンドインターフェースの開発
私たちは次のツールを使用します:
フロントエンドは3つの主要なページを実装する必要があります:
3.1 ウォレットを接続する
Ant Design Web3コンポーネントを使用してウォレット接続機能を実装します。
! Web3初心者シリーズ:NFT DEXをゼロから実装する
3.2 ミントページ
テストNFTを作成するために、契約のmintメソッドを呼び出します。
! Web3スターターシリーズ:NFT DEXをゼロから実装する
3.3 ポートフォリオページ
ユーザーが保有するNFTを表示し、上架と下架の操作をサポートします。
! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/webp-social/moments-4dc46af090a3d3987626b915c0d5f1ac.webp)
3.4 購入ページ
すべての上場しているNFTを表示し、購入機能をサポートします。
! Web3スターターシリーズ:NFT DEXをゼロから実装する
上記のステップを通じて、私たちは基本的なNFT分散化取引プラットフォームを実現しました。機能は比較的シンプルですが、NFT取引のコアロジックはすでに含まれています。この基盤の上に、さらに改良や最適化を行い、より多くの実際のアプリケーションシーンのニーズを満たすことができます。
! Web3スターターシリーズ:NFT DEXをゼロから実装する
! 【Web3スターターシリーズ:NFT DEXをゼロから実装する】(https://img-cdn.gateio.im/webp-social/moments-a11e2cb9eb62433a03adcf2abd7b56b5.webp)
! Web3スターターシリーズ:NFT DEXをゼロから実装する
! Web3初心者シリーズ:NFT DEXをゼロから実装する