Entender todo el proceso de desarrollo de una plataforma de intercambio NFT de Descentralización en un artículo.

robot
Generación de resúmenes en curso

Desarrollar desde cero una plataforma de intercambio NFT Descentralización

Para los NFT que siguen el protocolo ERC-721, la forma de implementar la Descentralización en las transacciones es diferente a la de los tokens ERC-20. Actualmente, las plataformas de NFT más utilizadas adoptan un modelo de órdenes, similar a los productos exhibidos en los estantes de un supermercado, donde los compradores pueden elegir libremente.

Este artículo presentará cómo implementar una plataforma básica de intercambio NFT de Descentralización a través de contratos inteligentes y una interfaz de front-end sencilla. Es importante tener en cuenta que este es solo un ejemplo de aprendizaje y no es adecuado para un entorno de producción real.

Serie de principiantes de Web3: Implementar un DEX de NFT desde cero

Características y métodos de transacción de NFT

NFT es la abreviatura de token no fungible, cada token es único. Normalmente, los NFTs mostrarán diferentes imágenes en la cartera, y cada grupo de NFTs tiene una identificación única.

Debido a esta característica de los NFT, no se pueden valorar a través de curvas de precios como los tokens ERC-20. Actualmente, una forma de negociación bastante común es adoptar un formato de libro de órdenes.

Serie para principiantes de Web3: implementar un DEX de NFT desde cero

Modo de negociación en libro de órdenes

El modelo de libro de órdenes tiene principalmente dos formas:

  1. Orden de precios: el vendedor establece el precio, y el comprador puede comprar directamente si lo considera adecuado.

  2. Orden de compra: el comprador emite una orden de compra, y el vendedor puede vender si considera que el precio es adecuado.

En general, el precio de una orden de compra será más bajo que el de una orden de precio fijo. Este artículo se centrará en el modo de orden de precio fijo.

Serie para principiantes en Web3: implementar un DEX de NFT desde cero

Funciones básicas de la plataforma NFT

Una plataforma básica de NFT debería incluir las siguientes funciones:

  1. Listar producto: Colocar NFT a un precio especificado
  2. Comprar productos: realizar la compra según el precio del NFT
  3. Comisión de la plataforma: se cobra un porcentaje fijo según el precio de transacción.

proceso de listado

  1. Frontend: el usuario selecciona NFT y establece el precio, hace clic en listar
  2. Contrato: el usuario autoriza al contrato a operar su NFT

Al mismo tiempo, es necesario mantener una tabla de mapeo de precios de los productos listados en el contrato.

Proceso de compra

  1. Frontend: el usuario selecciona el NFT que desea comprar y hace clic en comprar
  2. Contrato: transferir los fondos del comprador al vendedor, NFT al comprador

Serie para principiantes de Web3: implementar un DEX NFT desde cero

Desarrollo de la plataforma NFT

A continuación, vamos a implementar una plataforma simple de NFT desde cero.

1. Crear contrato NFT

Para probar, podemos usar Remix para desplegar rápidamente un contrato NFT del protocolo ERC-721. Por supuesto, también se puede usar un contrato NFT existente directamente.

Serie para principiantes de Web3: implementar un DEX de NFT desde cero

2. plataforma de contratos

Los contratos de la plataforma de intercambio deben incluir las siguientes funciones clave:

2.1 Vendedor sube NFT

El proceso es el siguiente:

  1. El usuario selecciona NFT
  2. Establecer precio ( disponible en ETH o stablecoins )
  3. Autorizar NFT al contrato
  4. Llamar al método de listado

El método de listado necesita:

  • Verificar la propiedad de NFT
  • Agregar registro de listado
  • Activar evento de listado

Serie para principiantes en Web3: crear un DEX de NFT desde cero

2.2 El comprador compra NFT

Proceso de compra:

  1. Leer datos de listado de NFT
  2. Calcular y deducir la tarifa de servicio
  3. Transferir NFT al comprador
  4. Disparar evento de compra

Serie para principiantes de Web3: Implementar un DEX de NFT desde cero

2.3 Cancelar listado

Para cancelar la lista, configure el campo isActive como false.

2.4 Retiro de tarifas

La plataforma puede cobrar un porcentaje de la tarifa de transacción, que se almacena en el contrato o se transfiere a una dirección designada.

Serie para principiantes en Web3: Cómo implementar un DEX de NFT desde cero

3. Desarrollo frontend

El desarrollo front-end requiere las siguientes herramientas:

  • Ant Design Web3: para conexión de billetera y exhibición de NFT
  • Wagmi: utilizado para la interacción con la cartera
  • Next.js + Vercel: despliegue del proyecto

La interfaz principal incluye tres páginas: Mint, Buy y Portfolio.

Serie para principiantes en Web3: implementar un NFT DEX desde cero

3.1 Conectar billetera

Utilizar el componente de conexión de Ant Design Web3 para implementar la función de conexión de billetera.

Web3 nuevo en la serie: implementar un DEX de NFT desde cero

3.2 Página de Mint

Para acuñar un NFT de prueba, utiliza el método useWriteContract de wagmi para llamar al contrato.

Serie para principiantes de Web3: implementar un DEX de NFT desde cero

3.3 Página de Portafolio

Muestra los NFT que posee el usuario, soporta las operaciones de listado y desliste.

Es necesario llamar a los métodos listNFT y cancelListing del contrato y autorizar el NFT al contrato antes de listar.

Serie para principiantes de Web3: Crear un DEX de NFT desde cero

3.4 Página de Compra

Mostrar todos los NFT listados, soporte para operaciones de compra.

Llama al método purchaseNFT al comprar y paga el ETH correspondiente.

Hasta aquí, se ha desarrollado una plataforma de intercambio descentralizada básica de NFT. Podemos desplegarla en plataformas como Vercel para pruebas.

Serie para principiantes de Web3: implementar un DEX de NFT desde cero

Ver originales
Esta página puede contener contenido de terceros, que se proporciona únicamente con fines informativos (sin garantías ni declaraciones) y no debe considerarse como un respaldo por parte de Gate a las opiniones expresadas ni como asesoramiento financiero o profesional. Consulte el Descargo de responsabilidad para obtener más detalles.
  • Recompensa
  • 5
  • Compartir
Comentar
0/400
failed_dev_successful_apevip
· hace19h
Deja de hacer esas tonterías, simplemente escribe un demo.
Ver originalesResponder0
FalseProfitProphetvip
· hace19h
La primera lección para programadores novatos
Ver originalesResponder0
ZKProofstervip
· hace19h
hmm... técnicamente hablando, esta implementación carece de vectores de privacidad críticos
Ver originalesResponder0
MetaverseHobovip
· hace19h
¿Se puede aprovechar la tarifa de transacción?
Ver originalesResponder0
consensus_failurevip
· hace19h
perspectivas valiosas Justo no entiendo~
Ver originalesResponder0
Opere con criptomonedas en cualquier momento y lugar
qrCode
Escanee para descargar la aplicación Gate
Comunidad
Español
  • 简体中文
  • English
  • Tiếng Việt
  • 繁體中文
  • Español
  • Русский
  • Français (Afrique)
  • Português (Portugal)
  • Bahasa Indonesia
  • 日本語
  • بالعربية
  • Українська
  • Português (Brasil)