Los usuarios que han leído los artículos anteriores deberían saber que, para los tokens del protocolo ERC-20, podemos comerciar a través de DEX representados por Uniswap, logrando así la Descentralización. Entonces, ¿cómo se puede lograr el comercio descentralizado para el protocolo ERC-721, es decir, para los NFT?
Actualmente, algunos de los intercambios de NFT más populares utilizan un método de órdenes para realizar transacciones, como si se colocaran productos en los estantes de un supermercado; cuando el comprador considera que el precio es adecuado, puede llevarse el producto a casa.
Este artículo implementará el comercio descentralizado de NFT a través de la escritura de contratos inteligentes y una página frontend simple. Tenga en cuenta que este artículo es solo para fines de aprendizaje y no se puede utilizar en un entorno de producción.
NFT (Token No Fungible)
NFT es decir, Token no fungibles, lo que significa que cada Token es no fungible, diferente, y sigue el protocolo ERC-721. Generalmente, cada NFT mostrará una imagen diferente en la billetera, y cada grupo de NFT tendrá un ID único para diferenciarlos.
Debido a las características de los NFT, no es posible establecer un precio a través de una curva de precios como en el caso de los ERC-20, ya que cada Token es diferente. Por lo tanto, la forma de negociación más común en la actualidad es a través de un libro de órdenes.
Comercio en el libro de órdenes
El modo de libro de órdenes se puede resumir diciendo que el precio de los productos es establecido por las personas, a diferencia de Uniswap, que calcula el precio mediante curvas de precios. Generalmente, el libro de órdenes se divide en dos modos de transacción, uno es el pedido de precios, es decir, el vendedor establece un precio de venta que tiene en mente, y si hay un comprador que considera que el precio es adecuado, puede realizar la compra. El otro es el pedido de compra, es decir, el comprador emite una orden de compra según sus necesidades, y cuando el vendedor considera que el precio es adecuado, puede proceder a la venta.
En general, el precio de una orden de compra será inferior al precio de una orden de precio fijo. Este artículo solo presenta el primer método de fijación de precios.
Funciones de NFT DEX
Las funciones básicas de un DEX de NFT deberían incluir las siguientes funciones básicas:
Productos en la tienda: Listar un NFT a un precio determinado
Comprar productos: realizar la compra según el precio del NFT
Comisión DEX: Se cobra una comisión proporcional al precio de la transacción.
producto listado
Para listar un producto, se necesitan hacer las siguientes cosas:
Frontend: El usuario selecciona su propio NFT, establece un precio y hace clic en listar.
Contrato: el usuario necesita establecer permisos para el contrato, lo que permite controlar el NFT del usuario.
De esta manera, los productos estarán listos para ser listados. En el contrato, es necesario mantener un mapa de precios de los productos listados por los usuarios. Esta parte de los datos generalmente se puede manejar en un servicio centralizado para reducir la carga del contrato, pero en este artículo, estos datos del mapa se mantendrán dentro del contrato.
comprar productos
Al comprar un producto, ocurrirán las siguientes cosas:
Frontend: El usuario selecciona un NFT que desea comprar y hace clic en comprar.
Contrato: Llamar al protocolo, transferir el dinero del usuario al vendedor del NFT y transferir el NFT al comprador.
Implementar un DEX de NFT
En este capítulo, vamos a implementar un DEX de NFT desde cero, esta es la dirección del DEX ya desplegado por el autor nft-dex-frontend.vercel.app.
1. Crear un NFT
Para las pruebas, lo mejor es que tengamos nuestro propio NFT. Podemos construir rápidamente un NFT del protocolo ERC-721 a través de Remix, que ofrece las plantillas correspondientes.
Podemos desplegar fácilmente un NFT según la plantilla. Por supuesto, también puedes omitir este paso y usar directamente el NFT que hemos preparado.
2. Redacción de contratos
Nuestros métodos de contrato deberían incluir los siguientes métodos:
2.1. Vendedor lista NFT
El vendedor necesita especificar el NFT que desea vender y el precio correspondiente. Al listar, el usuario debe firmar el método de autorización del NFT, permitiendo que nuestro contrato inteligente tenga permiso para operar este NFT, de modo que cuando un comprador lo adquiera, la transacción pueda completarse automáticamente.
Así que el proceso debería ser el siguiente: 1. El usuario selecciona su propio NFT; 2. Establece el precio, donde la valoración puede ser en monedas estables USDT, USDC, o también en ETH; 3. Autoriza el NFT al contrato.
Después se puede llamar al método de listado del contrato, que necesita hacer las siguientes cosas:
Verificar la propiedad de NFT
Añadir registro de listado
Evento que activa la inclusión en la lista
2.2. El comprador adquiere NFT
Cuando un comprador adquiere un NFT, el usuario solo necesita seleccionar el NFT que desea y pagar el token correspondiente. A nivel de contrato se ejecutarán los siguientes pasos: 1. Leer los datos del NFT correspondiente desde "listings"; 2. Calcular la tarifa según el precio del NFT y deducir esta parte del precio de la transacción; 3. Transferir el NFT al comprador; 4. Activar el evento de compra.
2.3. Cancelar la lista
Por supuesto, el vendedor puede sentir que el precio no es adecuado y optar por cancelar la publicación. Podemos ver que en la parte donde guardamos la información de la publicación, hemos mantenido un campo isActive, que indica si el producto es válido, por lo que al cancelar la publicación, solo necesitamos establecer este campo en false.
2.4. Extracción de tarifas
DEX puede cobrar una tarifa en cada transacción, y esta tarifa se puede almacenar en el contrato o transferirse a otra de tus propias direcciones; en este artículo, se opta por almacenar en el contrato.
Hasta aquí, las funciones básicas de nuestro protocolo están completas.
3. Desarrollo de front-end DEX
Antes de comenzar, necesitamos preparar algunas herramientas, que incluyen las siguientes herramientas:
Ant Design Web3: para la conexión de billeteras y la exhibición de tarjetas NFT.
Wagmi: utilizado para interactuar con la billetera.
Nextjs + Vercel: desplegar nuestro proyecto.
Nuestra aplicación frontal debería incluir tres páginas: Mint, Buy y Portfolio. Mint es para que los usuarios puedan Mint nuestro NFT, solo para demostración. En Buy está nuestro mercado DEX, donde los usuarios pueden comprar nuestro NFT. En Portfolio, los usuarios pueden listar y deslistar sus NFT.
3.1. Conectar cartera
Conectar la billetera del usuario, utilizando Ant Design Web3 para implementar
El proceso de conectar la billetera del usuario es muy simple, solo necesita usar el componente de conexión proporcionado por Ant Design Web3.
Primero, envolvemos el proyecto con un Provider, de esta manera podremos utilizar las capacidades de Ant Design Web3 en el código posterior. Además, dado que necesitamos conectarnos a la cadena de prueba sepolia, para considerar la velocidad, se recomienda utilizar algunos servicios de nodos para mejorar la velocidad de consulta de datos. Aquí estoy utilizando el endpoint de ZAN, que es muy adecuado para su uso en el entorno de Asia-Pacífico, es rápido y muy asequible, y también soporta una amplia variedad de cadenas.
Después, coloca un botón de conexión en los lugares donde se necesita conectar la cartera:
Así que esto está hecho, es muy simple.
3.2. Acuñar
Minte un NFT, para obtener moneda de prueba puedes ir a
En la página de Mint podemos Mintear NFT de prueba. Mintear es una operación de escritura de contrato, aquí usaremos el método useWriteContract dentro de wagmi. Necesitamos especificar la dirección del contrato, el ABI del contrato y los parámetros del contrato.
Después, puedes confirmar en la billetera y Mint será exitoso.
3.3. Portafolio
Gestionar los NFT de los usuarios
Aquí se necesitan mostrar todos los NFT del usuario. Podemos utilizar algunas API de NFT para obtenerlos, aquí se usa la API de opensea, ya que no hay muchas API de NFT que soporten la cadena de pruebas sepolia.
Después de obtener la lista de NFT del usuario, es necesario determinar si ya están listados. Los que no están listados pueden ser listados, mientras que los que ya están listados pueden ser retirados. La forma de determinar esto es a través del método "getSellerListings" en el contrato DEX, donde se obtienen los NFT que el usuario ya ha listado, y luego se determina si están en proceso de listado según el campo "isAlive" de estos NFT.
Al listar, es necesario llamar al método del contrato « listNFT », y al cancelar, se debe llamar al método « cancelListing ». Antes de listar, es necesario llamar al método de autorización del NFT adicionalmente, para autorizar el NFT al contrato, de esta manera, después de que la transacción se complete, este NFT podrá ser transferido automáticamente al comprador.
3.4. Comprar
Se pueden comprar NFTs en Buy
Primero necesitamos mostrar los NFT que ya están listados. A diferencia de la presentación de los NFT que ya tiene el usuario en el Portafolio, aquí la diferencia es que es global, no se trata de un usuario específico, y solo necesitamos mostrar los NFT que están isAlive.
Al comprar, utiliza el método "purchaseNFT". Al llamar a este método, necesitas pagar el precio de venta con ETH.
Aquí, este « value » es el ETH que el comprador necesita pagar.
Así se ha completado una página frontal DEX que incluye todas las capacidades básicas, la podemos implementar en vercel.
Este artículo fue escrito por el equipo ZAN (cuenta X @zan_team) de Yeezo (cuenta X @GaoYeezo 75065).
El contenido es solo de referencia, no una solicitud u oferta. No se proporciona asesoramiento fiscal, legal ni de inversión. Consulte el Descargo de responsabilidad para obtener más información sobre los riesgos.
Serie para novatos de Web3: Crear un DEX de NFT desde cero
Los usuarios que han leído los artículos anteriores deberían saber que, para los tokens del protocolo ERC-20, podemos comerciar a través de DEX representados por Uniswap, logrando así la Descentralización. Entonces, ¿cómo se puede lograr el comercio descentralizado para el protocolo ERC-721, es decir, para los NFT?
Actualmente, algunos de los intercambios de NFT más populares utilizan un método de órdenes para realizar transacciones, como si se colocaran productos en los estantes de un supermercado; cuando el comprador considera que el precio es adecuado, puede llevarse el producto a casa.
Este artículo implementará el comercio descentralizado de NFT a través de la escritura de contratos inteligentes y una página frontend simple. Tenga en cuenta que este artículo es solo para fines de aprendizaje y no se puede utilizar en un entorno de producción.
NFT (Token No Fungible)
NFT es decir, Token no fungibles, lo que significa que cada Token es no fungible, diferente, y sigue el protocolo ERC-721. Generalmente, cada NFT mostrará una imagen diferente en la billetera, y cada grupo de NFT tendrá un ID único para diferenciarlos.
Debido a las características de los NFT, no es posible establecer un precio a través de una curva de precios como en el caso de los ERC-20, ya que cada Token es diferente. Por lo tanto, la forma de negociación más común en la actualidad es a través de un libro de órdenes.
Comercio en el libro de órdenes
El modo de libro de órdenes se puede resumir diciendo que el precio de los productos es establecido por las personas, a diferencia de Uniswap, que calcula el precio mediante curvas de precios. Generalmente, el libro de órdenes se divide en dos modos de transacción, uno es el pedido de precios, es decir, el vendedor establece un precio de venta que tiene en mente, y si hay un comprador que considera que el precio es adecuado, puede realizar la compra. El otro es el pedido de compra, es decir, el comprador emite una orden de compra según sus necesidades, y cuando el vendedor considera que el precio es adecuado, puede proceder a la venta.
En general, el precio de una orden de compra será inferior al precio de una orden de precio fijo. Este artículo solo presenta el primer método de fijación de precios.
Funciones de NFT DEX
Las funciones básicas de un DEX de NFT deberían incluir las siguientes funciones básicas:
producto listado
Para listar un producto, se necesitan hacer las siguientes cosas:
De esta manera, los productos estarán listos para ser listados. En el contrato, es necesario mantener un mapa de precios de los productos listados por los usuarios. Esta parte de los datos generalmente se puede manejar en un servicio centralizado para reducir la carga del contrato, pero en este artículo, estos datos del mapa se mantendrán dentro del contrato.
comprar productos
Al comprar un producto, ocurrirán las siguientes cosas:
Implementar un DEX de NFT
En este capítulo, vamos a implementar un DEX de NFT desde cero, esta es la dirección del DEX ya desplegado por el autor nft-dex-frontend.vercel.app.
1. Crear un NFT
Para las pruebas, lo mejor es que tengamos nuestro propio NFT. Podemos construir rápidamente un NFT del protocolo ERC-721 a través de Remix, que ofrece las plantillas correspondientes.
Podemos desplegar fácilmente un NFT según la plantilla. Por supuesto, también puedes omitir este paso y usar directamente el NFT que hemos preparado.
2. Redacción de contratos
Nuestros métodos de contrato deberían incluir los siguientes métodos:
2.1. Vendedor lista NFT
El vendedor necesita especificar el NFT que desea vender y el precio correspondiente. Al listar, el usuario debe firmar el método de autorización del NFT, permitiendo que nuestro contrato inteligente tenga permiso para operar este NFT, de modo que cuando un comprador lo adquiera, la transacción pueda completarse automáticamente.
Así que el proceso debería ser el siguiente: 1. El usuario selecciona su propio NFT; 2. Establece el precio, donde la valoración puede ser en monedas estables USDT, USDC, o también en ETH; 3. Autoriza el NFT al contrato.
Después se puede llamar al método de listado del contrato, que necesita hacer las siguientes cosas:
2.2. El comprador adquiere NFT
Cuando un comprador adquiere un NFT, el usuario solo necesita seleccionar el NFT que desea y pagar el token correspondiente. A nivel de contrato se ejecutarán los siguientes pasos: 1. Leer los datos del NFT correspondiente desde "listings"; 2. Calcular la tarifa según el precio del NFT y deducir esta parte del precio de la transacción; 3. Transferir el NFT al comprador; 4. Activar el evento de compra.
2.3. Cancelar la lista
Por supuesto, el vendedor puede sentir que el precio no es adecuado y optar por cancelar la publicación. Podemos ver que en la parte donde guardamos la información de la publicación, hemos mantenido un campo isActive, que indica si el producto es válido, por lo que al cancelar la publicación, solo necesitamos establecer este campo en false.
2.4. Extracción de tarifas
DEX puede cobrar una tarifa en cada transacción, y esta tarifa se puede almacenar en el contrato o transferirse a otra de tus propias direcciones; en este artículo, se opta por almacenar en el contrato.
Hasta aquí, las funciones básicas de nuestro protocolo están completas.
3. Desarrollo de front-end DEX
Antes de comenzar, necesitamos preparar algunas herramientas, que incluyen las siguientes herramientas:
Nuestra aplicación frontal debería incluir tres páginas: Mint, Buy y Portfolio. Mint es para que los usuarios puedan Mint nuestro NFT, solo para demostración. En Buy está nuestro mercado DEX, donde los usuarios pueden comprar nuestro NFT. En Portfolio, los usuarios pueden listar y deslistar sus NFT.
3.1. Conectar cartera
El proceso de conectar la billetera del usuario es muy simple, solo necesita usar el componente de conexión proporcionado por Ant Design Web3.
Primero, envolvemos el proyecto con un Provider, de esta manera podremos utilizar las capacidades de Ant Design Web3 en el código posterior. Además, dado que necesitamos conectarnos a la cadena de prueba sepolia, para considerar la velocidad, se recomienda utilizar algunos servicios de nodos para mejorar la velocidad de consulta de datos. Aquí estoy utilizando el endpoint de ZAN, que es muy adecuado para su uso en el entorno de Asia-Pacífico, es rápido y muy asequible, y también soporta una amplia variedad de cadenas.
Después, coloca un botón de conexión en los lugares donde se necesita conectar la cartera:
3.2. Acuñar
En la página de Mint podemos Mintear NFT de prueba. Mintear es una operación de escritura de contrato, aquí usaremos el método useWriteContract dentro de wagmi. Necesitamos especificar la dirección del contrato, el ABI del contrato y los parámetros del contrato.
Después, puedes confirmar en la billetera y Mint será exitoso.
3.3. Portafolio
Aquí se necesitan mostrar todos los NFT del usuario. Podemos utilizar algunas API de NFT para obtenerlos, aquí se usa la API de opensea, ya que no hay muchas API de NFT que soporten la cadena de pruebas sepolia.
Después de obtener la lista de NFT del usuario, es necesario determinar si ya están listados. Los que no están listados pueden ser listados, mientras que los que ya están listados pueden ser retirados. La forma de determinar esto es a través del método "getSellerListings" en el contrato DEX, donde se obtienen los NFT que el usuario ya ha listado, y luego se determina si están en proceso de listado según el campo "isAlive" de estos NFT.
Al listar, es necesario llamar al método del contrato « listNFT », y al cancelar, se debe llamar al método « cancelListing ». Antes de listar, es necesario llamar al método de autorización del NFT adicionalmente, para autorizar el NFT al contrato, de esta manera, después de que la transacción se complete, este NFT podrá ser transferido automáticamente al comprador.
3.4. Comprar
Primero necesitamos mostrar los NFT que ya están listados. A diferencia de la presentación de los NFT que ya tiene el usuario en el Portafolio, aquí la diferencia es que es global, no se trata de un usuario específico, y solo necesitamos mostrar los NFT que están isAlive.
Al comprar, utiliza el método "purchaseNFT". Al llamar a este método, necesitas pagar el precio de venta con ETH.
Aquí, este « value » es el ETH que el comprador necesita pagar.
Así se ha completado una página frontal DEX que incluye todas las capacidades básicas, la podemos implementar en vercel.
Este artículo fue escrito por el equipo ZAN (cuenta X @zan_team) de Yeezo (cuenta X @GaoYeezo 75065).