Les utilisateurs ayant lu les articles précédents devraient savoir que pour les jetons du protocole ERC-20, nous pouvons les échanger via des DEX représentés par Uniswap, ce qui permet la décentralisation. Alors, qu'en est-il du protocole ERC-721, c'est-à-dire des NFT, comment pouvons-nous réaliser des échanges décentralisés ?
Actuellement, certaines des principales plateformes d'échange de NFT utilisent un système de commandes, comme si chaque article était placé sur les étagères d'un supermarché. Les acheteurs peuvent ramener chez eux un article s'ils estiment que le prix est approprié.
Cet article expliquera comment réaliser des transactions décentralisées de NFT en écrivant un contrat intelligent et une simple page frontale. Notez que cet article est uniquement destiné à des fins d'apprentissage et ne peut pas être utilisé dans un environnement de production.
NFT (Jeton Non Fongible)
NFT est un jeton non fongible, c'est-à-dire que chaque Token est non fongible, différent, et il suit le protocole ERC-721. En général, chaque NFT affichera une image différente dans le portefeuille, et chaque groupe de NFT aura un ID unique pour les distinguer.
En raison des caractéristiques des NFT, il n'est pas possible de fixer un prix comme avec l'ERC-20 via une courbe de prix - car chaque jeton est unique. Ainsi, la méthode de trading la plus courante actuellement est sous forme de carnet de commandes.
Transactions sur le carnet d'ordres
Le modèle de livre de commandes, en termes simples, signifie que le prix des marchandises est fixé par l'homme, contrairement à Uniswap qui calcule les prix par courbes de prix. En général, le livre de commandes se divise en deux modes de trading : l'un est l'ordre de prix, c'est-à-dire que le vendeur fixe un prix de vente selon son propre jugement, et si un acheteur trouve le prix convenable, il peut acheter. L'autre est l'ordre d'achat, c'est-à-dire que l'acheteur émet un ordre d'achat en fonction de ses besoins, et lorsque le vendeur trouve le prix adéquat, il peut vendre.
En général, le prix d'un ordre d'achat sera inférieur au prix d'un ordre de vente. Cet article ne présente que le premier type de méthode de tarification.
Fonctionnalités de la DEX NFT
Les fonctionnalités de base d'un DEX NFT devraient inclure les fonctionnalités suivantes :
Mettre en vente un produit : Mettre un NFT en vente selon un prix fixé.
Acheter des produits : acheter selon le prix du NFT
Frais de transaction DEX : des frais de transaction sont prélevés proportionnellement au prix de la transaction.
produit en stock
Pour mettre en ligne des produits, il faut faire les choses suivantes :
Frontend : L'utilisateur choisit son propre NFT, définit un prix et clique sur mettre en vente.
Contrat : L'utilisateur doit définir les autorisations pour le contrat, ce qui permet de contrôler le NFT de l'utilisateur.
Ainsi, les produits sont considérés comme étant mis en vente. Dans le contrat, il est nécessaire de maintenir une carte des prix des produits mis en vente par les utilisateurs, cette partie des données peut généralement être gérée par un service centralisé pour alléger la charge du contrat, mais dans cet article, ces données de carte seront maintenues dans le contrat.
acheter des biens
Lors de l'achat de produits, plusieurs choses peuvent se produire :
Front-end : L'utilisateur choisit un NFT qu'il souhaite acheter et clique sur acheter.
Contrat : Appeler le protocole, transférer l'argent de l'utilisateur au vendeur du NFT et transférer le NFT à l'acheteur.
Réaliser un DEX NFT
Dans ce chapitre, nous allons créer un DEX NFT à partir de zéro. C'est l'adresse DEX déjà déployée par l'auteur : nft-dex-frontend.vercel.app.
1. Créer un NFT
Pour les besoins des tests, il serait préférable d'avoir notre propre NFT. Nous pouvons rapidement créer un NFT basé sur le protocole ERC-721 via Remix, qui fournit un modèle correspondant.
Nous pouvons facilement déployer un NFT selon le modèle. Bien sûr, vous pouvez également sauter cette étape et utiliser directement le NFT que nous avons préparé.
2. Rédaction de contrat
Nos méthodes de contrat devraient inclure les méthodes suivantes :
2.1. Vendeur met en ligne NFT
Le vendeur doit spécifier le NFT à vendre ainsi que le prix correspondant. Lors de la mise en ligne, l'utilisateur doit signer la méthode d'autorisation du NFT, permettant à notre contrat intelligent d'avoir le droit d'opérer ce NFT, de sorte que lorsque un acheteur effectue un achat, cette transaction peut être conclue automatiquement.
Donc, le processus devrait être le suivant : 1. L'utilisateur choisit son NFT ; 2. Définit le prix, qui peut être en stablecoins USDT, USDC ou en ETH ; 3. Autorise le NFT au contrat.
Après cela, vous pouvez appeler la méthode de mise en ligne du contrat, qui doit faire les choses suivantes :
Vérifier la propriété des NFT
Ajouter un enregistrement de mise en vente
Événement déclencheur de la mise en vente
2.2. L'acheteur achète un NFT
Lors de l'achat d'un NFT, l'utilisateur n'a qu'à choisir le NFT qu'il souhaite et à payer le jeton correspondant. Au niveau du contrat, les étapes suivantes seront exécutées : 1. Lire les données NFT correspondantes à partir des « listings » ; 2. Calculer les frais en fonction du prix du NFT et déduire cette partie du prix de vente ; 3. Transférer le NFT au propriétaire ; 4. Déclencher l'événement d'achat.
2.3. Annuler la mise en vente
Bien sûr, le vendeur peut estimer que le prix n'est pas approprié et choisir d'annuler la mise en vente. On peut voir que nous avons conservé un champ isActive à l'endroit où nous sauvegardons les informations de mise en vente, afin d'indiquer si le produit est valide. Par conséquent, lors de l'annulation de la mise en vente, il suffit de définir ce champ sur false.
2.4. Retrait des frais
Le DEX peut percevoir des frais de transaction sur chaque transaction, ces frais peuvent être stockés dans le contrat ou transférés vers une autre de vos propres adresses. Cet article adopte la méthode de stockage dans le contrat.
Jusqu'ici, les fonctionnalités de base de notre contrat sont considérées comme complètes.
3. Développement de l'interface DEX
Avant de commencer, nous devons préparer quelques outils, qui incluent les outils suivants :
Ant Design Web3 : utilisé pour la connexion de portefeuille et l'affichage des cartes NFT.
Wagmi : utilisé pour interagir avec le portefeuille.
Nextjs + Vercel : Déployer notre projet.
Notre application frontale devrait contenir trois pages : Mint, Buy et Portfolio. Mint est destiné à permettre aux utilisateurs de mint notre NFT, uniquement à des fins de démonstration. Buy, quant à lui, est notre marché DEX où les utilisateurs peuvent acheter nos NFT. Dans Portfolio, les utilisateurs peuvent mettre en ligne ou retirer leurs NFT.
3.1. Connecter le portefeuille
Connectez le portefeuille de l'utilisateur, utilisez Ant Design Web3 pour l'implémenter.
Le processus de connexion au portefeuille de l'utilisateur est très simple, il suffit d'utiliser le composant de connexion fourni par Ant Design Web3.
Tout d'abord, nous encapsulons le projet dans un Provider, ce qui nous permettra d'utiliser les capacités d'Ant Design Web3 dans le code suivant. De plus, comme nous devons nous connecter à la chaîne de test sepolia, pour des raisons de vitesse, il est recommandé d'utiliser certains services de nœuds pour améliorer la vitesse de requête des données. Ici, j'utilise le point de terminaison de ZAN, qui est très adapté à l'environnement Asie-Pacifique, rapide et très rentable, et prend en charge de nombreuses chaînes.
Ensuite, placez un bouton de connexion à l'endroit où vous devez connecter le portefeuille :
Ainsi, c'est fait, c'est très simple.
3.2. Frappage
Mint un NFT, obtenez des jetons de test en vous rendant
Sur la page Mint, nous pouvons Mint des NFT destinés aux tests. Mint est une opération d'écriture de contrat, ici nous allons utiliser la méthode useWriteContract de wagmi. Nous devons spécifier l'adresse du contrat, l'ABI du contrat et les paramètres du contrat.
Ensuite, il suffit de confirmer dans le portefeuille pour que le Mint soit réussi.
3.3. Portefeuille
Gérer les NFT des utilisateurs
Ici, il est nécessaire d'afficher tous les NFT de l'utilisateur. Nous pouvons utiliser certaines API NFT pour les obtenir, ici nous utilisons l'API d'opensea, car il n'y a pas beaucoup d'API NFT prenant en charge la chaîne de test sepolia.
Après avoir obtenu la liste des NFT de l'utilisateur, il est nécessaire de déterminer s'ils sont déjà mis en vente. Les NFT non mis en vente peuvent être mis en vente, tandis que ceux déjà en vente peuvent être retirés. La méthode de détermination consiste à utiliser la méthode « getSellerListings » dans le contrat DEX pour récupérer les NFT que l'utilisateur a déjà mis en vente, puis à vérifier le champ « isAlive » de ces NFT pour déterminer s'ils sont en vente.
Lors de la mise en vente, il est nécessaire d'appeler la méthode de contrat « listNFT », et lors de l'annulation, il faut appeler la méthode « cancelListing ». Avant de mettre en vente, il est également nécessaire d'appeler la méthode d'autorisation NFT, afin d'autoriser le NFT au contrat, de sorte qu'après la conclusion de la transaction, ce NFT puisse être automatiquement transféré à l'acheteur.
3.4. Acheter
Dans Buy, vous pouvez acheter des NFT
Tout d'abord, nous devons afficher les NFT déjà listés. Semblable à l'affichage des NFT existants d'un utilisateur dans le Portfolio, la différence ici est que l'un est global, ne se limitant plus à un utilisateur spécifique, et l'autre nécessite seulement d'afficher les NFT isAlive.
Utilisez la méthode « purchaseNFT » lors de l'achat. Lorsque vous appelez cette méthode, vous devez payer le prix de vente en ETH.
Ici, cette « value » est l'ETH que l'acheteur doit payer.
Ainsi, une page frontale DEX comprenant toutes les capacités de base est terminée, nous pouvons la déployer sur Vercel.
Cet article a été rédigé par l'équipe ZAN (compte X @zan_team) et Yeezo (compte X @GaoYeezo 75065).
Le contenu est fourni à titre de référence uniquement, il ne s'agit pas d'une sollicitation ou d'une offre. Aucun conseil en investissement, fiscalité ou juridique n'est fourni. Consultez l'Avertissement pour plus de détails sur les risques.
Web3 Débutant série : réaliser un DEX NFT depuis zéro
Les utilisateurs ayant lu les articles précédents devraient savoir que pour les jetons du protocole ERC-20, nous pouvons les échanger via des DEX représentés par Uniswap, ce qui permet la décentralisation. Alors, qu'en est-il du protocole ERC-721, c'est-à-dire des NFT, comment pouvons-nous réaliser des échanges décentralisés ?
Actuellement, certaines des principales plateformes d'échange de NFT utilisent un système de commandes, comme si chaque article était placé sur les étagères d'un supermarché. Les acheteurs peuvent ramener chez eux un article s'ils estiment que le prix est approprié.
Cet article expliquera comment réaliser des transactions décentralisées de NFT en écrivant un contrat intelligent et une simple page frontale. Notez que cet article est uniquement destiné à des fins d'apprentissage et ne peut pas être utilisé dans un environnement de production.
NFT (Jeton Non Fongible)
NFT est un jeton non fongible, c'est-à-dire que chaque Token est non fongible, différent, et il suit le protocole ERC-721. En général, chaque NFT affichera une image différente dans le portefeuille, et chaque groupe de NFT aura un ID unique pour les distinguer.
En raison des caractéristiques des NFT, il n'est pas possible de fixer un prix comme avec l'ERC-20 via une courbe de prix - car chaque jeton est unique. Ainsi, la méthode de trading la plus courante actuellement est sous forme de carnet de commandes.
Transactions sur le carnet d'ordres
Le modèle de livre de commandes, en termes simples, signifie que le prix des marchandises est fixé par l'homme, contrairement à Uniswap qui calcule les prix par courbes de prix. En général, le livre de commandes se divise en deux modes de trading : l'un est l'ordre de prix, c'est-à-dire que le vendeur fixe un prix de vente selon son propre jugement, et si un acheteur trouve le prix convenable, il peut acheter. L'autre est l'ordre d'achat, c'est-à-dire que l'acheteur émet un ordre d'achat en fonction de ses besoins, et lorsque le vendeur trouve le prix adéquat, il peut vendre.
En général, le prix d'un ordre d'achat sera inférieur au prix d'un ordre de vente. Cet article ne présente que le premier type de méthode de tarification.
Fonctionnalités de la DEX NFT
Les fonctionnalités de base d'un DEX NFT devraient inclure les fonctionnalités suivantes :
produit en stock
Pour mettre en ligne des produits, il faut faire les choses suivantes :
Ainsi, les produits sont considérés comme étant mis en vente. Dans le contrat, il est nécessaire de maintenir une carte des prix des produits mis en vente par les utilisateurs, cette partie des données peut généralement être gérée par un service centralisé pour alléger la charge du contrat, mais dans cet article, ces données de carte seront maintenues dans le contrat.
acheter des biens
Lors de l'achat de produits, plusieurs choses peuvent se produire :
Réaliser un DEX NFT
Dans ce chapitre, nous allons créer un DEX NFT à partir de zéro. C'est l'adresse DEX déjà déployée par l'auteur : nft-dex-frontend.vercel.app.
1. Créer un NFT
Pour les besoins des tests, il serait préférable d'avoir notre propre NFT. Nous pouvons rapidement créer un NFT basé sur le protocole ERC-721 via Remix, qui fournit un modèle correspondant.
Nous pouvons facilement déployer un NFT selon le modèle. Bien sûr, vous pouvez également sauter cette étape et utiliser directement le NFT que nous avons préparé.
2. Rédaction de contrat
Nos méthodes de contrat devraient inclure les méthodes suivantes :
2.1. Vendeur met en ligne NFT
Le vendeur doit spécifier le NFT à vendre ainsi que le prix correspondant. Lors de la mise en ligne, l'utilisateur doit signer la méthode d'autorisation du NFT, permettant à notre contrat intelligent d'avoir le droit d'opérer ce NFT, de sorte que lorsque un acheteur effectue un achat, cette transaction peut être conclue automatiquement.
Donc, le processus devrait être le suivant : 1. L'utilisateur choisit son NFT ; 2. Définit le prix, qui peut être en stablecoins USDT, USDC ou en ETH ; 3. Autorise le NFT au contrat.
Après cela, vous pouvez appeler la méthode de mise en ligne du contrat, qui doit faire les choses suivantes :
2.2. L'acheteur achète un NFT
Lors de l'achat d'un NFT, l'utilisateur n'a qu'à choisir le NFT qu'il souhaite et à payer le jeton correspondant. Au niveau du contrat, les étapes suivantes seront exécutées : 1. Lire les données NFT correspondantes à partir des « listings » ; 2. Calculer les frais en fonction du prix du NFT et déduire cette partie du prix de vente ; 3. Transférer le NFT au propriétaire ; 4. Déclencher l'événement d'achat.
2.3. Annuler la mise en vente
Bien sûr, le vendeur peut estimer que le prix n'est pas approprié et choisir d'annuler la mise en vente. On peut voir que nous avons conservé un champ isActive à l'endroit où nous sauvegardons les informations de mise en vente, afin d'indiquer si le produit est valide. Par conséquent, lors de l'annulation de la mise en vente, il suffit de définir ce champ sur false.
2.4. Retrait des frais
Le DEX peut percevoir des frais de transaction sur chaque transaction, ces frais peuvent être stockés dans le contrat ou transférés vers une autre de vos propres adresses. Cet article adopte la méthode de stockage dans le contrat.
Jusqu'ici, les fonctionnalités de base de notre contrat sont considérées comme complètes.
3. Développement de l'interface DEX
Avant de commencer, nous devons préparer quelques outils, qui incluent les outils suivants :
Notre application frontale devrait contenir trois pages : Mint, Buy et Portfolio. Mint est destiné à permettre aux utilisateurs de mint notre NFT, uniquement à des fins de démonstration. Buy, quant à lui, est notre marché DEX où les utilisateurs peuvent acheter nos NFT. Dans Portfolio, les utilisateurs peuvent mettre en ligne ou retirer leurs NFT.
3.1. Connecter le portefeuille
Le processus de connexion au portefeuille de l'utilisateur est très simple, il suffit d'utiliser le composant de connexion fourni par Ant Design Web3.
Tout d'abord, nous encapsulons le projet dans un Provider, ce qui nous permettra d'utiliser les capacités d'Ant Design Web3 dans le code suivant. De plus, comme nous devons nous connecter à la chaîne de test sepolia, pour des raisons de vitesse, il est recommandé d'utiliser certains services de nœuds pour améliorer la vitesse de requête des données. Ici, j'utilise le point de terminaison de ZAN, qui est très adapté à l'environnement Asie-Pacifique, rapide et très rentable, et prend en charge de nombreuses chaînes.
Ensuite, placez un bouton de connexion à l'endroit où vous devez connecter le portefeuille :
3.2. Frappage
Sur la page Mint, nous pouvons Mint des NFT destinés aux tests. Mint est une opération d'écriture de contrat, ici nous allons utiliser la méthode useWriteContract de wagmi. Nous devons spécifier l'adresse du contrat, l'ABI du contrat et les paramètres du contrat.
Ensuite, il suffit de confirmer dans le portefeuille pour que le Mint soit réussi.
3.3. Portefeuille
Ici, il est nécessaire d'afficher tous les NFT de l'utilisateur. Nous pouvons utiliser certaines API NFT pour les obtenir, ici nous utilisons l'API d'opensea, car il n'y a pas beaucoup d'API NFT prenant en charge la chaîne de test sepolia.
Après avoir obtenu la liste des NFT de l'utilisateur, il est nécessaire de déterminer s'ils sont déjà mis en vente. Les NFT non mis en vente peuvent être mis en vente, tandis que ceux déjà en vente peuvent être retirés. La méthode de détermination consiste à utiliser la méthode « getSellerListings » dans le contrat DEX pour récupérer les NFT que l'utilisateur a déjà mis en vente, puis à vérifier le champ « isAlive » de ces NFT pour déterminer s'ils sont en vente.
Lors de la mise en vente, il est nécessaire d'appeler la méthode de contrat « listNFT », et lors de l'annulation, il faut appeler la méthode « cancelListing ». Avant de mettre en vente, il est également nécessaire d'appeler la méthode d'autorisation NFT, afin d'autoriser le NFT au contrat, de sorte qu'après la conclusion de la transaction, ce NFT puisse être automatiquement transféré à l'acheteur.
3.4. Acheter
Tout d'abord, nous devons afficher les NFT déjà listés. Semblable à l'affichage des NFT existants d'un utilisateur dans le Portfolio, la différence ici est que l'un est global, ne se limitant plus à un utilisateur spécifique, et l'autre nécessite seulement d'afficher les NFT isAlive.
Utilisez la méthode « purchaseNFT » lors de l'achat. Lorsque vous appelez cette méthode, vous devez payer le prix de vente en ETH.
Ici, cette « value » est l'ETH que l'acheteur doit payer.
Ainsi, une page frontale DEX comprenant toutes les capacités de base est terminée, nous pouvons la déployer sur Vercel.
Cet article a été rédigé par l'équipe ZAN (compte X @zan_team) et Yeezo (compte X @GaoYeezo 75065).