Construindo um DEX NFT do zero: explicação detalhada de contratos inteligentes e implementação front-end

Construindo um DEX de NFT do zero

Para NFTs que seguem o protocolo ERC-721, a implementação de negociação descentralizada é um tema que vale a pena discutir. Atualmente, as principais plataformas de negociação de NFTs utilizam o método de ordens, semelhante a exibir produtos nas prateleiras para que os compradores possam escolher. Este artigo mostrará como implementar a negociação descentralizada de NFTs através da escrita de contratos inteligentes e de uma página front-end simples. É importante notar que o conteúdo deste artigo é apenas para referência educacional e não é adequado para ambientes de produção reais.

Web3 novato série: criar um NFT DEX do zero

Visão Geral do NFT

NFT é um token não fungível, cada Token é único e segue o protocolo ERC-721. Normalmente, os NFTs exibem imagens diferentes nas carteiras, e cada grupo de NFTs possui um ID único para distinção. Devido às características dos NFTs, não é possível definir preços através de curvas de preço como os tokens ERC-20. Assim, o método de negociação comum atualmente é através de um livro de ordens.

Web3 Novato Série: Criar um NFT DEX do zero

Modo de Negociação de Livro de Ordens

O modo de livro de ordens divide-se principalmente em duas tipos:

  1. Ordem de Preço: O vendedor define o preço de venda, e o comprador pode comprar se achar adequado.
  2. Ordem de compra: O comprador emite uma ordem de compra, e o vendedor realiza a venda quando considera que o preço é adequado.

Em geral, o preço de uma ordem de compra será inferior ao de uma ordem de preço fixo. Este artigo irá focar na forma de negociação de ordens de preço fixo.

Série para Iniciantes em Web3: Criar um NFT DEX do Zero

Funções Básicas do DEX NFT

Um DEX NFT básico deve incluir as seguintes funcionalidades:

  1. Colocar produtos à venda: listar NFTs a preço fixo
  2. Comprar produtos: comprar de acordo com o preço do NFT
  3. Cobrança de taxa: cobra-se uma porcentagem do preço de transação.

Processo de listagem de produtos

  1. Frontend: O usuário escolhe o NFT e define o preço, clica em listar.
  2. Contrato: usuários autorizam operações de contrato NFT

Processo de compra de produtos

  1. Front-end: o usuário escolhe o NFT, clica em comprar
  2. Contrato: Transferir os fundos do comprador para o vendedor, NFT para o comprador

Web3 Novato Série: Implementar um NFT DEX do zero

Implementação de NFT DEX

1. Criar NFT de teste

Pode implantar rapidamente um contrato NFT do protocolo ERC-721 para teste através do Remix.

Web3 Novato Série: Implementando um NFT DEX do zero

2. Escrever contratos inteligentes

Principais métodos incluem:

2.1 Vendedor lista NFT

Fluxo:

  1. O usuário seleciona NFT
  2. Definir o preço
  3. Autorizar NFT ao contrato
  4. Chamar o método de listagem

Método de listagem necessário:

  • Verificar a propriedade do NFT
  • Adicionar registo de listagem
  • Acionar evento de listagem

Web3 Novato Série: Implementando um NFT DEX do zero

2.2 Comprador compra NFT

Passos de execução do contrato:

  1. Ler dados de NFT
  2. Calcular e deduzir a taxa de serviço
  3. Transferir NFT para o comprador
  4. Acionar evento de compra

Web3 Novato Série: Realizar um NFT DEX do zero

2.3 Cancelar listagem

Basta definir o campo isActive do registro de listagem como false.

Web3 novato série: criar um NFT DEX do zero

2.4 Taxa de retirada

Os custos de transação serão depositados no contrato ou transferidos para o endereço designado.

Web3 Novato Série: Implementar um NFT DEX do zero

3. Desenvolvimento Front-end

Ferramentas principais utilizadas:

  • Ant Design Web3
  • Wagmi
  • Next.js + Vercel

Página Principal:

  • Mint: Aluguer de NFT de teste
  • Comprar: NFT exchange Centralizada
  • Portfólio: Gestão de NFT de subida e descida

3.1 Conectar carteira

Implementado com o componente de conexão do Ant Design Web3.

Web3 Novato Série: Implementar um NFT DEX do zero

3.2 Página de Mint

Usar o método useWriteContract do wagmi para chamar o contrato mint.

Web3 Novato Série: Construindo um NFT DEX do zero

3.3 Página do Portfólio

Exibir NFTs dos usuários, suportar operações de listagem e deslistagem.

Web3 Novato Série: Implementar um NFT DEX do Zero

3.4 Página de Compra

Exibir NFTs já listados, suportar operações de compra.

Série para iniciantes em Web3: construir um NFT DEX do zero

Através dos passos acima, um DEX básico de NFT foi implementado. Pode ser implantado no Vercel para acesso e utilização.

MINT18.48%
Ver original
Esta página pode conter conteúdo de terceiros, que é fornecido apenas para fins informativos (não para representações/garantias) e não deve ser considerada como um endosso de suas opiniões pela Gate nem como aconselhamento financeiro ou profissional. Consulte a Isenção de responsabilidade para obter detalhes.
  • Recompensa
  • 6
  • Compartilhar
Comentário
0/400
GmGnSleepervip
· 07-26 04:07
bull Uau, escrever Dex por conta própria tem um sabor especial.
Ver originalResponder0
TokenRationEatervip
· 07-25 22:02
Clássico post técnico, recomendo guardar antes de falar.
Ver originalResponder0
MetaNomadvip
· 07-23 09:16
É um projeto antigo, mas não sei escrever.
Ver originalResponder0
BrokeBeansvip
· 07-23 09:08
Fiquei tão assustado que até o meu cão caiu da na cadeia.
Ver originalResponder0
DevChivevip
· 07-23 09:08
Hoje também é um dia para aprender sobre Blockchain, né~
Ver originalResponder0
BearMarketNoodlervip
· 07-23 09:05
De qualquer forma, não há muita diferença em relação às ordens em aberto, é apenas especulação.
Ver originalResponder0
Faça trade de criptomoedas em qualquer lugar e a qualquer hora
qrCode
Escaneie o código para baixar o app da Gate
Comunidade
Português (Brasil)
  • 简体中文
  • English
  • Tiếng Việt
  • 繁體中文
  • Español
  • Русский
  • Français (Afrique)
  • Português (Portugal)
  • Bahasa Indonesia
  • 日本語
  • بالعربية
  • Українська
  • Português (Brasil)