Crea un mercado de NFT con pila completa usando Solidity & Next js

1. INTRODUCCIÓN AL CURSO: Si eres parte del espacio de las criptomonedas, existe la posibilidad de que hayas oído hablar de este activo digital de tendencia conocido como NFT. Este curso cubre todo lo necesario para una aplicación NFT descentralizada, acuerdo con el estándar ERC 721, los usuarios podrán vender y comprar NFP is weed eater en nuestro mercado. La primera parte del curso abarca la redacción y prueba de contrato inteligente utilizando sólidos. La otra mitad heredada se enfocará en construir la interfaz de usuario utilizando next, sillas y Tailwind CSS, un estimador, que los datos se almacenarán en piñata, que es un almacenamiento basado en IPFS. Al finalizar el curso, aprenderás todos los conceptos necesarios para postularte a un trabajo de desarrollador web o incluso construir tu propia startup en la industria blockchain. Entonces sin perder más tiempo, inscribirte ahora y comencemos. 2. Video 1 Crear un nuevo proyecto de hardhat: Hola, bienvenidos al primer video del curso, donde estamos construyendo un mercado NFT desde cero. Por lo tanto, en este video, discutiremos sobre la hoja de ruta del curso , así como la configuración de nuestro entorno de desarrollo. Como se puede ver en la pantalla, hay varios pasos involucrados en este curso. El primer paso es configurar el entorno de desarrollo utilizando hardhead. Entonces crearemos un contrato inteligente que rastrea y almacena y si los datos. Después escribiremos pruebas unitarias para asegurarnos de que nuestro contrato inteligente funcione correctamente. El cuarto paso será desplegar el contrato inteligente a esa red de prueba. Después de eso, trabajaremos en el front-end y usaremos los próximos años para eso. Después interactuar con un contrato inteligente desplegado. Usaremos un test.js y MetaMask. Y por último, probaremos el funcionamiento completo de la aplicación para que puedas mostrar este proyecto en tu portafolio. Antes de seguir adelante, asegúrate de haber instalado MetaMask y tener alguna prueba. Cielos, se desgarra en tu cuenta. No me voy a montar otra vez. Por favor mira cualquier tutorial al respecto y continúa con ese curso. Entonces mi tarea es sólo un proceso muy sencillo. Entonces después de conseguir esa prueba, llámala prueba, hay algunos grifos que puedes google e ingresa tu dirección. Eso es todo. Así que ahora aquí puedes ver todo el stack tecnológico de nuestra aplicación descentralizada. Esa es solidez en la que estamos trabajando el itanium es hardhat. Estaremos utilizando en el futuro como el proveedor de nodos blockchain. Se test.js, eso es. Estas son las cosas que estaremos usando. Ahora, empecemos a trabajar y que tenemos que crear un nuevo proyecto de hardhead. Entonces, lo que es duro, hard hat es un entorno que los desarrolladores usan para probar, compilar, implementar y depurar aplicaciones descentralizadas basadas en su blockchain italiana. Si quieres saber más, también puedes ir en su página oficial. Se puede ver que esto es hardhead. Y aquí puedes leer más si quieres. Simplemente empezaré a crear una nueva carpeta y ponerle un nombre. Nft, mercado. Dap. Eso es todo. Entonces dentro de ella, crearé, abriré una nueva terminal. Y lo primero que tenemos que hacer es crear un proyecto NPM usando este comando npm en él. ¿ Qué? Luego vaciará el proyecto npm. Eso es todo. Entonces simplemente instalaré hardhead usando este comando save dev hard hat. Eso es todo. Sólo tardará unos segundos. Ahora para crear un proyecto hardhead, usaremos el comando n p x hardhead. Nos dará el código repetitivo. Simplemente presionaré enter. Entonces crearé un proyecto JavaScript ingresado. Y entonces eso es todo. Después de eso, hardhead nos está diciendo que instalemos estas dependencias. Pero esta es una actualización que hace apenas una semana. Por lo que me siento más cómodo en estilizar que dependencias por separado. Eso es difícil en donde los haricers contratados por completo, lo que hace que el hardhead sea compatible con prueba y nos ayuda a interactuar con el contrato inteligente. Por lo que sólo voy a escribir npm install save dev. Lo primero que haré es. La noche que ahora haga los laboratorios slash, había tenido tarifa completa para encontrar 0, luego espacio. Nuevamente. Es tedio que un 3. Entonces chai 4. Entonces, entonces volveré a usar. Ahora haz laboratorios. Tenía éteres 0. Y finalmente ethers que sea por 0 y pulse Enter. Si conseguimos alguna añadida, sólo lo resolveremos. Pero en la documentación oficial, se puede ver todo aquí, cómo correr. Y esto es npm install save that, luego lo usaremos, luego añadimos usando NP x hard hat. Entonces estamos creando un proyecto JavaScript. Eso es todo. Aquí, el add instalando esa caja de herramientas. Pero solo estoy instalando todas las dependencias por separado. Esa es la diferencia. Tomará algún tiempo. Ahora, abramos nuestro proyecto en el código VS. Simplemente escribiré espacio de código. Abrirá esa carpeta en nuestro Editor de Código VS. En ese paquete o Jason, puedes simplemente gritar cheque cruzado todo está instalado. R nada, eso está muy lleno. Di Italianos comedores derrochadores de Ito y Hardhead. Por lo que todo está instalado. También. Asegúrate de tener extensiones instaladas en estas extensiones. Es Dart. Entonces tengo fragmentos del año que viene también. Entonces tengo este CSS de viento de cola instalado. Entonces también está este nuevo plug-in. Es casco. He instalado esto ya que es de condiciones gnomicas que es el oficial instalado esto también. Entonces eso es todo por este video. En el siguiente video, configuraremos los ajustes inferiores y MetaMask. Gracias. 3. Video 2 Claves de alquimia y metástasis: Hola, bienvenidos de nuevo. En este video nos instalaremos en menos y mi damasco en nuestro proyecto. Hardhead nos da pocas carpetas y archivos. Entenderemos todos esos paso a paso. Pero vayamos a hardhead dot config dot js y asegurémonos de que estamos apuntando nuestra red para correlacionar la red de prueba italiana. Para que eso funcione, necesitamos caudalmente la URL del nodo TDM y una dirección de cartera. Como ya tengo cuentas, no estaría creando una nueva contabilidad de extremo inferior MetaMask. Puedes buscarlo en Google y hacerlo por tu cuenta. Es un proceso muy sencillo y directo. Abramos nuestro navegador y vayamos a infundir. Pero IO. Después de iniciar sesión, tenemos que crear un nuevo proyecto. Red será esta. Tenemos tres API antes itanium y simplemente nombrelo NFT marketplace y haz clic en Crear. Entonces aquí, solo cambia la red principal de dos núcleos Lee y simplemente copia esta URL. Entonces. En el archivo de conflictos de cabeza dura, simplemente escribes debajo de esta solidez, simplemente escribes redes. Entonces así. Y tener red rizada. Ahora, pega esas llaves. Queremos pegar esta dosis de residuos directamente en nuestro código. Estaremos utilizando algunas bibliotecas. La primera biblioteca que usaremos es ese paquete punto ENV. Debido a que no se recomienda pegar esa información sensible directamente en su aplicación ya que esas pueden ser mal utilizadas por otros. La segunda biblioteca que vamos a utilizar es anexa un plano, que es una biblioteca de contratos modulares, reutilizables , seguros, inteligentes para la red italiana y retorno en solidez. Permite aprovechar contratos estándar, probados y revisados por la comunidad. Puedes buscar, abre enlace si quieres. Así. Si lo desea, puede buscarlo directamente y leer por su cuenta lo que hace. Simplemente anexaré eso y escribiré npm. Instalar contratos de corte Zeplin y no ENV. Vamos a entrar. Ahora, solo chequeo cruzado. todo está instalado. De acuerdo. Después de la instalación tenemos que crear un archivo ENV punto, es decir archivo ENV punto. Y el personal bajo siguiendo las claves, esa es nuestra inferior así como nuestra clave pública. Simplemente voy a crear una variable llamada n pocos. Url es igual a como este. Y segunda cartera. Pero leí k es igual a esto. Dot ENV está directamente en ese directorio raíz, no dentro de ningún contrato o prueba y todo. Ahora ve y pega esas llaves. En primer lugar es la URL inferior, y la segunda es esa clave de MetaMask. Puedes instalar my thomas yendo a mi sitio web Thomas.io e instala la extensión para tu navegador. Entonces simplemente haga clic en la máscara. A continuación, introduzca su contraseña. Después ve a Ajustes. Sólo espera. En primer lugar, voy a dar clic en esta segunda cuenta. Escribiré los detalles de la cuenta. A continuación, exportar clave privada. Y papi son contraseña. Presione, Enter y copie esta tecla. Asegúrate de no compartir esta clave con nadie más. Es una clave muy personal. Tiene que ser asegurado. Entonces solo pega aquí dentro y guárdalo. Ahora ya no tienes que usarlo. Después de esto. Vaya a hardhead dot config dot js, y realice los siguientes cambios. Aquí. En la URL. En la parte superior, simplemente requiere punto, punto ENV, punto ENV, punto ENV, punto config. Simplemente escríbelo. Entonces dentro de ese girly la URL, simplemente hay que escribir punto de proceso ENV. En Beulah URL, es el nombre de la variable. Y en cuentas, simplemente tendrás que re, dentro de los corchetes proceso punto ENV, guerra liderada. Pero leí clave. Eso es todo. Entonces así es como configuramos nuestra red a los piadosos. Además, se puede escribir casco también. Si quieres probarlo en el entorno local, depende de ti. Preferiré rizado como sé, que todo está funcionando en este código. Entonces eso es todo por este video. En el siguiente video, estaremos creando nuestro contrato inteligente. Gracias. 4. Video 3 Crear un contrato de mercado NFT: Hola, bienvenidos de nuevo. Creemos nuestro primer contrato inteligente. Simplemente crea un nuevo archivo dentro de la carpeta de contratos y nombrelo NFT market, dots soul. Entonces como siempre, hay que mencionar el compilador de solidez y ahora tenemos 0.8.9. Santas copias estas dos líneas y pegarlas aquí. Luego crea nuestro contrato usando la palabra clave y el nombre del contrato, NFT. Mercado, lugar. Así. Ahora, tenemos que importar nuestras dependencias. La primera importación será abre un avión en pista, barra, ofertas, contadores, puntos. Entonces lo siguiente que tenemos son pistas slash slash, C, 721, extensiones de pestañas, ELC 721, URIs, vejez. Y por último, tenemos esto que es contratos token, ERC 721, ERC 721 punto. Y ahora tenemos que heredar con el almacenamiento URI ERC, es decir 71 almacenamiento de URL. Y lo primero que haremos es crear algunas variables usando este contador, esa solubilidad estos contadores, contadores contador de puntos. Entonces la primera cuando lea la variable serán los ID de token. Ese es el número de DOMS jamás creados. Y segundo, ¿Sería contadores, contador de arranque. Pero leí artículos vendidos, número de artículos vendidos. Ahora, también puedes buscar este Zeplin abierto y luego ERC 2721 y leer El funcionamiento lo que hace. Entonces aquí puedes ver C7 a T1. Aquí puedes ver lo que estamos usando este contadores que ES es 721 token y todas las diferentes versiones diferentes. Es importante saber qué versión reducir o qué estamos usando. Estamos usando una versión diferente. Puedo ver todas las documentaciones se actualizan de vez en cuando. Pero la funcionalidad de la daga será la misma. La siguiente variable que haré es ese precio de listado, que será 0. Aquí está 01 E tercero. Y esto es lo que tenemos que ser para listar su NFT en nuestro mercado. Entonces, ¿esta es la comisión o qué? No la comisión. Es sólo un listado de tarifas. Entonces tendremos una variable conocida como propietario que no está fuera del contrato inteligente. Ahora vamos a crear un constructor. Es decir, se ejecutará sólo una vez cuando estemos usando este año C7 a T1. Y tenemos que usar estas cosas. Es decir, tenemos que darle nombre C, hay que darle un nombre y un símbolo. Simplemente lo nombraré. Torres Loco. Tolkien's, y dar símbolo se reunieron. En eso construye un constructor. No estamos aceptando nada, pero nos aseguraremos de que el propietario la persona que está implementando este contrato inteligente. Por lo que se requiere este código cuando estamos heredando a esto. Entonces esto no está siendo escrito por nosotros. Esto está preescrito bastante escrito por la biblioteca abierta Zeplin. Eso es todo. Ahora, continuemos. Por lo que ahora voy a crear una struct, que será artículo de mercado. Struct es solo nuestro propio tipo de datos. Es sólo una colección de tipos de datos primitivos. Entero primitivo, dirección, booleano, todo esto. Entonces, ¿en qué debe consistir un NFT o el artículo de mercado? Consiste ese token ID. Entonces tendrá la dirección de vendedor de cuentas por pagar, que tendrá la dirección de propietario en ese momento. Entonces tendrá precio de tabulación y un booleano, que es que se vende o no. Y ahora tendremos un mapeo también. Es decir, el entero uint8 se asignará al artículo del mercado, es decir éste. Y lo haremos, será una variable privada y la llamaremos id2. Artículo de mercado, es decir, el ID del token se está asignando al artículo de mercado. Si damos ese token ID, nos dará toda la estructura que se guarda toda la información. Lo siguiente vamos a crear un evento que sea artículo de mercado, evento creado. Tendrá de manera similar todo lo mismo. Eso es un 56 indexado. Puede identificar, luego dirección, dirección, propietario, luego derechos de la ONU. Y se vende booleano. Eventos, acaba de llamarse para que se esté guardando en el blockchain públicamente. Puedes leer más sobre lo que eso eventos o cómo emitir un evento. Y si no conoces los fundamentos de la solidez. Entonces ese es todo el código para hoy en este video. En el siguiente video, escribiremos ciertas funcionalidades para realizar determinada tarea. Gracias. 5. Video 4 Funcionalidad para crear un artículo de mercado: Hola. Ahora empecemos a trabajar en las funcionalidades. Divertida. La primera función que crearemos es conseguir ese precio de listado. Así que al igual que el churn divertido, consigue el precio del anuncio. Regresa la vista sombría. Te está convirtiendo en 56. Y simplemente devolverá la variable de precio del listado, que es esta. Entonces el comentario, solo escribe el comando devuelve listado, lugar del contrato, listado precio del mercado incluso correcto. Entonces se vencerá la siguiente funcionalidad. Fecha. Listado. Simplemente Wanchun, listado de arroz. Ahora bien, este es este lugar de renovación y anidación. Blake. Tenemos que asegurarnos de que sólo el propietario pueda actualizar el precio del anuncio. Por lo que tenemos que escribir propietario es igual al remitente del mensaje. Si no lo es, entonces simplemente escribe sobre Lee. Mercado, propietario puede fecha precio de listado. Y si es el propietario, entonces simplemente cambiaremos ese precio de listado. Este precio de listado, eso es todo. Estas son las funcionalidades básicas. Ahora los archivos, la siguiente funcionalidad será diferente canal D para crear un elemento de mercado. Entonces simplemente digamos funtion. Crear artículo de mercado. Entonces será una función privada. Te haré saber por qué. Aceptará dos cosas. Eso es un a 56 Token ID. Crearemos este ID de token. El siguiente video. Y lo siguiente es usted y 56 lugar. Entonces esta función acepta estas dos cosas. Ahora, vamos a tener algunos modificadores. Es decir, ¿cuáles son los requisitos? El primer requisito es que el precio debe ser mayor a 0. Si no lo es, entonces escribiremos debe ser mayor que 0. Entonces el siguiente requisito es el mensaje de que el valor debe ser igual al precio del listado. A medida que agregamos el listado del artículo del mercado, el usuario tiene que pagar algunas tarifas. El precio debe ser igual a esta cosa. Precio. Ahora, hagamos ese mapeo id2 market item. La idea será token ID. Y en este token ID estamos ahorrando un mercado, un objeto DOM, o se puede decir esta estructura. Acepta OpenID, luego remitente del mensaje. Entonces esta etapa que es el dueño será este contrato inteligente como ahora, porque no se transfiere. Entonces precio y valor booleano falso. Es decir, aún no se está vendiendo, sólo se está transfiriendo. Ahora, asumiremos dirección del remitente del mensaje de transferencia de Greg, este identificador de token. Y luego haremos esta función que es este elemento del mercado de eventos creado. Y acepta argumentos, sólo tokenizando mensaje, remitente. Dirección. Esto, luego hielo y falso. Por lo que esta era ahora funcionalidad para crear el artículo de mercado es Token ID. Nos reuniremos en la siguiente función. Entonces tenemos algunos modificadores que estos requisitos. Entonces en este mapeo, estamos ahorrando este valor. Es un token ID. De esa manera que es el vendedor es el mensaje que remitente y comprador. Es su propio nodo el que o quien posee esto es esto, ese es el contrato, este contrato inteligente interesa. Y podría estar pensando de dónde viene esta transferencia del chino, esta función de transferencia viene de la biblioteca de artoño anexar. Por lo que es una función incorporada. Si quieres saber más, puedes leer sobre esos traslados, traslado seguro, todos estos métodos. Pero eso es todo por este video. Nos vemos en la próxima sesión. Gracias. 6. Video 5 Funcionalidad para acuñar un nuevo token id: Hola. En este video, crearemos la funcionalidad para acuñar un nuevo token, así como crear una venta de mercado para acuñar en nuevo token. Leamos ese comentario. Significa un token y enlistarlo en el mercado. ¿ De acuerdo? Ahora la función, aceptará, en primer lugar, definición, nombre, cada capa, nombrarla, crear token. Aceptará un token de memoria de cadena, URI, tú y 56. Precio de descuento. Es decir, cuál es el URI de imagen, así como cuál es el precio de esa NFT. Esta será una función pública. Será un pagadero y devolverá ese perro puede identificarse. dicho. Loprimero que tenemos que hacer es incrementar el ID de token, eso es aquí. Esta es nuestra variable. Dentro de este código de contador, tenemos esta función que es incremento de puntos está predefinido en el Zeplin abierto. Simplemente se incrementará en uno, es decir de 0 a 11 a dos, así. Ahora, lo siguiente que haremos es obtener el ID de token actual. Eso es Ids dot current. Simplemente después de incrementar, obtendremos esa corriente y eso es de 0, se convertirá en uno. Y entonces aquí vamos a conseguir el uno, eso es todo. Entonces los usaremos la funcionalidad principal que nos da Zeplin abierto realmente lo significó para el remitente del mensaje. Y tendremos un nuevo y también enviaremos ese token ID. A continuación, establecerá URI de token. ¿ Se puede agregar? Tendrá un nuevo identificador de token, URI de token. Y entonces ahora usaremos esta función de artículo de mercado idiota. Entonces por eso lo hacemos privado, porque lo estaremos llamando internamente. Esa persona no puede llamar a esta función directamente. En primer lugar, debe tener este token ID y todo. Simplemente aceptará nueva identificación de token y ese precio. Y por último, devolveremos el token ID. Y de nuevo, estas funciones vienen del anexar Sapling la biblioteca. Si lo desea, puede ir a investigar qué se está moviendo hacia este URI de token conjunto y todo. Pero este código está predefinido de fermentación. Y aquí estamos llamando a esta función, que transferirá este token. Es decir primero se le ha acuñado al mensaje ese remitente, y luego se le transferirá del mensaje que mandan a este contrato inteligente. Y por eso. Y es así como se cotizará en el Mercado A nombre de la evidencia en nombre que es del propietario a esta nueva unidad. Así. Más adelante entenderás más. Ahora. Lo siguiente o la siguiente funcionalidad que crearemos es mediar. La venta de un artículo de esmalte de mercado. También se puede entender como transferencia. Se transferirá la propiedad del artículo así como los fondos entre las partes involucradas. De acuerdo, entonces empecemos a escribir. Será un Chen divertido. Yo lo nombraré crear mercado, venta. Simplemente aceptará ese token ID. Será una función pública y será una función pagadera. Ahora, empecemos a escribirte int I es igual a ID market. Tenemos ese token ID. A partir de eso, llegaremos. Pero después de NFT, así, entonces dirección conseguiremos comercializar la idea del vestido del vendedor. Entonces Token ID dot vendedor. Ahora tendremos algunos modificadores, es decir requisitos. Primer requisito o requisito de plomo hacia abajo. ¿ Es este mensaje valor punto debe ser igual al precio de la NFT. Eso es salvaje comprando la NFT, debe transferir esa cantidad correcta. Skin juega en nuestro diodo para completar la compra. ¿De acuerdo? Ahora bien, si está bien, entonces sólo haremos los cambios. Id al artículo de mercado. nodo Token ID es igual a. Ahora haremos algún cambio que sea updation. Yo sólo estoy simplemente, simplemente escribiré aquí así. Será ahora remitente de mensajes pagadero. Ahora y va a cambiar, sí se vende a verdadero. Y luego se hará, el vendedor se dirigirá a la dirección de este. Es la dirección 0, eso es ahora nadie es ese vendedor de venta. Ya se está vendiendo. Y esto significa dirección vacía. Esa es esa dirección pertenece a saber qué. Ahora incrementaremos los artículos vendidos. Está aquí, incremente este como ahora se está vendiendo. Entonces usaremos esa función de transferencia, una función que nos da el Zeplin abierto transferirá la propiedad. Este remitente de mensajes de contrato. Y este tokenizante. A continuación, solo transferiremos los fondos que es paga. Bueno, ahora conseguiremos que sea dueño del contacto inteligente. Nosotros, realmente consigue ese precio de listado. Cuando alguien es NFT, es 0 algo 0.001. Y también el vendedor obtendrá el precio de su NFT ya que estaba vendiendo deuda NFT en nuestro mercado así. Eso es todo. Entonces estos fueron los hongos. Es decir, esta es la función requerida para hacer una venta en el mercado. Aquí estamos llamando a esta función. Por lo que espero que lo hayan entendido. Si no es así, por favor intente buscar Google lo que sea en lo que esté confundido. Porque estos puntos transferidos en todo proviene de los fundamentos de solidez. Eso es todo por este video. Nos vemos en la próxima sesión. Gracias. 7. Video 6 Funcionalidad para conseguir artículos de mercado no vendidos: Hola, bienvenidos de nuevo. En este video, trabajaremos en la funcionalidad para buscar artículos no vendidos. En primer lugar, escribamos un comentario que es retornos de artículos del mercado no vendidos. Vamosa ponerle un nombre. Artículos del mercado francés. Tengo nombre lo buscar artículos de mercado porque en la página de inicio, es decir, cuando el usuario vaya a la página web, esa primera página va a buscar todos los artículos que están listados en ese mercado. Y si cotizan en el mercado, eso significa que todos están sin vender. Igualmente ser una función pública. Simplemente regresará o eso se ve. Ustedes todas estas variables. No hará ningún cambio que así sea vista. Y devolverá una matriz de artículo de mercado y tenemos que dar mi ecuación de dinero. Ahora, hagamos algunos cálculos. El recuento de artículos será Ids dot current. ¿ De acuerdo? Y recuento de artículos vendidos. Haremos eso es recuento de artículos. Este token ID es el actual menos I, vendido, no actual. Entonces, ¿cuál es la lógica detrás de esto? Supongamos que van a decir entonces NFP está en ese mercado y se están vendiendo seis. Eso significa que el recuento de artículos únicos será de cuatro. Por eso esta resta. Y ahora tenemos que recorrer nuestro array. Entonces nos gustará el índice actual. Vamos a dar un capital me gusta de esa manera. El índice actual es igual a 0. Entonces vamos a tener una matriz vacía que contendrá nuestro punto de referencia ocho elementos. ¿ Es bueno para nueva matriz de artículos del mercado, y esto será tierra y recuento de artículos vendidos. Esto. Entonces esta es una matriz vacía. Vamos a empujar los elementos aquí y luego devolver esta matriz. Tengamos un bucle for. Sí, tu int I es igual a 0. Yo menos que artículo cuento yo más, más. Entonces si, digamos si declaración. Si lo hice artículo de mercado yo más uno, porque partirá de un propietario es igual a domicilio de este contrato. Es decir, no es estar únicamente en ya que estamos cambiando el dueño aquí si se está vendiendo. Entonces si es el, entonces id actual, id seré yo más uno. Y entonces simplemente tendremos a este chico inteligente y soy corriente de almacenamiento. Yo es igual a id a cortar ordenado. Y aquí se menciona aquí porque ya que el token ID también se inicia desde 0, así que este voy a ser igual que ese token ID. Como también incrementamos Token ID aquí. Cuando estamos creando un token. Entonces tendremos esta variable items, array vacío en ese índice actual que es 0. Ver si este ítem, entonces vamos a incrementar el índice actual. Es decir, la próxima vez el ítem se almacenará en uno en el índice ya que 0 ya está lleno por esto. Y esto sólo irá en bucle. Y al final, después del bucle for-, devolveremos elementos de datos como este. Te devolveremos este artículo. Entonces así es como traemos los artículos del mercado. Espero que lo hayan entendido. Si no es así, asegúrate de detener el video e intenta entender la lógica detrás del código. Al ser lo único que importa es que entiendas los conceptos centrales, cómo escribir funciones por tu cuenta. Eso es todo por este video. Graciaspor ver. 8. Video 7 Funcionalidad para buscar artículos que pertenecen y que figuran: Hola. En este video trabajaremos en la funcionalidad a buscar. Nft es propiedad, así como creado por el usuario. Trabajemos en la primera funcionalidad, que será enciende los artículos que un usuario ha comprado. ¿ De acuerdo? Ahora, dale el nombre a esa función. Trae mis zurdos. Será una función pública. Devoluciones. Devolverá un área de artículos de mercado. Entonces empecemos por conseguir que les deleite. Contar. Contar es igual a. También pueden IDs esa corriente. Después terminas el recuento de artículos. Te explicaré todo ese código. Sólo sigue escribiendo. Usted en. El índice actual es igual a 0. Ahora, lo primero que tenemos que hacer es conseguir el número de artículos. Ese es el número de NFT que es propiedad del usuario. Aquí obtenemos ese número de nombre por este cálculo. Pero ahora tenemos que hacer un bucle for como este. Es para ti int I es igual a 0. Yo menos que del artículo contar yo más, más si id2 mercado I más uno, ese propietario es igual al remitente de punto de mensaje. Entonces incrementaremos este recuento de artículos más uno igual. De esta manera, obtendremos ese número total de FTE de este, es decir, de los cuales el propietario de propietario es el usuario. Y después de conseguirlo, entonces haremos lo mismo que arriba, como mi artículo chiquitín. Mamaria, supongo, es una buena comida. Artículo de mercado. Ahora, la longitud de la matriz será recuento de elementos. Este artículo cuenta es la longitud que hicimos esta parte, digamos. Entonces tendré un bucle for. Usted int I igual a 0. Yo menos que recuento de artículos. Tenemos que mirar a través de todo. Yo más, más. Si AD para comercializar artículo. Yo más uno es igual a eso es que es un punto o es igual al remitente del mensaje. Entonces incrementaremos la corriente. Tendremos este AD actual. Como antes. Funcionará ya que el trabajo es ese token ID. Entonces obtendremos el artículo. Obtendremos el artículo de nuestro AD de mapeo. A continuación, inserte ese elemento en nuestra matriz vacía de artículos, que es índice actual es igual al elemento actual. Y por último, incrementaremos el índice actual. Y luego devolveremos los artículos. Por lo que esto va a buscar los artículos que el usuario ha comprado. Ahora, la siguiente función será algo similar, así que solo la copiaré y la pegaré aquí. Devolverá únicamente los artículos que el usuario haya publicado en ese mercado. Por lo que voy a limitar los artículos por lotes listados. Entonces será una vista pública devuelve algo de memoria. las empresas de artículos hoteleros les gusta un pequeño token ID dot current item count 0, current index 0. Entonces te tendré a ti y a mí. Hay diez para deleitarlos. Contar yo más, más. Si id2 comercializa artículo aquí, será vendedor que queramos en lead us, en dosis de plomo. Nosotros usamos ya vendiéndolas. Yo digo remitente punto, recuento de artículos más uno. Entonces tenemos está vacío en una barra yo es igual a 0, yo menos que total artículo recuento I más, más. Si hice el jugador del mercado ID para comercializar artículo aquí, será vendedor. El remitente del mensaje. Escribiste ID actual. ¿ Es bueno escuchar? Funcionará como funcionará como la identificación Como eso es todo eso. También parten de 0, luego uno, después dos, luego tres, esa soja, es la única razón. Entonces vamos a obtener el, obtener ese elemento del mapeo. Inserta eso en nuestra matriz vacía aquí, y luego devuelve ese elemento. Eso es todo. Por lo que esta es su funcionalidad para buscar cualquiera de estos creados, o se puede decir enumerado por el usuario. Entonces espero que hayas aprendido y disfrutado mucho. Eso es todo por este video. Nos vemos en la próxima sesión. Gracias. 9. Video 8 Funcionalidad para revender y cancelar artículos de mercado: Hola, está relacionado con el tiempo. Las dos últimas funcionalidades que estos dos revenden así como pueden ver un listado de NFT. Entonces comentemos primero. Permite al usuario a la celda A2 puede haber perseguido. Cuando Jim revende puede usted en 56 Token ID. ¿ Durante su precio de 56? Será una función pública, será una pagadera. Ahora, habrá algunos requisitos. Las dos primeras columnas serán un artículo de mercado D2. Id. El propietario del punto debe ser el remitente del punto del mensaje. ¿ Cómo puede vender la NFT de otra persona? Única partida en eso otra vez, esta operación. Entonces siguiente requisito, necesitamos asignar ítem. Entonces id punto, no, no esto. Simplemente diré mensaje valor punto debe ser precio de listado porque aquí de nuevo, usted es realmente hedor que NFT, por lo que hay que pagar el precio del listado. Las jugadas deben ser iguales a esta cosa. Carrera. Si se cumplen estos requisitos, ahora simplemente haga la updation de que este token ID es igual a false. Entonces simplemente cópialo. Pégalo tres veces. El segundo será un columpio, sea el lugar. Si alguien cambia, el precio, será pagadero. Remitente del mensaje. Oh, no. Oh no, volverá a ser. Esta dirección contractual. Ahora de nuevo, ahora se traslada a esta dirección contractual. Entonces vamos a decretar los artículos vendidos como esas propiedades del suelo, nuevamente listadas. Y vamos a transferir esa propiedad. Ese es el remitente del mensaje. Dirección. Este contrato puede ser de ayuda. Entonces así es como escribimos la funcionalidad para revenderlo token. Ahora, es el momento. Escribimos esa funcionalidad para cancelar un anuncio. Esa es la lista de alguien ahí, NFP al mercado. Y luego enseñaron, no, no quiero venderlo. Quiero volver a ser dueño de ella. Sepa que esta función les permitirá hacer eso. Puedes vender su listado en el mercado. Un Chen puede venderlos. Listado. Esto tendrá, se fue aunque 56 token idea otra vez, que es el token que necesito cancelar. Simplemente será una función pública. Aquí. Esos requisitos serán. Lo primero será lo mismo. Ese es un token de identificación. Aquí. Mencionaremos ese token ID y luego escribiremos si el vendedor es el mensaje de ese remitente o no. Si no, entonces vamos a mostrar en Lee Los vendedores pueden realizar esta operación. Y el segundo requisito se agregará al artículo del mercado. Así que puede id punto alma, si tenemos que asegurarnos de que no está siendo únicamente en el puede vender un términos que aún no lo son. Eso es todo. Se cumplen estos requisitos. Entonces simplemente, haremos la updation en el mapeo. Eso es Token ID, que es igual al propietario será de nuevo este mensaje que ID del remitente que vendedor, vendedor será nulo. Eso es dirección, que es 0 dirección. Y luego ID. Token ID no vendido, simplemente lo hará vendido. El artículo simplemente se vende al propio usuario. Sólo podemos decir incremento de punto de artículo porque nosotros, vamos a conseguir nuestro compartido. Ese es el precio del listado. Ahora le toca a la no auditoría. Úsalo si quiere venderlo o no porque ya nos ha pagado ese precio de listado. Por lo que sólo nos transferiremos ese precio de listado a nosotros que es el dueño del contrato inteligente. Precio de listado de transferencia. Y transferiremos la propiedad de esta dirección al remitente del mensaje, no Token ID. Entonces eso es que las funcionalidades ya están listas. Nuestro contrato inteligente está terminado. Espero que hayan aprendido mucho aquí. Si no, asegúrate de no seguir adelante, pero trata de entender qué hace esta palabra clave, qué hace esta palabra clave, que conceptos básicos. En el siguiente video, trabajaremos en las pruebas unitarias para asegurarnos de que todas estas funciones estén funcionando, preferimos trabajar correctamente antes implementarla a la red de prueba. Pero eso es todo. Gracias. 10. Video 9 Prueba de unidad para implementar el contrato: Hola, bienvenidos al nuevo módulo donde trabajaremos en las pruebas unitarias ya que Blockchain es inmutable. Por lo tanto, antes de implementar nuestro contrato, escribimos pruebas unitarias para asegurarnos de que todas nuestras funciones y variables en nuestro contrato inteligente estén funcionando. Y giran los valores correctos. Estaremos utilizando la biblioteca Mocha Chai para este propósito. Entonces ahora comencemos. En esa carpeta de prueba, crea un nuevo archivo y nombrelo NFT market. Saludos. Requiere de algunos laboratorios que se encuentra dentro de la biblioteca infantil. Vamos a requerir vamos a requerir esta espera. Y lo haremos, nos lo requeriremos de la biblioteca de Harvard tenía. Así. Espero que sepas escribir prueba en. Eso es en más tímido tarjeta porque estos son los básicos. No soy yo no estaría explicando mucho. Vamos a nombrar esto. Describir solo se utiliza para agrupar o se puede decir anidar nuestros casos de prueba. Así es como lo escribimos. Mocha utiliza ganchos para organizar esta estructura. Una de ellas es esta descripción. Será des, llora. Así. Se describirá. Ahora tienen, vamos a tener alguna manera era si el mercado entonces plomo, sonrisa NFT hizo n. si D menor. Entonces vamos a enumerar, alabar y liderar. Contrato o no, desierto. Todas las variables. Encabezados por Entrez lideran izquierda NFT, mercado actriz de mercadocomo esta. Y si la dirección del comercializador y tendremos el precio de subasta, precio subasta, sólo puede decir el precio de venta. Simplemente lo estoy escribiendo en una constante para que sea fácil androide. Una tercera, así. Simplemente lo escribiremos en los detalles de Henrik. Ahora. Lo primero que haremos es usar un antes de cada gancho. Simplemente, este es un gancho que se realizará antes de cada caso de prueba. Entonces sólo hay que escribirlo una vez. Aquí. Vamos a leer dest para desplegar el contrato. Vamos a tener NF2 mercado es igual a esperar. Comedores punto obtener contrato de fábrica. Nuestro auto. Nuestro nombre de contrato es NFT marketplace. Que el mercado NFT es igual a esperar. Mercado Nf2, no desplegar. Este es el código de despliegue. Esperaremos hasta que se haya desplegado. Entonces obtendremos dirección downmarket y la almacenaremos en esta variable que es NF2 market dot address. Entonces conseguiremos algunas direcciones de prueba que es contrato o no. Y por el Jezreel llegar de comedores que se pone sinusal como este. Estas serán cuentas ficticias que nos dé el entorno hardhead. Se puede decir, sí, el medio ambiente. Entonces tendremos listado precio es igual a esperar. Si el mercado punto. Aquí, ahora llamaremos a esta función que es obtener precio de listado. Y ahora somos capaces de llamarlo con esta instancia que es instancia desplegada NFT. Entonces simplemente Gng ToString es listado precio da2, cadena, así. Y lo siguiente que haremos es simplemente crear una función que nos ayude a acuñar alistarse NFT. Dejemos que más adelante. Cuando estamos probando, no tenemos que escribir este código una y otra vez. Lista de significación. Y si D es igual a un sumidero, aceptará este URI de token. Precio de subasta transacción balanceada. Esta es la variable de estado, es igual a esperar, NFT market dot crear dos candidatos que ahora estamos llamando a esta función crear token enviará ese token URI, precio de venta. Y tenemos tours. Así que asegúrate de que estamos enviando el precio del anuncio. Entonces vamos a conseguir papi ver, esperar transacción ese peso balanceado moneda ID a recibo. Eso acontece. ID de token de punto de 0 puntos. Podrías estar pensando, Espera, solo te estoy explicando. Podrías estar pensando ¿qué es eso? Podrías estar pensando ¿qué es esto? Entonces cuando estamos esperando esta transacción, va a guardar aquí. Y cuando lo imprimimos es si quieres consola dot log recibo, entonces obtendrás que se está anidando. Es decir, habrá mapas ya los hay. Entonces solo estamos obteniendo ese token ID de él. Eso es todo. Por lo que esta es la base de nuestra prueba unitaria. En el siguiente video, escribiremos todos y cada uno de los casos de prueba. Entonces nos vemos en la próxima sesión. 11. Video 10 Prueba de unidad para mentar y enumerar nft: Hola, bienvenidos de nuevo. En este video, escribiremos el escritorio de la unidad para enlistar a y F d Así que comencemos con la describe. Es decir, como sabemos, podemos escritorio usando este club, podemos anidar nuestra o podemos anidar nuestra prueba de grupo y todo. Este será principal y enumerará un nuevo token NFT. Después funtion. Lo primero que haré es const token URI es igual a, es igual a. Sólo voy a tener un dominio. Aunque. ¿ Se puede agregar HTTPS, entonces? Algún token de que eres? Eso es todo. Esto es sólo un maniquí. Más adelante usaremos URI de token real. El primer caso que esté usando el ID en el primer caso de prueba lo hará, debemos recompensar si el precio es 0. Este es el primer caso de prueba. Digamos un fregadero. Esperamos. Ahora utilizaremos para esperar de la biblioteca infantil. Esperar. Simplemente usaremos este significado y enumeraremos NFT. Enviaríamos ese token URI, precio final. Enviaremos 0. Y simplemente, será para revertirse peso. Y qué mensaje vamos a recibir, vamos a recibir este mensaje. El precio debe ser mayor a 0. Esto lo pega aquí. Este es el primer caso de prueba. Ese segundo caso de prueba lo hará, debemos recompensar si listado de lugar no es correcto. Función Sinc. Lo primero lo llamaremos crear NFT. Cuando Chen Here, const Token ID va a esperar, lo siento, solo lo elimino. Y ahora esperan. Esperar. Nft, market dot, crear token. Aquí. Simplemente envíe puede agregar luego precio de subasta y en valor, simplemente envíe 0 para estar en peso muerto de trabajo. Sólo espera. Otro será recompensado con y jugará. Ahora, copia, este lugar debe ser igual al precio del listado. Ahora podrías estar pensando por qué no usé esta función NFT de lista de mantenimiento. Porque aquí estamos cambiando este valor. Pero aquí no estamos aceptando ningún valor como parámetro. Así que solo llamo estáticamente a esta función Crear Token. Es una función pública, así podemos llamarla. Eso es todo. Ahora, vamos por lo menos estos dos casos de prueba. Y antes de eso, me gustaría eliminar este candado y nuestros casos de prueba. Sí, lo hicieron un día más tarde que en los guiones. También. Simplemente eliminar se despliega y queso. De acuerdo, entonces ahora tenemos justo el mercado de NFT. De acuerdo. Ahora trae la línea de comandos en esa carpeta primer conjunto y px, había compilado. A ver qué tenemos que instalar obligatoriamente esta caja de herramientas. De acuerdo, solo hazlo. Npm, instalar la base de laboratorios gnomic borde duro a la caja. Amarillea algunos módulos de nodo y resalte el conflicto que está aquí también. Se ha requerido. Esa es la razón por la que mi papá se había iniciado y a ver si de nuevo conseguimos algún editor o no. De acuerdo, En Suecia de pie. Ahora, compilemos de nuevo y veamos qué nos da. Vale, además, tengo algún error que es de 170 decrementos de línea. La ortografía está mal. El reclamante voy a decir esta disposición a utilizar ya sea ahora, cabeza dura estaban llenos. Somos partidos más duros. A ver. Sombrero duro. Solo trata de revisar nuestras pruebas. ver, estos dos están funcionando. Y si lo desea, sólo puede eliminar uno de esos. O si quieres, puedes usar fundación gnomica. niño madura. Depende de ti, pero en este momento es sólo una advertencia. No interrumpirá el código. Ahora, el próximo caso de prueba será de ocho. Debe crear un NFT con el nodo correcto. Y también se puede hundir URI cuando Chen. Esta primera obra de teatro que ID de token, ID de token es igual a esperar. Mantener lista NFT. Tenemos este identificador URI anterior. Entonces conseguiremos el principal muerto. Entonces, ¿puedes, o va a hacer una lectura MFT market ese token URI? ¿ Puedo hacer const o node y trace es igual a esperar el market dot o nodo de token ID. Entonces estos dos están bastante definidos dentro del contrato. Es decir, podemos conseguir eso enviando a los dos canadienses. Lo siguiente es simplemente comprobar, eso es esperar que la dirección del propietario sea igual a la f d dirección del mercado. Y lo segundo, espera un URI de token muerto medio igual a URI de token. Eso es todo. Este es el caso de prueba aquí. Tercer caso de prueba y caso prueba final en este grupo de agarre de escritorio será debe cumplir con artículo de mercado creado después con éxito esta cosa de NFT. Esta función sinc. Entonces simplemente agregaremos const transacción es igual a esperar NFT O punto de puerta crear token. Entonces, ¿puedes RA precio de remate? El valor será el precio de listado. Entonces dejemos que las armas. El asiento es igual al peso de punto de transacción. Esperar. Ante este peso. Sólo este identificador de token. Lo mismo que vemos los acontecimientos. Ese argumento no es canadiense. Y entonces esperaremos que la transacción se anime. Emite ese evento. Primero tenemos que escribir la instancia del contrato, y después qué emitirá. Emitará aquí que esto, esto, esta cosa, marque el artículo de mercado creado con argumentos. ¿ Puedo hacer dirección de contrato o nodo? Y si la dirección del mercado, precio de subasta y vendido será falsa. Dicho esto, digamos, Bueno, de nuevo, intentemos probarlo. En número realmente grande. Argumento. Debe comprobar. Qué es esto añadido. Mantener lista aceptará dos cosas. Se me olvidó enviar. Alabanza al oxígeno también. Vamos a guardarlo. Y otra vez, intentemos. De acuerdo. Entonces Alda para casos de prueba y ahora correcto. Por lo que estamos tranquilos de que esas funcionalidades están funcionando al menos. En el siguiente video, escribiremos más casos de prueba. Gracias por ver. 12. Video 11 Prueba de unidades para ejecutar la venta de mercado: Hola, bienvenidos de nuevo. En este video, crearemos nuestra próxima prueba dex que es ejecutar la celda de mercados. Nuevamente, así es como describimos. Asegúrese de distinguir unos casos de prueba separados. Es decir, aquí añadiremos, Ejecutar, digamos, de un mercado, Colocar artículo. Después funtion. Nuevamente, vamos a tener un URI de token. Estos, podemos copiar esto solamente. En copia esto. Entonces vamos a tener el primer caso de prueba que será debe revertir si subasta. Cuando a no es correcto. Como decir const nuevo token NFT es igual a esperar significó alistar token NFT, URI y lugar de subasta. Entonces haremos x, x y f d market connect, biota desk porque ahora tenemos que cambiar su dirección. El vendedor no puede comprarlo. Entonces si creamos mercado, venta, mercados venta, nuevo valor token NFT, solo estamos enviando valor aleatorio para no ser revertido peso. Y aquí se va a desviar con esto. Eso es someter Puede enloquecer así. De acuerdo. Entonces el próximo caso de prueba será por un nuevo token. Oh, no. Entradas. Diciendo de nuevo, tendremos const, nuevo token NFT es igual a esperar. Significó alistar NFT token URI y lugar de subasta. Entonces agregaremos const. Dirección del propietario es igual a esperar mercado NF2. O ninguno de ellos será const o saber de este token cuando se enumere. Por lo que ahora esperaremos, ahora el dueño es el mercado. Dirección. Es aquí que vamos a esperar, esperar, oh, no punto de dirección igual a, igual al mercado NFT. Yo vestido, vestido comercializado. Y entonces qué vamos a hacer? Simplemente vamos a crear la venta de mercado que es NFT. Market dot connect se conectará con la dirección de bytes. Dot crear mercado plata lo comprará. Nuevo valor token NFT, precio de subasta. Y después de eso, comprobaremos el nuevo nodo. Y el vestido es igual a esperar a NFT market dot o nat off nuevo token NFT. Aquí. Ahora el nuevo propietario es la dirección de bytes. Tenemos que comprobar que esto está funcionando o no. Esperar nueva dirección del propietario a igual a comprar en la dirección de esa dirección. De acuerdo. Ahora vamos a comprobar si está funcionando correctamente o no. Sí. Por lo que este caso también es correcto. Eso es lo primero que ha presentado mal el precio de subasta. Cuando lo estamos comprando, no estamos enviando la cantidad correcta. Y luego el siguiente caso, nos aseguramos de que la transferencia de propiedad esté funcionando correctamente. Eso es todo. Entonces eso es todo para esta prueba unitaria de prueba. En el siguiente video, continuaremos trabajando en más escritorio para asegurarnos de que nuestro contrato sea que no esté defectuoso o sea cualquiera o no haya ningún error en él. Gracias. 13. Video 12 Test de unidades para revender artículos del mercado: Hola, bienvenidos de nuevo. En este video, escribiremos una prueba unitaria para revender un artículo de mercado. A medida que compartes así es arcilla estaba aquí. Escribiremos g venta de un artículo de buen lugar. Entonces la función. Vamos a tener este token URI. Entonces el primer caso lo hará, debemos revertir si el propietario actual está listado precio no es correcto. Ahora aquí, vamos a tener el nuevo token NFT es igual a esperar lista mantenida, token NFT, URI, y precio de subasta. Después simularemos aguardar, NFT market dot connect por Red Dress. Crear, comercializar venta. Nuevo token NFT. El valor será precio de subasta. Entonces tendremos la expectativa que esto espera. Ahora entiende esto. Aquí. Hemos mantenido, que se mantiene ese token con la dirección del propietario del contrato. Pero en la siguiente línea, estamos tratando de, o se puede decir, acabamos comprar token de punto y ahora el propietario es esa dirección de bytes. Ahora si tratamos de revender que es NFT market dot token. Y ahora estamos tratando de revenderlo con esa dirección del dueño del contrato ya que no estamos usando dot connect. Y aquí, como puedes ver, nuevo precio de subasta de tokens NFT, valor listado lugar ya que estamos tratando de enumerarlo de nuevo. Esto se revertirá, es decir se revertirá peso. Aquí puedes ver que se guarda aquí. Sólo artículo o no puede realizar esta operación. Asegúrate de que esté leyendo los códigos. Y lo siguiente que haremos es despertar. Espere NFT, market dot connect, dirección del comprador, punto revender token. ¿De acuerdo? Sí, podemos ver que lo tenemos todo, vale, eso es nuevo token de NFT, luego precio de subasta que valor. Pero estamos enviando mal el precio del anuncio. Es 0, entonces debe ser recompensado con ser peso muerto. Se puede ver aquí, se debe revertir el peso. El precio era igual al precio de listado como este. ¿ De acuerdo? Este, este caso de prueba se encuentra este tenemos esto que esperar declaración aquí. Entonces el siguiente caso de prueba será asegurarse de que la reventa está funcionando. Es por un nuevo token. Y luego revenderla. Sí, sólo voy a tener estas dos líneas. Eso es nuevo token NFT es igual a mantener lista en ese día. Entonces estamos tratando de conectarnos por domicilio para crear la venta de mercados. Ahora haremos const token. Dueño. La dirección es igual a esperar al propietario del mercado NFT del nuevo token NFT. Ahora, aquí lo comprobaremos. Ahora el nuevo nodo es el comprador. Dirección. Esperar en voy a abordar a igual. Por ello. Me visto punto dirección. De acuerdo, ahora es sencillo. Esto es simplemente una venta de mercado. Entonces lo que vamos a hacer, vamos a perder NFT market connect, mala dirección. Volveremos a revender ese token al contrato. Es el marketplace, nuevo token NFT, precio de subasta, precio de listado de valor. Y entonces tendremos nuevo token es una buena tarifa si el mercado que no son nuevos token NFT. Y ahora aquí, ahora el nuevo dueño debería ser la dirección del mercado porque de nuevo, se está reubicando. Ellos que es el dueño quieren revenderlo al mercado. Se espera nuevo propietario de token iguale. Y si el mercado, vale, vamos a guardarlo y probarlo. Veamos si este escritorio encajona trabajando ahora. Ver el artículo de juego del mercado de accesorios de reventa también está funcionando sin problemas y sin problemas mirar sin adición. Entonces eso es todo por este video. Continuemos con esta serie de pruebas unitarias. Habrá más escritura donde solo uno o dos videos. Entonces después desplegaremos este contrato. Gracias. 14. Video 13 Test de unidades para buscar artículos del mercado: Hola. En este video, escribiremos una prueba unitaria para buscar artículos del mercado. Comencemos con una declaración describe. Entonces tendremos nombre completo que buscar podría obtener artículos de esmalte. Como usted deberá. Tendremoseste dominio. Y también si lo quieres, puedes simplemente escribirlo aquí también. Te toca a ti aquí. Pero sólo lo estoy poniendo dentro de cada escritorio. Garras de cangrejo. Tengamos la primera prueba unitaria del alcance Disney. Es que debe coincidir. El número correcto de artículos no vendidos. Will sólo realmente significaba tres N de t es este perro se puede matriz. Y ahora juega la subasta. Sólo voy a copiar dos veces. Ahora tenemos tres artículos en su mercado. Plomo y vendido. Artículos es igual a esperar. Y F D, comercializa que comercializan artículos. ¿ A ver dónde está esta función? A ver tenemos este buscar artículos del mercado. Y entonces sólo escribiré esperar. Y artículos vendidos. La longitud del punto será igual a tres ya que tenemos 3.5 días. Entonces el siguiente caso debe ser, debe ajo, número de artículos que el usuario ha perseguido. Habremos llevado. El token de Nft es igual a esperar significado enlist NFT token URI, precio de subasta. Entonces volveremos a significar a LFT. Ahora, lo que voy a hacer es crear un mercado vender es NF2 market dot connect. Voy a utilizar, voy a escribir la dirección de bytes. Entonces. Crear venta de mercado. ¿ De acuerdo? Y le doy ese token, lo hice este ID de token de NFT. Entonces serás menos. Piensa que sólo lo estoy comprando. Por lo que rara vez será precio de subasta. ¿De acuerdo? Ahora, simplemente voy a liderar por nuestro total de artículos es igual a esperar NFT conectar vía vestido. Ahora llamaré a buscar. Mi NFC es este, que es mi NFT. Simplemente espera. Esta es la longitud total de puntos de los artículos del comprador. Espero que esto sea igual a uno, ya que solo compré un NFT y otros todavía se levantan es que estos dos siguen cotizados en el mercado. Entonces así es como probamos eso, esté funcionando o no. Y ese tercer caso de prueba será debe corregir número de artículos listados por un usuario. Que esto asegura que en particular los usuarios número de artículos que son correctos. Simplemente voy a significar así. Entonces el tercero, me conectaré con el mercado NFT, punto, conectaré con los biólogos. Eso es clave. Lista. Esto en el mercado. Crear token. Entonces. Por lo que puede URI, precio de subasta, valor, precio de listado. Ahora, dejar propios listados es igual a esperar. Y si el mercado. Ahora aquí podemos ver que hay este parche artículos listados, pero eso es por un usuario en particular. Ahora estamos tratando de hacer los artículos de búsqueda que están listados por el propietario del contrato, no la dirección del comprador. El propietario del contrato ha enumerado a n de t es simplemente esperar. Anuncios de propietarios. La longitud del punto debe ser igual, igual a dos. Eso es todo. Vamos a guardarlo y ahora probarlo. Consulta todos los casos de prueba. ¿ De acuerdo? Por lo que ahora estamos seguros que al menos ese mercado y que es la búsqueda de artículos downmarket están funcionando correctamente. Eso es todo por este video. Nos vemos en el siguiente video, que será el video final de esta serie de pruebas. Y Q. 15. Video 14 Prueba de unidades para cancelar la lista de mercados: Hola, bienvenidos al video final de ese módulo de pruebas, donde escribiremos una unidad de tubo de ensayo puede vender listado de mercado. Ahora, leamos la declaración describe. Será todavía se puede conseguir listado de lugar. Cuando Chen puede usted. Obtengamos el identificador URI del token. Tengamos el, este caso. Es, debería decir, y devolver el número correcto de anuncios. Tengamos a NFT. Token es igual a 08. Mantener lista NFT. Contamos con el token URI y precio de subasta. Entonces queremos crear tokens. Ellos sólo copiarán esto, conectar por punto de dirección crear token. Queremos crear ese token usando esa dirección de comprador. Y el primero se creó a partir del contrato y es dueño de los intereses contractuales. Ahora vamos a dejar que los artículos no vendidos es igual a esperar mercado NFT que los artículos del mercado esperan. Así como términos longitud de punto debe ser igual a tres, es igual a tres. Entonces qué haremos, cancelaremos uno de los productos que es uno de su listado. El uso de puede venderlos listado. Y simplemente enviaremos el ID del token. Y entonces vamos a dejar, vamos a nuevo artículo. Por lo que haremos un mercado NFT de espera que busquen artículos del mercado. Esa es la cantidad que enumeré ahora en el mercado simplemente esperan. Esperar nuevos artículos no vendidos que la tierra debe ser igual a dos desde cuando ahora se cancela. A ver que esta cosa está funcionando o dándonos algún aireador. Sí. Entonces todo está funcionando. Todos los casos de prueba han pasado. Por lo que ahora podemos relajarnos porque no hay ningún error en nuestro contrato inteligente. En el siguiente video, simplemente desplegaremos el contrato inteligente para correlacionar la red de prueba. Y luego más adelante trabajaremos en el front end. Gracias. Nos vemos en el siguiente video. 16. Video 15 Escribir el guion de implementación: Hola, bienvenidos a este nuevo módulo donde escribiremos el script de despliegue o nuestro contrato inteligente. Simplemente cierre este archivo de prueba. Ya no lo necesitamos. En la carpeta scripts, vamos a crear un nuevo archivo y nombre. Desplegamos ab.js. Y empecemos a escribir el código. Al principio, requeriremos un laboratorio terso en el hardhead. Entonces vamos a tener una función principal. Aquí. Solo tenemos que desplegar nuestro contrato como lo hicimos en el archivo de prueba. Al igual que la fábrica de contrato es igual a esperar a los comedores punto obtener contrato de fábrica. Lo será, a ver. Nuevamente, no quiero cometer ningún error. Copiarlo, pegarlo a const contrato es un contrato hecho radar desplegar. Y cada contrato implementado consola punto inicio de sesión en pista. A ellos les gusta tener en pista e insistir solo en consola registrarlo. Porque asegúrate de guardar la dirección para usarla más tarde. En front-end. Entonces sólo vamos a crear otra función. Ya que es una función asíncrona, sólo diremos que run main es igual a un sumidero. Entonces tendremos un bloque try catch. Puede esperar la salida principal de Ross si todo está bien, entonces salga. Si no, entonces console.log el editor y procesa esa salida. Peso uno. Y por último, esta pista en función. Pero así es como escribimos el script de despliegue. Se verá para la mayoría de los proyectos. Sólo tienes que cambiar este nombre por el nombre de tu contrato , y ya está. Simplemente puedes copiar, pegar este código en tus otros archivos también. Ahora, para desplegar nuestro contrato inteligente, tenemos que usar un comando que es y px. Habría corrido. Entonces dentro de scripts para damas, despliega ese js. Pero después de eso, tenemos que mencionar la red también con este guión, dash network y luego el nombre en punto se correlaciona. Estos van en directo. Hemosmencionado en el archivo de config de punto de yoduro y luego pulsamos Enter. Podría llevar algún tiempo. Por lo que nuestro contrato se está desplegando a esta dirección. Asegúrate de copiarlo. Porque en el siguiente video, cuando estemos creando un proyecto de producto Next JS, usaremos esta dirección. Además, si lo deseas, solo puedes asegurarte de verificar las fechas. Van a ir a poner ITO scan, luego simplemente pega tu dirección aquí. Ahora puedes ver que esta es esta dirección estando bajo bloque, blockchain hace 39 segundos. Por lo que tenemos creado este contrato que dijo, es como despliega su contrato. Gracias. 17. Configuración de vídeo 16 y empezar a trabajar en Next js: Hola, bienvenidos al nuevo módulo, donde trabajaremos en la interfaz de usuario. Ahora ya está hecha la porción de contrato inteligente. Podemos empezar a construir la IU. Estaremos usando el siguiente JS, que es un framework de React. Pero para crear la siguiente app js, simplemente tenemos que usar este comando, es decir Bx. Crear. Siguiente aplicación y nombrelo cliente. También. Ahora con el fin de interactuar con nuestro contrato diploide tarifa x Y sólo hay que decir, vale, ahora se está instalando. Ahora para interactuar con ese contrato inteligente desplegado, necesitaremos dos cosas. Eso es primero es la dirección del contrato, que tenemos aquí, y que Amy, ahora para conseguir la EPA, simplemente tenemos que copiar este archivo que está en los artefactos. Tenemos los contratos. Y en sus contratos tenemos este mercado NFT market market dot json file. Simplemente tenemos que copiarlo. Y entonces vamos a ver dónde están parados. Conoce esa carpeta Glenn. De acuerdo. Ahora ya está hecho. Veamos su reclamo para veamos tenemos páginas oblicuas, estilos, nuestros listados. Entonces aquí es simplemente crear una nueva carpeta y nombrarla ABI. Y pega ese archivo JSON aquí así. ¿De acuerdo? Y también para esa dirección de contrato en esa carpeta de cliente, crearé un nuevo archivo y le pondré un nombre. Config punto J S. Aquí. Sí, tendré dos variables. En primer lugar, exportamos const, domicilio del contrato. Y lo segundo que necesitaremos es la URL que se const en menos. Url es igual a como este. Para la dirección del contrato, simplemente imprima esta y peguela aquí. La infusión. Sólo hay que ir aquí. Lo mismo, clave administrada y copia esta URL y pegarla aquí. Estaes la red principal. No, no los necesito en red. A ver. la última red. De acuerdo. La URL inferior también. Ahora, con los próximos años, usaremos un framework CSS conocido como tailwind es una utilidad para framework CSS que hace que sea fácil agregar estilo, y crear sitios web goo, de buen aspecto sin una gran cantidad de trabajan para instalar esas dependencias de viento de cola. Primero, tenemos que ir al directorio del cliente, cd al cliente y teclear este comando, npm. Instalar el acuerdo cuando CSS en Delhi más reciente CSS más reciente, arreglar y directo más reciente. Esto. Y solo presiona Enter. Conoce más sobre Tailwind y todo. Simplemente puedes escribir. Siguiente ajedrez. Una vida. Aquí. Simplemente puedes leer la documentación dice, bueno, vamos a hacer estos cambios. Ahora como se puede ver, lo que el comando y toda vía tienen instalado, instalado. Los paquetes solo, lo revisaré una vez, está bien. De acuerdo. Ahora crearemos los archivos de configuración necesarios para que Tailwind trabaje conmigo el próximo año es que es Tailwind dot config dot js file y post sss dot config dot js file. Y podemos hacerlo ejecutando este comando y bx. Cuando CSS en esto, eso es todo. Tenemos estos archivos ahora. A continuación, configura nuestra parte de contenido de plantilla en Tailwind dot config dot js aquí. Como pueden ver, esta línea, simplemente tenemos que copiar esto. Tenemos sillas, dx y tenemos esta línea. Simplemente hay que copiar esta línea de este sitio web que está confeccionando CSS y cómo instalar los próximos años. Y pegarlo aquí así. Y luego borra esa barra de estilo de codificación, CSS global que está aquí. Aquí, borre esto y reemplácelo con esta línea de código. Esta semana, esta línea de código, eso es todo. Es así como se hace la configuración. Entonces lo haremos con estilo, pocas dependencias requeridas, que se requerirán más adelante. En ese Glenn para menos simplemente escribir npm instalar árbol modelo espacio XES. El modelo de árbol web le permite conectar su aplicación demasiados proveedores de billetera como Coinbase, MetaMask, Wallet Connect y XES hace que sea fácil de ejecutar como solicitud HTTP sincrónica para descansar, y realizar la operación. Usaremos XES para obtener datos a la API DOM más adelante. Así que ahora simplemente vamos a ejecutar nuestra próxima aplicación JS usando npm run dev. De acuerdo, vámonos. Y simplemente la URL localhost 3 mil. Y puedes ver que tenemos nuestra próxima aplicación js en ejecución. Para que se haga esa parte de configuración. Trabajemos en la siguiente porción de front-end de GS. Eliminar todo en el archivo index.js, que está dentro de las páginas aquí. Tenemos archivo index.js. Eliminamos todo y comenzamos con la importación de dependencias. Eso es importante. Éteres. Éteres. Después Importa, usa y afecta estado de uso gamma desde React. Entonces tenemos dos entradas x, z OS de nosotros. Entonces tenemos que importar modelo de árbol, modelo tres. Entonces importaremos contrato y vestimenta. Y eso es de aquí. Hablo de estos estudios, dirección de contrato y una URL en la URL del archivo de configuración como este. Y por último, voy a importar ese mercado NFT de que es esa instancia de contrato de la ABA utilizando este conjunto de datos. Tenemos el ABA y luego tenemos NFT marketplace dot json file. Este archivo que estamos exportando por defecto es NFPA. La ortografía está mal. Y si el mercado distinto. Ahora, vamos a tener un default de exportación. Espero, ya sabes un poco duro reaccionar y el próximo año es porque esto no te va a enseñar, es hacer realmente se trata NFT mercado de retorno. Tenemos este div. Simplemente. Tenemos, vamos a venir a, A ver si lo guardo. ¿ Qué pasa? A ver, tenemos esta bienvenida a casa. Sé que no se ve bien en este momento. Pero eso es lo primero. Trabajemos en la parte de navegación hacia abajo, que será persistente en todas las páginas. Para configurar esto, tenemos que ir a este archivo ab.js, que está dentro de las páginas. Y aquí simplemente tenemos que devolver múltiples cosas. Entonces, antes que nada, simplemente no lo borras, solo córtalo. Entonces dentro de aquí, tendremos un div y simplemente lo pegaremos abajo. Y por encima de este componente, tendremos nuestra navegación en este nav. Ahora empezaré a usar Tailwind CSS que está bordeado agregando seis. Entonces voy a tener un p tag Meta peor. Y si la tienda, le daré algo de relleno a esto también, texto ClassName. Para Excel. En la parte de arriba. Voy a importar enlace desde el siguiente enlace. Entonces simplemente tendré un div vacío, que será flex margin top four. Y entonces empezaré a tener mi enlace. Este enlace debería F. Y dentro de ese enlace, tendré una etiqueta de anclaje. Nómalo hogar. Tengamos algunos nombres de clase que es margin-derecho o texto siendo 500. Así. Y ahora simplemente copia esto y pega tres veces. El siguiente HF será crear NFT. Serán márgenes seis. Y limitaré vender, vender, NFT. Entonces el siguiente YO será mi. Si estas y yo simplemente nombraré es mi NFT. La última navegación será el panel Creator. Tablero de instrumentos. Simplemente di, bueno, ahora revisemos nuestra página web. ver, tenemos esta casa. Se ve decente. No diré que este es el mejor diseño, pero nuestro enfoque será más en la implementación completa de ese mercado NFT. Puedes cambiar el diseño más adelante usando cualquier snippets o código que obtengas en internet, Depende de ti. Entonces eso es todo. Para este video. En el siguiente video, trabajaremos en la funcionalidad para mostrar que NFP está aquí desde el blockchain. Gracias. 18. Función de vídeo 17 para cargar NFT: Hola. En este video, trabajaremos en la tecnología med para cargar NFT. Entonces empecemos primero con algunas variables. Y si D está configurado, y si estos son locales para usar state, usaremos el gancho React y lo daremos vacío al principio. Y eso son segundos. Estado será estado de carga. Conjunto. El estado de carga es igual al estado u. Y al principio simplemente escribiremos no cargado. Porque esto lo hará, mostraremos un indicador de carga o un texto mientras vamos a buscar del blockchain. Ahora, comencemos con nuestra función. Lo nombraremos, Señor. Y si estos, entonces lo primero que haremos es tener un proveedor, nuevos comedores, el proveedor de dosis alta de punto JSON RPC. Y lo segundo tendremos una instancia de nuestro contrato de mercado. Contrato. Entonces el primer parámetro toma la dirección del contrato. Segundo, toma el ABA. Y cansado se necesita el pro hided es aquí estamos usando el JSON RPC. Puedes Google lo que es, qué hace el JSON RPC y todo lo hace. Pero en términos simples aquí, simplemente, no autentificará al usuario usando la máscara Meta. Ya que v acaba de buscar todos los datos, no algunos datos particulares relacionados con el usuario. Entonces vamos a tener esos datos. Llamaremos a esa función en nuestro contrato, que se llama Miss artículos del mercado de mascotas. Entonces estos son Alda, eso es todo. Nft es. Esto es lo que hace. También esta carga NFT debería dispararse cada vez que alguien venga a nuestro sitio web, eso es lo primero. Usaremos el gancho de efecto de Estados Unidos y llamaremos a esta función así. Y debería llamarse sólo una vez. Entonces aquí, estos son solo conceptos de reaccionar. A continuación, lo que vamos a hacer es aquí estamos obteniendo una matriz de elementos que primero lo convertiremos, convertirlos en un objeto. O puedes decir que esto es un objeto JavaScript, solamente. Los artículos const así como para esperar inicio rami. Aquí. Tenemos este mapa de puntos de datos. En su interior. Tenemos un fregadero. Esto me gusta. Ahora. Lo primero, vamos a conseguir ese token, URI. Contrato de mercado. URI de token. Simplemente enviaremos ese ID de token y con eso, obtendremos el URI del token. O puedes decir esa URL HTTP. Entonces. Ahora usaremos la biblioteca x z OS. Es XES get token URI. Entonces tenemos ese precio. Vamos a convertirlo en cadena. Es decir, comedores. Hacer tratos de ese formato. Unidades. I dot price dot two string. De acuerdo, ahora vamos a crear un objeto, objeto JavaScript. El primero que alabamos, que puede ser Token ID. Seré yo, puedo número de identificación, luego vendedor, un vendedor. Entonces tenemos al dueño, al dueño. Entonces tenemos la imagen. Imagen vamos a escribir como datos de punto metta, nombre de punto. Y descripción se cumplirá la descripción de los datos. Y luego simplemente devolveremos el artículo. Entonces lo que hace es simplemente crear una matriz de elementos, objetos. Por lo que este mapeo simplemente necesita y una variable, puede configurar estos artículos y almacenar todo en esa área. Y por último, lo que vamos a hacer es decir que el estado de NFT con esta variable items y establecer el estado de carga a simplemente cargado. Así. Esta función de cosas para asegurarnos de que estamos cargando los LFT desde el blockchain. Lo siguiente que haremos es aquí haremos algunos cambios de retorno. Eso es aquí. Si, si el estado de carga es igual a no cargado, entonces simplemente devolverá un apellido, bx dos en d Eso es mendigar en el eje x, leyendo ¿por qué entonces eje y? X es tres x Estos son todos CSS de viento de cola. Y simplemente escribiremos carga de peso. Y si estado de carga es igual a cargado, pero también y si D es esa longitud no está ahí, es decir, dice 0. Después volveremos de nuevo otro H1. Pero aquí simplemente no escribiremos artículos en marketplace. ¿ De acuerdo? Y si ambos son falsos, entonces volveremos simplemente a ellos a casa. Pero esto lo configuraremos en videos más adelante. Ahora vamos a ahorrar. A ver si j está en el editor. Cuando todo está funcionando. A ver, aquí tenemos alguna edición. Diferenciémonos. A ver. Creo que podríamos haber cometido algún error, no pudimos detectar red. Vamos a intentarlo de nuevo. Creo que no lo tenemos instalado. Creo que este podría ser el caso. A ver es puede ser un tema aquí porque no puedo ver comedores. Vamos a instalarlo primero. Vm en intereses estelares. De acuerdo, a ver. Ahora tenemos e tos con estilo. Hagamos npm run dev. Echemos un vistazo a la ganancia. Sólo dame un poco de tiempo. Veré cuál es la edición. Vale, capté el error. Aquí. En esa URL JSON RPC, tienes que ingresar tu URL inferior, que estás obteniendo del archivo de configuración. Simplemente copiaremos esto y lo pegaremos aquí. Eso es todo. Ese era el tema. Y ahora se puede ver si me refresco también. No muestra ningún artículo en el marketplace. Pero eso es todo por este video. Gracias. 19. Función de video 18 para comprar NFT: Hola. En este video escribiremos la función para comprar una NFT. Entonces debajo de esto, vamos a escribir la función sinc por NFT. Enviaremos aquí los datos de NFT como parámetro. Entonces. Ahora utilizaremos el modelo Web tres para conectarnos a MetaMask. Antes no nos conectaremos a mi Damasio solo estáticamente usando JSON RPC y llamando a esa función. Pero aquí necesitaremos dirección de usuario volea que visten es por eso la conexión const es igual a esperar árbol modelo dot connect. Entonces const Hadar es igual a mu. Resulta proveedor de inicio punto web triploide en este momento. Y tenemos que enviar esta conexión. Entonces lo que haremos es asegurarnos que el usuario esté conectado a esa red. Harán conseguir Red es igual a esperar proveedor dot get network. Entonces sabemos que el ID de la cadena neta, es decir su ID es cinco. Por lo que simplemente tendremos un cheque. Si obtiene red dot j no es igual a garlic chain ID, entonces tendrá un diálogo de alerta, que dirá que no está conectado a una red. Y entonces regresaremos de aquí. No ejecutaremos esa función. Y si lo es, vale, entonces firmaremos la transacción. Hace firmante. Para proporcionar obtener inicio de sesión. Entonces tendremos la instancia de contrato, nuevo contrato de ethers dot. Y entonces tendremos eso. Deberíamos enviar la dirección del contrato, entonces esa ABI. Y luego el firmante. Entonces vamos a analizar ese precio usando comedores dot util, dot bars, units, NFT, no corsé, punto, dos cuerdas. Así. Entonces tendremos esa transacción igual a esperar. Un punto de pista el nombre de ese contrato inteligente índice de desmarque es crear venta en el mercado. Y ahora tenemos que enviar ese token. Y si el token ID, así como ese valor, ese es el precio de ese token. Entonces puntuaremos para que se complete esta transición. Y después de eso volveremos a cargar NFT para que refresque la página. Por lo que esta es la funcionalidad para comprar un nuevo NFT. Entonces tenemos que devolver el HTML o la IU. Si el usuario carga y FDA, entonces debe haber alguna IU a dosis baja y FTE se muestran en esos. Y si D es un simple, empecemos. Empecemos por aquí. Con esto. Dave. Voy a dar un poco de estilismo. Flex. Justificar centro. Entonces el nombre de la clase aquí, otra vez dentro allá lo hará con Dave no habrá relleno en el eje x, y. y usaré este estilo personalizado, es decir, máximo, será de 1600 dólares. Puedes cambiar el estilo de acuerdo a ti, acuerdo a tu deseo. Tengamos grilla. Crear. Uno. En sonrisa dice, debería ser genial. Para ampliar los dispositivos. Debe pagar el grado cuatro. Entonces tenemos relleno. La parte superior es igual a cuatro. ¿ De acuerdo? Ahora, vamos a recorrer eso y Nephthys, el estado, el desierto. Por eso he usado estas llaves porque no estamos haciendo algún trabajo lógico. Me gustaría que NFT sea ese mapa. Entonces en esto vamos a dar, obtener una sola NFT así como el índice. Puedes pasar el cursor sobre él. ver, también obtenemos el índice. Ahora, Comencemos con un div. Tenemos que conseguir que g sea igual al índice. Entonces el apellido es igual a frontera, sombra alrededor de eso. Y luego desbordamiento oculto así. Ahora aquí traeremos la imagen, así que tenemos que importar imagen de siguiente imagen aquí, la muy superior. Usaremos esa imagen. Puedes simplemente cerrarla aquí. El origen de la imagen será NFT, esa imagen, que es imagen de punto, porque aquí tenemos este objeto de imagen. Daremos el nombre, es decir nombre de punto NFT. Entonces el peso es igual a 300, la altura igual a 200. Entonces tendremos un titular de lugar también. Es marcador de posición y escribiremos desenfoque. Esa sigue siendo la orilla mayor, hazla difuminar. Y luego borrosa URL de datos. Sí. Hemos colocado imagen. Es decir, pueden ver que he colocado una imagen en ese cliente. Entonces público ve, he pegado esta imagen desde Internet. Es simple marcador de posición. Y es el punto de extensión PNG. Y entonces el diseño será responsivo así. ¿ De acuerdo? Entonces tendré otro div abajo, debajo de esa imagen. Classname, solo dale un poco de relleno. Entonces cuando se grafica el estilo será 64, Excel, nombre de la clase. A continuación, Excel no son semi negrita. Y aquí realmente exhibe la NFT, ese nombre. Entonces tendremos otro div, tendremos Stine, I, 70 pixel. Entonces se ocultará el desbordamiento de coma. En su interior. Tendremos p tag y clase 2.5 de texto, un 400. Y mostrará la descripción de NFT. ¿ De acuerdo? Después de eso, sólo tendremos un botón para activar esto mediante la función NFT. Ahora debajo de esto, estos dos div que está dentro del div principal tendrán otro div. Tendrá className, lectura para fondo, negro que nombre de cristal, texto, excel, margen inferior, o no son, bowl. A continuación, blanco. Aquí vamos a mostrar que si d, esa tasa de precio comen en su corriente. Y debajo de esto, que estos lado a lado o no, diré a continuación esto mostrará un botón el cual escribirá por ahora. Y vamos a darle un poco de estilo a esto también. Sé que estos son muchos códigos, pero hay que hacerlo. Espera. Bolsa, es decir color de fondo siendo 500. Texto, blanco, tazón, lecho eje Y a lectura del eje x hasta el final. Redondeado. Pero eso es todo ese diseño de nombre de clase y todo. Ahora simplemente escribiremos el onclick. Onclick activará la función por n f d, t Se disparará por una F D y está aceptando un medidor. Tenemos que enviar los datos de la NFT. Eso es todo. Eso es todo. Este es el código o la parte externa de mostrar el NFT en la pantalla de inicio. Si lo deseas, solo puedes pausar el video y volver a comprobarlo con su código. Y si están en el futuro, tenemos algún error. Obviamente lo resolveremos. Gracias, Eso es todo por este video. 20. Configurar las teclas de Pinata IPFS para 19: Hola. En este video, trabajaremos en la creación de un nuevo listado para el mercado. Entonces antes de eso, debemos tener que las claves estén configuradas en los datos en nuestra aplicación. Nos ayudará a subir nuestra imagen NFT y otros datos en IPFS. Para eso, vamos a pinup dot dot cloud que simplemente si no tienes una cuenta, haz clic en registrarte, solo voy a iniciar sesión. Después de eso. Como ya tengo una cuenta, me envían directamente a mi dashboard. Si lo deseas, solo puedes pausar el video y crear una nueva cuenta. Ahora, deberíamos obtener las claves API para subirlas. Para eso, simplemente haga clic en la esquina superior derecha. Luego claves API, luego nueva clave. Ahora simplemente permitalo. A continuación, establecer la llave animal max se puede utilizar. Sólo déjalo. Simplemente lo pondré un nombre. Y si el market place así, entonces voy a dar click en Create Key. Ahora, solo asegúrate de no cerrar esta ventana modal porque esta clave secreta solo se mostrará una vez. La clave API se puede ver más adelante también, pero este secreto se verá sólo unos. Así que simplemente copia esta clave API secreta. Ir al archivo config dot js, donde ya tenemos en menos y dirección de contrato. Aquí, simplemente escribe export const. Primero escribiré clave, y luego escribiré export const, data, secret. El secreto, sólo pegarlo. Y también copia esa llave también. Eso es todo. Ahora podemos cerrar esto y también dar clic en Hecho aquí. Ahora ya está todo listo. Vamos al editor de código. Y en las páginas, basta con crear una nueva pantalla y ponerle un nombre. Crear. Si d es dot js, solo recuerda dar el mismo nombre. Tú lo das aquí, eso es aquí. Esto es crear PFN, después hacerlo. Supongamos que NFT es, está bien. Simplemente cámbiale el nombre. Y si D, porque obviamente estamos creando uno y theta tiempo. Y así es como el próximo año funciona la navegación. En última instancia van al nombre del archivo correspondiente a esto. Ahora aquí en esta página, los usuarios pueden crear LFT de alistamiento. Podrán subir y guardar las imágenes a IPFS así como podrán establecer metadatos y precio del artículo. Empecemos con algunas importaciones. Fecha de uso. Yo estoy reaccionando. E importar. Duele de éter no de cabeza dura. Ese insumo. Usa el router también más adelante, Vamos a verlo, lo usaremos o no. Siguiente. Y al aire libre que importar el árbol modelo tres modelo. Ahora importaremos las constantes desde el archivo config. El primero es que sólo iría a copiar y pegar. Aquí requeriremos dirección de contrato, luego llaves de piñata de coma. Entonces piñata secreta, llegar a otro secreto. Config. Entonces importaré NFT, comercializaré, los colocaré aquí y solo me aseguraré de que todo esté correcto. Entonces importaré x z plus x z OS. Y por último, importaré imagen de la siguiente imagen. Siguiente tramo, vamos, vamos a exportar nuestro AP, CS, un valor por defecto, nombrelo, crear una F D. Entonces vamos a empezar con alguna declaración de variable que este archivo URL. Y luego establece la URL del archivo para usar la fecha. Y luego leyendo archivos , tendrá un valor de nulo. Entonces. Ahora usaremos algo así como input. Actualización. De entrada es que vamos a usar fecha. Pero aquí, ahora tendremos una estructura como esa es un objeto y D la estructuraremos más adelante. Esta elección. Estos los escribiremos en el campo de texto y lo guardaremos aquí. Entonces tendremos ese exterior, que reutilizará router. Y entonces tendremos su estado de carga. Conjunto. Estado de carga. Utilizan fecha. Lo primero es que el primer estado será no carga, no carga. K. También hay que saber más sobre las API de piñata. Simplemente puedes ir a. Eso es pinata oscurece la pintura. Aquí. Se puede ver. Aquí podemos ver cómo vamos a hacer las cosas que, es decir, ¿cuáles son los endpoints, cómo se usará el archivo pin? Usaremos desorientado como supongo. Depende como vamos a pin Jason también y vamos a pin el archivo de imagen está escrito. entenderás más adelante, pero asegúrate de leer estas dos secciones. Gracias. Eso es todo por este video. Nos vemos en la próxima sesión. 21. Función de vídeo 20 para subir archivos a Pinata: Hola, bienvenidos de nuevo. En este video, trabajaremos en la función para subir archivos datos estúpidos. Empecemos. Pero creo que una función sinc subir imagen. Lo enviaremos como parámetro aquí desde el archivo de entrada. Aquí. Acabamos de obtener phi es igual a E dot target dot files 0. Es así como obtenemos el archivo del campo de entrada. Entonces vamos a intentarlo. Bloque de captura. Console dot registrará el editor. Ahora, en ese intento, Vamos a tener const. Los datos son buenos para el nuevo objeto de datos. Y entonces simplemente formaremos un punto theta append. Anexar archivo. Por eso es el archivo seleccionado. Ahora, lo tendremos enviará el z OS, es decir XES HttpRequest. Resultado. Y es igual a esperar z OS. Entonces dentro de él, Vamos a haber importado como forzado que URL será http slash api dot piñata, dotCloud slash slash. Cuando F mayúscula phi a IPFS. Esto lo obtengo de la documentación. Entonces los datos serán datos de formulario. Aquí sólo estamos subiendo el archivo. No tontos cabeceras dynode Italia. En los encabezados, nos autenticaremos con clave piñata. Nos piñata llave. Entonces. Piñata secreta. Apa, E será ahora hace secreto. Y por último, el tipo de contenido. Y aquí la C será capital. El tipo de contenido son datos de formulario de varias partes. Este es el contenido Content-Type. Cuando estamos subiendo un archivo. Eso es todo. Después de eso, crearemos la URL de la imagen, es decir para la piñata. Simplemente escribe Shift plus no shift solo directamente el punto que está por debajo de la palabra clave escape, tenemos esto. Simplemente escriba HTTP S Gateway, piñata, Cloud slash, IPFS slash. Ahora, pega esto. Obtendremos el CAD. Es decir, creo que el contenido. Simplemente se me olvidó algo. Fue CAD. Identificador de contenido en piñata. Eso lo conseguirás. Estéticamentegeht es phi punto de datos punto B. Ipfs hash. Y finalmente establecer la URL del archivo a esta URL de imagen. En palabras sencillas, esta es la URL que obtenemos cuando subimos el archivo en Pinjin. Para que ese usuario pueda apuntar a esa ubicación y mostrar la imagen. Entonces esta función simplemente sube la imagen dos, IPFS. Esto hace en esta función sólo funciona eso? ¿ Ahora? Entonces la siguiente función que tenemos que crear es subir los metadatos así como metadatos incluye título, descripción y precio. Hagamos eso. Función Sinc. Connivencia con IPFS. Ahora deja que el nombre de la estructura, descripción y precio de entrada, que es un objeto. Ahora simplemente comprobaremos si el nombre está vacío, nuestra descripción está vacía. Odd. Rice así como la URL del archivo está vacía. Entonces sólo volverá de aquí. Si no, entonces cambiaremos el estado diluyente a cargar así. Y ahora vamos a tener un bloque try catch. Y subiendo. ¿ Por qué? No lo sé. De acuerdo. En ese bloque try catch, Hagamos datos JSON. Se va a hacer Jason puntos, estringificar, no han sido. Mis datos. Estos también son dominio de la documentación. Puedes leer la documentación y entender cómo estamos subiendo este archivo JSON. Nombre. Nombre será el nombre de la variable dot json. Este es el nombre del archivo. Y entonces nosotros no. El contenido será jet json como nombre. Descripción. Y la imagen será URL de archivo. Así. Después de estos datos JSON. Ahora vamos a subir este archivo JSON también al IPFS. Const. Phi es igual a esperar ceros. Ahora, de nuevo, solo copiemos esto y haremos los cambios. publicarán aquí, URL será pin, no está bien. Cuando Jason J capital todo Capital Jason a IPFS, entonces los datos serán datos JSON, éste. Copia y pon esto en los encabezados también. La clave secreta de APN será la misma. Sólo el cambio será el tipo de contenido de la aplicación, json. Entonces aquí estamos subiendo archivo de metadatos y luego obteniendo ese token URI. Cómo estructuraremos esa URL del token así. Nuevamente, HTTP S Gateway, piñata, cloud slash, IPFS slash. Lo mismo aquí también. Menos datos de punto de archivo punto a, B, F, S hash. Y luego devolveremos el identificador URI del token. Eso es todo. Entonces esta era la función para subir dirección IP, es decir metadatos. Tengamos algún comentario. Primero, precargue los datos medidos a IPFS y luego regrese. Ustedes son señoritas el contenido o el identificador URI de token para usar en una transacción posterior. Sólo por la referencia o sólo para mí, sólo que usted entienda. Más adelante, paso a paso, entenderás dónde estamos usando esta función, dónde estamos usando esta función. Y una y otra vez, digo desde el principio, estaba muy confundido. Pero cuando leo la documentación de piñata sobre cómo obtener esto o cómo escribir los encabezados. Y ahora aprendí todo esa documentación. Eso es todo por este video. Gracias. 22. Video 21 Función para enumerar a NFT en el mercado: Hola. En este video escribiremos la función para listar la NFT en el mercado. Antes hemos escrito esa función para subir las imágenes o los metadatos, pero ahora es el momento. También enumeramos en el contrato. Eso es en el que ya está desplegado. Probemos un fregadero en churn, lista NFT. O digamos, lo primero que haré es obtener el identificador URI del token. Es const, URL es igual a esperar subida a IPFS. Eséste. Además lo que haremos es esto. Entonces. Ahora haremos la autenticación. Es decir, el modelo de árbol web es igual a los nuevos modelos Web tres. Lo mismo. Subamos a ver dónde hemos hecho eso. Creo que lo hemos hecho aquí. Entonces conexión, luego tenemos proveedor, luego lo revisamos. Después firmamos transacción. Entonces tenemos el contrato de ese vestido. De acuerdo. Copia todo de la página de índice que es por, por nF diferente Jen. Pégalo aquí. Simplemente lo revisaré para asegurarme de que no hay nada malo. Sí. Sí. Dale capital. De acuerdo. Tenemos que modelar. Tenemos conexión. Nosotros hemos proporcionado, tenemos red. Estamos comprobando si el usuario está conectado o no. Entonces estamos consiguiendo al firmante. Entonces tenemos el contrato. Sí. Convierte puntos utils unidades de análisis de puntos. Aquí. Será la forma de entrada de punto precio. Mientras estoy de entrada dot price. Eso es todo. Entonces tenemos aquí la dirección del contrato, NFT marketplace dot aba y regístrate. Ahora. Además, vamos a conseguir ese precio de listado. Es decir, que el precio del listado es igual a esperar contrato punto obtener listado arroz. Entonces sólo lo cambiamos a cadena. Esta cosa precio punto dos cadena. Ahora vamos a hacer que la transacción se va a esperar contrato punto el nombre de la función fue crear token en nuestro contrato inteligente de solidez, acepta un token URI para hielo y tenemos que enviar ese valor de listado, que es el precio de listado. Valor, precio del listado, luego la tasa de transacción. Y por último, sólo navegaremos a ese usuario a la pantalla de inicio de esta manera. ¿De acuerdo? Ahora es el momento de que devolvamos HTML en la parte inferior. Retorno. Sentémonos con el DRF. Dale un nombre de clase. Negros. Simplemente desafía al centro. Entonces tienen LastName con uno por ocho patas, margen de llamada, ¿verdad? Margen. Los diez primeros. Sí. Mostraremos esa imagen. Es decir, una vez que el usuario lo cargue, lo mostraremos aquí antes de que se asegure antes que pueda comer el URI del archivo token. Si no está vacía, entonces muestra esta imagen. Utilizarás la imagen de la siguiente. Cuando le das margen redondeado, top four. Fuente será marcador de posición porque en este momento la URL del archivo está vacía. Mostraremos ese lugar. Así que dejemos imagen que tenemos en nuestra carpeta pública. Le daremos un peso de 300, altura de 200. Nuevamente. Escribiré si no está vacía, es decir, tiene algún valor. Después mostró esta imagen. La fuente será la URL del archivo, se cargará la imagen con éxito. Entonces tarifa será de 300, la altura será de 200. titular del arrendamiento se verá borroso y borroso. URL de datos será titular del lugar. Punto PNG tilda. Se carga la imagen. Mostrará un sangriento soporte de lugar para que el usuario sepa que algo está a punto de aparecer. De acuerdo, tenemos este div. Ahora. Siguiente div tendrá un nombre de clase de width, un Bye half, que es lex de la mitad derecha. Lex llamada. Tengamos un InputField. Tengamos un campo de entrada de cierre automático. Se establecerá el soporte del lugar. Nombre. Nombre de la clase será la gestión de borde superior, esquinas redondeadas mediante la adición de cuatro. Entonces sin cambios. Ahora bien, la cosa es que cuando algunos datos estén cambiando, tendremos esos datos aquí. Y vamos a actualizar estos. Aquí. Utilizaremos la entrada del formulario de actualización. Y actualizaremos la entrada del formulario. Y dentro de ella, sólo le agregaremos la entrada de Rudolf, ese nombre. Ese es el valor objetivo de e dot. Aquí así. Lo vamos a anexar. Y aquí serán tres estrellas que estos tres puntos así. ¿ De acuerdo? El segundo, tendremos un área de texto. Tendremos un área de texto para la descripción. Habrá descripción del activo. El apellido será margen, de arriba a borde, redondeado, ropa de cama redondeada para ropa de cama, para n aquí también. En cambio de propiedad, simplemente usaremos. Este campo de formulario de actualización. Entonces dentro de ella le añadiremos. En el formulario, la descripción de entrada es igual al valor objetivo de punto E. Así. Ahora aquí, vamos a copiar este campo de entrada. Pégalo abajo. Aquí el nombre del activo será como precio establecido en él. Y margen de arriba a abajo o acolchado para sin cambios es igual a. Aquí. Eso lo vamos a cambiar. Vamosa anexar precio. Aquí. Habrá otra propiedad llamada tipo y tipo será número. Por último, tenemos el campo de entrada para subir el archivo. Eso es el tipo de entrada es igual al nombre del archivo como nombre de la clase establecida. Vamos a tener este autocierre es siempre ClassName, será margen en el eje y para fin en cambio, llamaremos a la función de carga de imágenes. Por último, estamos utilizando esta función, subir imágenes. Obtendrá automáticamente la entrada que es el parámetro e de aquí. Entonces tendremos un botón. Si DOF, si hay URL de archivo. Y es que si hay URL de archivo, entonces sólo se mostró ese botón. El botón tendrá onclick, lo que activará la lista. Y si cadena diferente que está aquí, lista NFT para función de venta. Apellidos. Seremos fuente. Nace. Margen, cuatro primeros. Dorso alrededor de 506, blanco, cama redondeada para sombra en grande. Ahora, aquí, entre el botón, tenemos que escribir algún texto y lo cambiaré según los estudios. Si el estado de carga es igual a no cargar, entonces show create, NFT. Adultos muestran esperar, subiendo. De acuerdo, entonces ya terminamos. Vamos a guardar todo. Ir a nuestros sitios web. G cargado. Espero que el servidor esté funcionando. A ver. Ahora, si voy a vender NFT, mensaje de error debe hacer dos propiedades o propiedad de relleno sanitario. Eso es aquí, tenemos algún error. Debe usar propiedades de ancho y alto. Vamos a revisar. Vale, yo hice este error. Que ojalá no hayas hecho ese mismo error. Ya veo. Se ve tan bien. También. Tienes que hacer algunos cambios en nuestro siguiente archivo dot config dot aquí. Sólo para asegurarnos que tenemos, podemos mostrar imágenes que es ese dominio desde el que se mostrará la imagen en nuestra página web, que mencionar aquí que el nombre de dominio es gateway, piñata dotCloud, como sabemos. Porque aquí lo hemos mencionado. Ver puerta de entrada que piñata nube oscura aquí. Y si lo guardamos, entonces tenemos algunos cambios. Tenemos que reiniciar el servidor. ¿ De acuerdo? Simplemente lo cerraré, guardaré todo, iré a la NFT, CD blind y BM, entonces es hora de que probemos la subida de NFP. De acuerdo, solo carguemos localhost. Espero que las cosas funcionen. Vamos a dar clic en la celda. Escojamos un archivo. Simplemente escogeré esta imagen. A ver qué pasa. ver, ahora se está subiendo. A ver si se muestra aquí o no. Entonces sólo estaremos seguros de que sí, está funcionando. Ahora hagamos que algunos inspeccionen también. Tengamos en la consola. Vamos a piñata. A ver si hay algo subido aquí. Sí. Ver banner de marketplace, Ahora está subido aquí. Está tomando demasiado tiempo, pero a ver, Vamos a escribirlo. Mi primer NFT, NFT futuro de internet. Entonces sería 0.1. Asegurémonos de que estamos conectados con el objetivo en red. Sí. Demos clic en Crear NFT. Mira, espera subiendo. Tenemos que anotar misa que viene. A ver si lo es si va a funcionar o no. Y damos clic en Confirmar. Entonces después de que se complete la transacción, seremos redirigidos, supongo. Sí. Después de la transacción , A ver. Añadimos redireccionado. Y veamos ahora se mostrará aquí o no. No se está mostrando. Pero veamos, tenemos los metadatos subidos porque podría haber algún error, tenemos que corregirlo. Los metadatos también son hinchados. Vamos a inspeccionar. Entonces veamos por qué no está funcionando. Obviamente, hay algunos datos y lo que no se está mostrando porque llevo a nosotros ningún artículo en el marketplace. Vamos a la consola de puntos de registro de elementos. Longitud de punto c, uno. Tenemos un artículo. De acuerdo, no tengo, no, no, no. A ver. No artículos, tenemos dy set que NFT es nodo D. Así que cogí un error. primer error está aquí en esta línea que no es grandes llaves rizadas. Deberían ser corchetes redondos como este. ¿ De acuerdo? Y cuando lo guardemos, entonces de nuevo, obtendremos algún error. Y esto es porque aquí cometí un error. Debe ser nombre. Y entonces debería haber otro campo de imagen. Será metta dot imagen Theta dot. A ver si está funcionando o no. Ahora, salve todo n Sí. Nuevamente, solo estoy teniendo este tema por el que la imagen no se muestra literal, por lo que no se mostró. A ver, ¿tenemos también algunos otros errores? A ver, la imagen. La imagen D se carga correctamente. El URI de la imagen está aquí. Enlo más alto. Ver este. Has creado puerta de enlace. Puerta de enlace. Esa piñata dotCloud gateway dot, dot, dot cloud slash, IPFS, lash hash. Entonces, ¿por qué no está funcionando? Oh no, no. ver, tardó algún tiempo, pero funcionó. Obviamente, lleva algún tiempo cargar el escritorio de imágenes. Es por ello que mostramos ese efecto de la sangre. Pero finalmente, nuestro mercado está funcionando. Podemos vender. Y si D, así como mostrará todos los no vendidos y FTE en la pantalla de inicio. Eso es todo por este video. Este fue un video muy largo. Lo sé, pero hemos cumplido la mayor parte de esa tarea. Gracias. 23. Video 22 Función para conseguir que los NFT sean propiedad o comprados: Hola, bienvenidos de nuevo. En este video, trabajaremos bajo mi pantalla NFT, cual mostrará sólo el NFP es comprado por el usuario. Por lo que también antes de eso disparé, vi algunos añadidos. Supongamos en este archivo index.js, en esta cuarta línea, que W era pequeña, debería ser capital. Y también en eso crean NFT. Esta primera línea tuvo algún problema. Es decir, había así. Esto debe ser eliminado. De acuerdo. Ahora, ahora páginas en profundidad, vamos, vamos a crear una nueva pantalla. Íntimo mis zurdos dot js. Aquí. Nuevamente, crearemos una función que devolverá sólo la NFT es propiedad. Pero antes de eso, tenemos que importar parte de la dependencia o algunos de los paquetes. Simplemente copiaré de ese crear NFT aquí así. Y, y hacer los cambios. Supongamos que aquí se necesita usar estado efectivo, se necesita, se necesita usar enrutador. necesita un modelo de árbol web. Aquí no se necesita piñata y llave secreta. Sólo la dirección del contrato, luego el mercado NFT, luego XES, y la siguiente imagen. Ahora vamos a exportar función, exportar por defecto, perforando mis FTEs. Nuevamente aquí. Vamos a necesitar esta cosa que es NFP es y estado de carga. Entonces desde los índices cópialo y pega aquí así. Tendremos días de PFN y establecemos una prueba F. Entonces tenemos estados de carga, establecer estado de carga, el primer estado no se cargará. También. Si queremos, podemos tener eso por ahí también. Eso es uso. Ahora comencemos a escribir la función sinc funtion load. Y si estas, ahora, otra vez, tendré algunas. Es decir tenemos que autenticar al usuario lo mismo de ese crear. Sí, solo copiaré modelo de árbol web, conexión, obtendré red, luego contrataré. Así. Sólo lo copiaré y pegaré aquí. Y revisa de nuevo. Tenemos que modelar, tenemos conexión, hemos proporcionado tenemos buena red. Verificaremos si está conectado. Podríamos conseguir al firmante. Simplemente lo pondré un nombre. Contrato de plaza de mercado. De acuerdo. Enviamos un vestido contratado. Tenemos el mercado NFT, EBI, tenemos el firmante. Ahora, vamos a conseguir los datos. Evadir contrato de mercado punto partido. Mi NFT es así. Después se buscará a través de los datos. Es artículos es igual a esperar punto, punto, punto, mapa, sumidero. Añado. Después agregamos mapeo a través de todos y cada uno de los datos. Y estamos almacenando esos datos que datos singulares en este nombre de variable, el nombre es I. Vamos a obtener el identificador URI de token es igual al URI de token de contrato de mercado. Y sólo escribiremos, puedo identificarme así. Entonces. Const metta es igual a wait. Empieza a conseguir. ¿ Se puede agregar un identificador URI de token? Obtendremos todos esos datos. Entonces deja res igual a comedores punto, unidad de formato de punto punto punto punto arroz dos cadena. Ahora vamos a crear los elementos del objeto. Artículo. Nombramos el precio. Tendremos ese ID, número de identificación del token. Entonces Sattler. Sattler. Oh no. Yo punto 09. Metadatos de imagen, datos, nombre de imagen, datos de punto, nombre de punto. Y finalmente token URI. Y entonces simplemente devolveremos el artículo para que se convierta en un n, un n a de estudios de ítem aquí. Después de eso simplemente al final de este mapeo. Simplemente establece si estos artículos y establece el estado de carga en cargado, así. Después de esta función. Devolvamos también el HTML. Tendremos este mismo estado de carga y ahora veamos qué página tiene esa haciendo esta. Así. Sí, copy and Based incluyendo estado no se carga que simplemente mostrar carga de peso. Si está cargado y NFT es longitud de punto no está ahí, entonces simplemente escriba, no, no, NFT es propiedad de u, así. Y luego regresar. Y luego simplemente regresar. Y aquí. También vamos a devolver esta cosa. Hagamos lo mismo que index.js. Así que simplemente copia esto. Puedes copiar todo esto y luego hacer esos cambios en consecuencia. A ver. Copiarlo. Devuélvala aquí. Ahora. A ver si necesitamos algún cambio aquí. Pixel para estilo max-width 1600 pixel, luego rejilla columna uno, columna dos, genial. Entonces tenemos una f, d es mapa de puntos, clave, borde, sombra, Excel, desbordamiento oculto, desbordamiento oculto. Tengamos margen. Esto y margina el eje y. Vamos a tener esto. Tenemos la imagen alt nombre del punto NFT. Espera, cuatrocientos, trescientos marcador de posición desenfoque. Y estará en caja fuerte. De acuerdo. Entonces tenemos difusión para la altura de etiqueta de párrafo nombre de la clase de 64 píxeles. Para sobresalir fuentes semi negrita. Y si el nombre, tenemos el nombre de NFT. Pero aquí no necesitamos la descripción de NFT en esta pantalla porque ya la poseemos. No necesitamos tener tantos datos. Simplemente borra esto. ¿ De acuerdo? Entonces tenemos ClassName this, padding para fondo negro, párrafo, texto, Excel. Y antes de una encuesta tasa de impuesto y si el precio. Y finalmente tenemos un botón, BG, sólo lo daré Leer. Texto blanco, fuente, negrita. Mediante la adición de y, mediante la adición de eje x rodeado onclick. ¿ Verdad? Ahora no tendrá nada. Simplemente será nulo. Y lo llamaremos ricina y FT así. Eso es todo. Esos fueron los únicos cambios que se requerían. Vamos a guardarlo. Vamos a ver. Es la pantalla de inicio. Y ve a mi NFT dot fetch. Mi PFN es. De acuerdo. A ver ¿Qué fue eso añadido? Y si es de propiedad, está mostrando que esto no lo es. Vayamos a un mercado. Ver buscar, mi NFT es que tenemos esto. ¿ Por qué está diciendo esto ahora? Están diciendo contrato de mercado. C. De acuerdo. No sé qué fue el editor, pero sal. ¿ Qué fue el editor? Espero si te sale el mismo error, solo copia y pega o creo que todo fue igual. Pero no tenía FT. Y si son de tu propiedad porque hemos creado la NFT, pero aún no hemos comprado ninguna NFT. Por lo que más adelante compraremos y probaremos todo. Y ahora mismo solo quería mostrarles que esta pantalla es que si más adelante, si no hay ninguna edición, sólo vamos a resolver eso también. En el siguiente video. Trabajaré en este tipo de pantalla de este tablero de instrumentos. Gracias. 24. Video 23 Función para conseguir que los NFTS enumerados en el mercado: Hola. La siguiente página que estaremos creando es el un dashboard que permitirá a los usuarios ver todos los artículos que han enumerado en ese marketplace. Esta página estará utilizando la función fetch items listed del contrato de mercado de NFT, que devuelve sólo los artículos que coinciden con la dirección del usuario que realiza la llamada a la función. Vamos a crear un nuevo archivo dentro de páginas y ponerle un nombre. Sillas de tablero de instrumentos. Esta pantalla será similar a la pantalla NFT. Entonces copiemos toda la pantalla. Y haremos esos cambios en consecuencia. Por lo que al desnoviarlo primero, necesitaremos estas importaciones. Te quedaste una tortuga, usa enrutador, web para modelar dirección de contrato, mercado NFT y todo. De acuerdo, Entonces solo cambiaremos el nombre de la función a tablero de tablero creador. ¿ De acuerdo? Entonces tenemos estos. Y si D es incierto, si estos, y creo que no requerimos ese exterior. Veamos un anterior también, no requerimos que al aire libre. Si vamos a requerir sólo importarlo de nuevo. Hemos creado y estado de carga. Luego use efecto, luego carga N de t está bien. Entonces en su carga y f t, Tenemos el modelo de árbol web, luego conexión, luego ese proveedor. Después revisaremos la red Golgi. Entonces tenemos al firmante. Entonces hemos hecho instancia de contrato de marketplace. Entonces llamaremos a esta función. Eso es del contrato, llamará a los artículos de cuña que figuran. Y lo llamaremos aquí. ¿ De acuerdo? Entonces tenemos los artículos prometen todo y lo mismo. Luego token URI, luego hizo METAR que precio. Después hacemos un artículo con precio al vendedor Kennedy, propietario, imagen, nombre y token URI. Entonces lo devolvemos. Despuésestablecemos los términos dy, establecemos el estado de carga. Después devolvemos el HTML así. Si no está cargado, si está cargado, entonces simplemente llene la carga de peso. Si está cargado y no hay NFT, entonces veremos que no aparece NFT por ti. De acuerdo, sólo cambia ese texto. Entonces. Al final, volveremos a tener un flex de estructura en columna justificado entonces para la columna de cuadrícula de 1600 píxeles. Entonces NFP, este mapa. Ahora vamos a revisar aquí. Sombra de borde, luego fuente de imagen e imagen de punto f d con 400 diseño de marcador de posición menos sensible. Entonces tenemos el nombre de NFT. Entonces tenemos ese botón en que muestra el precio de la NFT. Entonces tenemos este botón el cual escribirá, cual mostraremos puede vender listado como su texto. Es decir, el botón habrá cancelado listado. Si lo desea, puede cambiar ese color. Depende de ti. Prefiero que se lea, está bien. Eso es todo. Esa es la pantalla que se necesita. Ahora, vamos a guardarlo. Y vayamos a comprobarlo. Acabo de empezar. Daré clic en salpicadero. Ahora. Mira, hemos enumerado esto bajo marketplace y eso es lo que ahora se muestra. Con esto tranquilizó que la funcionalidad está funcionando. En el siguiente video, trabajaremos en la funcionalidad para cancelar este listado del marketplace. Gracias. 25. Video 24 Función para cancelar y revender NFT: Bienvenido al último video de este módulo donde trabajaremos en la funcionalidad para cancelar así como revender NFT en ese mercado. Hasta el momento, se puede decir listado, ir a crear un dashboard y debajo de esta carga de carga función NiFTi. Vamos a crear, vamos a crear una nueva función y nombrar, nombrelo. Listado de alféizar. Aquí sólo tenemos que enviar ese token ID. Entonces lo primero que haré es establecer el estado de carga. Nuevamente, no cargado. Entonces voy a conseguir, conseguir esas cosas otra vez. Ese es el proveedor de modelo de árbol web, estos tres código. Y después de eso, conseguiré al firmante. Así. También sé que se está repitiendo el código. Si lo deseas, solo puedes hacer una función separada de ella para que pueda ser reutilizable. Pero aquí solo nos estamos enfocando en la funcionalidad. Puedes borrar el código más adelante. Ahora. Después de eso, tendré una transacción que es Mark, contract, dot, cancel. Revisemos el nombre. Se puede vender listado de artículos. Se puede vender listado de artículos. Y tenemos que enviar un token ID. Entonces tendremos transacción de peso. Esperaremos hasta que se haga la transacción. Esta. Y por último, llamaremos a la carga y si d función aquí. Entonces esto es que en hoja y género requerían cancelar NFT. Es muy sencillo. Ahora voy a llamar a esta función aquí el OnClick. Envía ese token que este ID de token NFT, así. Del mismo modo funcionalidad a la reventa de nuestro token, tenemos que ir a mis zurdos aquí debajo de esa carga y f t. vamos a crear la función sinc. Función. Revenda el ID de token de NFT, precio del token. Establecemos el estado de carga en no cargado. Entonces tendremos este, este código que es Web tres modelo aquí. El mercado. Sólo pega aquí. Proveedor y mercado de conexión de tomate. Entonces simplemente convertiremos el precio a comedores dot util, dot virus units. Entonces, ¿puede el precio entonces liderar el precio del listado? Porque aquí otra vez, estamos realmente apestosos, así que tenemos que pagarlo. Esperen. Contrato de mercado dot get listing, precio. El precio del anuncio es igual al precio del anuncio punto a cadena. Lo mismo que hemos hecho antes también. Ahora vamos a hacer que la transacción es igual a esperar el nombre del punto del contrato del mercado. Bajo contrato solo puedes revisarlo, revender token, acepta ID de token y precio. Puede idea, así como elogio token ID y precio. Y tenemos que enviar el valor del precio del listado. Entonces esperaremos Dan sección punto peso. Y de nuevo, sólo vamos a refrescar que NFP está utilizando esta función. Aquí. Al final, volverá a enviar ese estado de carga baja para cargarlo. Por eso no lo he hecho aquí. Porque hemos cambiado el estado. Pero en esta carga y volverá a cambiar el estado para cargarlo. A continuación, simplemente vaya al botón en la funcionalidad de clic. Simplemente asígnelo. Enviar NFT token ID, NFT, ese precio. Eso es todo. Eso es todo por la función de token de ventas. Espero que hayas aprendido mucho porque hace tarea Alda o funcionalidades más antiguas. Hemos completado nuestro mercado de NFT. En el siguiente video, simplemente probaremos toda la aplicación para que si queda algún editor, lo resolvamos lo antes posible. 26. Video 25 Pon a prueba la aplicación completa: Hola, bienvenidos de nuevo. En este video, solo probaremos todo el funcionamiento de la aplicación. Finalmente hemos completado el mercado de NFT y agregando que debe estar orgulloso de usted mismo de haber visto el curso hasta el final. Ahora, solo revisemos la venta de NFT. Vamos, vamos a subir algo más de rendija NFT que sea dura IF casco. Y si sólo nombrarán en ed superior compilar, probar y desplegar. Mismo, lo colocaré 0.001. A ver. Vamos a elegirlo. A ver. Era una imagen grande, pero aún así, digamos que se está subiendo. Supongo. Si quieres, solo iré a comprobarlo aquí para asegurarme de que esté cargado correctamente. Mira como ese punto PNG. Simplemente haga clic en Crear NFT. Vamos, vamos a confirmar. A ver. De acuerdo, supongo que ya está hecho. Diga Crear Token. Ya está hecho. ¿ Y hay algún tema que tenga que entender? ¿ Qué es esto? Creo que tenemos que hacer algún control de acceso y null, pero si sólo lo refrescamos, se está mostrando norma control de acceso permitir cabecera origen está presente bajo recurso solicitado. Qué y eso si lo refresco, espero que también se suban los metadatos. ver, tenemos esta NFT j sine Phi, pero esto no está funcionando. Si voy al salpicadero, entonces también está mostrando alguna sumadora. Si le doy click. De acuerdo, déjame buscar, déjame revisar cuál es el tema y llegar a esta solución. Por lo que reviso de nuevo, y está funcionando correctamente. Antes, estaba tomando demasiado tiempo y creo que esta imagen era realmente grande. Por lo que si estás subiendo una imagen, asegúrate de optimizarla. Porque a ver, solo mostrarte la diferencia. Y también subí una imagen más. Aquí. Se puede ver que es sólo 60 KB, pero este es uno y b. entonces hay mucha diferencia en el tamaño de la imagen. Y además, si digo, si sólo lo refresco, me limitaré a guardar todo aquí. Porque podrías estar viendo este tipo de salida. Para resolverlo, simplemente hay que usar esta configuración que es margen en exceso de eje x y eje y cinco en el index.js. Y sólo guárdalo aquí. Ahora se puede ver que hay un hueco adecuado. El celular NFT está funcionando como se puede ver. Ahora lo que voy a hacer es si puedo vender un listado que es este. Supongamos que si quiero considerarlo, entonces simplemente haré clic en cancelar listado. Ese MetaMask se abrirá. Simplemente confirmaré esta transacción. Y como ustedes saben, cuando podemos vender nuestro propio listado, él, nos cuesta es decir, demostrará que somos dueños de esa NFT y se mostrará en mi tablero de NFT. Aquí, no estás viendo en el hogar. Vamos, A ver los otros tres o dos. Y si este CDMA dos nf, esto, aquel primero se canceló. Pero si voy a mi NFT, entonces pueden ver que esta es la NFT, podemos venderla. Acaba de ser propiedad, son compradas por mí. Se puede decir que quiero así que no diré comprado porque no he pagado esto, pero al menos volvió a mi cuenta. Eso se puede vender. Nft también está trabajando. De acuerdo. Ahora a revisar el revendedor y fd, Vayamos a revender. Haga clic en reventa NFT. A veces podrías tener algunos problemas si no tienes los éteres requeridos en tu cartera. En que en ese tiempo hay que esperar y obtener la aprobación. 15 o 20, ocho tercios en tu ícono del grifo. Digamos que sigue cargando. Pero espero que esto funcione. Digamos que a ver es doblar revender ficha. Porque aquí estamos haciendo muchas cosas porque estamos de nuevo, siendo un aliado. Pero mira, ningún NFT es de tu propiedad. Si voy a Home, volvemos a ver que aquí apareció NFT. Por lo que tenemos en contra de sólidos. Si quieres, puedes hacer los cambios de configurar el precio y no lo he hecho. Es realmente fácil. Puede ser un proyecto para ti si quieres. Ahora, la única funcionalidad que queda es por, lo que haré es cambiar mi cuenta de cuenta a cuenta uno. Pero tiene muy menos éteres, así que solo estoy confundido. Tiene 0 esto. Entonces lo que puedo hacer es conseguir, transferir alguna cuenta ya que transfiero algunos éteres aquí en ido a uno. Y sólo transferimos es 0 o c no es que 0.01 es 0.04. Confirmar descendente. Porque debes tener suficiente sabor a comprar. Y a veces se nota a una, por eso este envío también está tomando demasiado tiempo. De acuerdo. Pasemos a la Cuenta uno. Después de cambiar la economía, vamos a refrescarla. Ahora, un nuevo usuario o imprime en su tablero de instrumentos. Supongamos que C, él puede ver no vendido nf esto, pero si vas al tablero, verás que no aparece NFT por u y n es mío FTEs porque este usuario tiene una nueva cuenta. Pero si vas a comprar estos en menos NFT, digamos que está funcionando o no. La última vez conseguí el editor de fondo insuficiente. A ver qué pasa esta vez. Digamos que si quieres puedes. Por lo que algún indicador de carga aquí. A ver. Está gastando su gasto. Recibir, ver, esto es ahora esto no aparece en el mercado. Si voy a mis LFT, entonces veo que tengo este NFT poseído. Esto también está funcionando bien pero no hay problema que puedas en contra de vender. Por lo que finalmente, nuestro mercado está terminado. Todas las funcionalidades están funcionando a la perfección. Si lo deseas, puedes subir este sitio web al servidor real también, igual que Netlify, estamos vendiendo. De forma gratuita. Simplemente puedes buscar en Google cómo hacerlo, y luego mostrárselo a los reclutadores están en tu CV que has creado una aplicación descentralizada completa. Gracias por ver. Espero que hayan disfrutado. Asegúrate de ver mis otros cursos también. Que tengas un buen día.