Construye dApps de Blockchain usando JavaScript

Rate this content
Bookmark

¿Hemos encontrado el nirvana para los desarrolladores de Blockchain? Esta masterclass se centrará en construir dApps (aplicaciones distribuidas) de blockchain con un conjunto de código fuente y desplegarlo en múltiples blockchains. La sesión cubrirá cómo empezar con Reach y ser capaz de desplegar la misma solución en múltiples blockchains, incluyendo Algorand, Ethereum y Conflux. ¿Eres nuevo en Reach? Cubriremos cómo configurar tu entorno de desarrollo y también recorreremos una aplicación simple de frontend y backend. Por último, veremos uno de los enormes beneficios de Reach en el proceso de verificación incorporado. Reach proporciona verificaciones automáticas para asegurar que tu programa no pierda, bloquee o gaste en exceso fondos, y garantiza que tus aplicaciones estén libres de esta categoría completa de errores.

21 min
20 Jun, 2022

Video Summary and Transcription

Hola, mi nombre es Russ Fustino, y bienvenidos a Construye dApps de Blockchain usando JavaScript. Cubriremos la blockchain de Algorand, la capa uno, configuración de tu entorno de desarrollo, creación de una dApp simple, verificación y controles de UI desde pipeline. Las herramientas de blockchain ahora están al alcance de cualquiera para crear agrupaciones de liquidez, staking y más. La Sociedad Italiana de Autores y Editores está utilizando NFTs en la blockchain de Algorand para identificar derechos de autor. Las cuentas de Algorand, ASAs, Transacciones Atómicas, Contratos Inteligentes de Algorand e informes con Indexer son parte de la solución. La creación de NFTs se puede hacer utilizando herramientas visuales como Algodesk.io y billeteras como Algosigner y MyAlgoWallet. Las transferencias atómicas de Algorand garantizan el intercambio de bienes y facilitan aplicaciones descentralizadas. Las firmas inteligentes aprueban transacciones de gasto y los contratos inteligentes facilitan el almacenamiento global y local. La arquitectura de la dApp incluye una interfaz de usuario (UI) en el frontend, transacciones de pago entre cuentas, transacciones de activos para NFTs y Tokens Fungibles, y llamadas de aplicación para contratos inteligentes. Varios SDKs y herramientas están disponibles, como AlgoDesk.io, Algorand Studio y Algodia. Reach es un lenguaje de alto nivel y un compilador para desplegar dApps en la blockchain. La verificación y las auditorías juegan un papel crucial en la prevención de tokens bloqueados. La interfaz de usuario de Pipeline ofrece controles y componentes para una integración fácil en soluciones.

Available in English

1. Introduction to Algorand Blockchain and DApps

Short description:

Hola, mi nombre es Russ Fustino, y bienvenidos a Construir DApps de Blockchain utilizando JavaScript. Cubriremos la blockchain de Algorand, la capa uno, configuración de tu entorno de desarrollo, creación de una DApp simple, verificación y controles de UI desde pipeline. Las herramientas de blockchain ahora están al alcance de cualquier persona para crear agrupaciones de liquidez, staking y más. La Sociedad Italiana de Autores y Editores está utilizando NFTs en la blockchain de Algorand para identificar derechos de autor. Las cuentas de Algorand, ASAs, Transacciones Atómicas, Contratos Inteligentes de Algorand e informes con Indexer son parte de la solución. La creación de NFTs se puede hacer utilizando herramientas visuales como Algodesk.io y billeteras como Algosigner y MyAlgoWallet. Las transferencias atómicas de Algorand garantizan el intercambio de bienes y facilitan aplicaciones descentralizadas. Las firmas inteligentes aprueban transacciones de gasto y los contratos inteligentes facilitan el almacenamiento global y local. La arquitectura de la DApp incluye una interfaz de usuario (UI) en el front-end, transacciones de pago entre cuentas, transacciones de activos para NFTs y Tokens Fungibles, y llamadas de aplicación para contratos inteligentes. Varios SDKs y herramientas están disponibles, como AlgoDesk.io, Algorand Studio y Algodia. Reach es un lenguaje de alto nivel y compilador para implementar DApps en la blockchain. La verificación y auditorías juegan un papel crucial en la prevención de tokens bloqueados. La interfaz de usuario de Pipeline ofrece controles y componentes para una integración fácil en soluciones.

Hola, mi nombre es Russ Fustino, y bienvenidos a Construir DApps de Blockchain utilizando JavaScript. Soy un defensor del desarrollo para Algorand.

Entonces, los desarrolladores de blockchain necesitan saber, en primer lugar, ¿qué es una DApp? ¿Y cómo puedo construir una? Además, ¿qué tipo de soluciones puedo construir? Sé que cuando comencé a hacer desarrollo de blockchain, esa fue una pregunta que estaba en mi mente, ¿qué tipo de soluciones puedo construir? ¿Y qué lenguajes de programación puedo usar para construir DApps? ¿Y cómo verifico los contratos inteligentes, en otras palabras, auditorías?

Entonces, la agenda para hoy, vamos a cubrir la blockchain de Algorand, la capa uno. Haremos un poco sobre la configuración de tu entorno de desarrollo y luego crearemos una DApp simple, que por cierto, significa aplicaciones descentralizadas. Y cubriremos la verificación, así como algunos controles de UI desde pipeline.

Para aquellos que son nuevos en blockchain, lo que es blockchain, es un libro mayor mutable y descentralizado que consiste en bloques, que son períodos de tiempo. Y luego las transacciones que están asociadas durante ese intervalo de tiempo. Ahora, por supuesto, las transacciones son entre un remitente y un receptor. Así que esos serían tus cuentas. Y cada cuenta tiene la asociación de activos, así como aplicaciones. Ahora, los activos pueden ser tus tokens fungibles o no fungibles, y las aplicaciones son contratos inteligentes. Con Algorand, utilizamos un protocolo de prueba de participación puro. El protocolo de prueba de participación puro es extremadamente rápido y realmente escala. Se mantiene en 1400 transacciones por segundo y los tiempos de bloque se crean en menos de 5 segundos. Pero no solo eso, hay una longevidad de infraestructura. Todo el proyecto es de código abierto, y hay mucha flexibilidad técnica con todo tipo de SDKs y herramientas que se están creando y están disponibles para que los desarrolladores construyan soluciones de blockchain. Certeza de transacción, no hay bifurcaciones en la blockchain de Algorand. Plataforma muy extensible y extremadamente eficiente en energía. En realidad, es una blockchain con huella de carbono negativa. Eficiencia de costos, el costo de una transacción es inferior a 1/120 de un centavo. También proporciona seguridad real, porque es un libro mayor de solo lectura y escritura única que está distribuido en todo el mundo. DeFi es, con mucho, el mayor tipo de solución de mercado vertical que se puede construir con la blockchain de Algorand. Stablecoins. Entonces, ¿qué son las stablecoins? Todavía son criptomonedas, pero están vinculadas a la economía de Estados Unidos. A medida que el dólar estadounidense sube y baja, también lo hará la moneda. Por lo tanto, fluctúa de la misma manera que lo hace el dólar. Así que hay más de 3 mil millones en circulación allí para USDC. Y tenemos intercambios descentralizados o DEXs. Cosas como Tinyman, Elgodex, ElgoFi. Lo que ha sucedido aquí es que, hasta ahora, tenías que ir a un banco para usar herramientas financieras.

2. Herramientas de Blockchain y NFTs para Derechos de Autor

Short description:

Las herramientas de blockchain ahora están al alcance de cualquier persona para crear agrupaciones de liquidez, staking y más. La Sociedad Italiana de Autores y Editores está utilizando NFTs en la blockchain de Algorand para identificar derechos de autor. Esto abre nuevas posibilidades para el acceso global y casos de uso en varios mercados verticales.

Por ejemplo, digamos que quieres crear una cartera de acciones. Bueno, ahora estas mismas herramientas están disponibles para cualquier persona que quiera usarlas. Y puedes ir a sitios como estos, y aplicaciones como estas, para poder crear agrupaciones de liquidez y staking, y muchas otras cosas.

La Sociedad Italiana de Autores y Editores, otra gran implementación de blockchain. Están utilizando NFTs para identificar derechos de autor. Entonces, los NFTs son únicos, y puedes ver aquí que han puesto más de 4 millones de NFTs en la blockchain de Algorand para casi 100,000 creadores. Realmente, este es el futuro de la industria para hacer derechos de autor, porque piensa en ello, no hay fronteras globales. Esto es, y está al alcance de cualquier persona que quiera tener acceso a ello. Y otros casos de uso, ya sabes, la lista continúa aquí, ¿verdad? Muchos mercados verticales diferentes, prácticamente todos los mercados verticales que realmente tienen un caso de uso para una blockchain.

3. Cuentas de Algorand, ASAs y NFTs

Short description:

La capa 1 de tu solución incluye cuentas de Algorand, ASAs, Transacciones Atómicas, Contratos Inteligentes de Algorand e informes con Indexer. Los tokens fungibles, como las monedas estables y los puntos de lealtad, tienen unidades de igual valor. Los tokens no fungibles (NFTs) son objetos de colección únicos utilizados para artículos de juegos, bienes raíces, identidad, certificación y más. La creación de NFTs se puede realizar utilizando herramientas visuales como Algodesk.io y billeteras como Algosigner y MyAlgoWallet.

Pasemos a la siguiente sección, que es el corazón y alma de tu solución, la capa 1. Las cuentas de Algorand, ASAs o Algorand Standard Assets, Transacciones Atómicas, Contratos Inteligentes de Algorand y los informes con Indexer. Primero, tienes una cuenta estándar, que representa a un individuo, por ejemplo. También tienes una cuenta multisig, que podría representar, por ejemplo, a una junta directiva. Con una cuenta multisig, tienes la capacidad de definir un umbral, es decir, cuántos votos necesitas del grupo para aprobar o firmar la transacción. Luego, una logicsig o cuenta lógica es un contrato inteligente que devuelve verdadero o falso. Si devuelve verdadero, firmará la transacción; si devuelve falso, no lo hará.

Ahora hablaremos de los tokens fungibles y qué son exactamente. Los ASAs o Algorand Standard Assets pueden ser tokens fungibles o no fungibles. Aquí vemos una lista de ejemplos de tokens fungibles, como monedas estables, puntos de lealtad y crédito del sistema. Cada unidad de la criptomoneda tiene exactamente el mismo valor y puede haber varias de ellas. Por otro lado, en cuanto a los tokens no fungibles, se pueden utilizar para artículos de juegos, bienes raíces, identidad, certificación y objetos de colección. La mejor manera de pensar en los NFTs es que son como objetos de colección. Son únicos y uno de una clase. Algunas personas coleccionan tarjetas de béisbol o monedas, por ejemplo. Cada uno de ellos está en una condición diferente, tiene una rareza diferente y diferentes características. Todos estos son metadatos que se pueden utilizar para diferenciarlos. Son todos muy, muy únicos.

Echemos un vistazo a cómo crear uno de estos. Voy a abrir Algodesk.io, que es una herramienta visual. Vamos a utilizar una de nuestras tres billeteras disponibles aquí. Tenemos Algosigner, que es un complemento para Chrome, y MyAlgoWallet, que es una billetera basada en la web.

4. Creación de ASAs y Transferencias Atómicas de Algorand

Short description:

PairWallet es una billetera basada en Android o IRS. Utilizaremos Algosigner para la demostración y seleccionaremos una cuenta para crear activos. Crearemos un ASA llamado pizza, un token fungible con un suministro de 100,000. Las transferencias atómicas de Algorand garantizan el intercambio de bienes y facilitan las aplicaciones descentralizadas. Los Contratos Inteligentes utilizan Teal, un lenguaje ensamblador, y se pueden generar utilizando Python y JavaScript.

Y luego, PairWallet es una billetera basada en Android o IRS. Vamos a utilizar Algosigner aquí para la demostración. Vamos a iniciar sesión en nuestra billetera y voy a seleccionar una cuenta que está en nuestra para utilizarla y crear estos activos.

Entonces, lo que vamos a hacer ahora es crear un ASA. Tenemos la capacidad de crear un nombre de prueba. Vamos a darle el nombre de pizza. Después de la primera transacción en Bitcoin fue para pizza. Ahora, si hago un suministro de uno, eso sería un NFT. Así que lo que voy a hacer es crear un token fungible. Vamos a crear 100,000 de estos. También tenemos la capacidad de poner un punto decimal allí. También tenemos la capacidad de poner una URL que podría estar asociada con esto, más información y también un meta sombrero.

A continuación, hablemos de las transferencias atómicas de Algorand. Aquí es donde todo debe tener éxito o todo fallará. Tienes una persona A, por ejemplo, que quiere enviar 50 Algos a la persona B. Y luego, la persona B, a cambio, enviará una entrada de concierto a la persona A. Cuando solíamos hacer esto a través de cosas como Craigslist o algo así, siempre era una lotería si esto realmente iba a funcionar o no. A veces pagabas el dinero, pero no recibías la entrada. Aquí, las transferencias atómicas garantizan el intercambio de bienes. Y esto realmente facilita y es el ingrediente secreto para muchas soluciones que se construyen con aplicaciones descentralizadas. Muy fácil de hacer y es seguro. Algunos ejemplos de esto serían liquidaciones simplificadas aceleradas, operaciones circulares, pagos grupales, liquidación instantánea para transacciones de activos multiparte complejas, pagos distribuidos. Y nuevamente, estos se pueden utilizar con todas las demás características de la Capa 1 de Algorand, como los activos estándar y los Contratos Inteligentes.

Hablando de eso, Contratos Inteligentes. Este es el lenguaje de aprobación de ejecución de transacciones, es el lenguaje ensamblador que se utiliza. El nombre corto para eso es Teal. Y es ensamblador porque es muy eficiente y tiene que funcionar en la cadena de bloques y ser muy, muy escalable. No hay nada más eficiente que el ensamblador para hacer eso. Y luego tienes un compilador habilitado para Python, que puedes usar Python para generar Teal y también se utiliza JavaScript en un producto llamado Rea. Y también hay una nueva extensión de Visual Studio que utiliza C sharp para crear Teal.

5. Smart Signatures, Contracts, and DApp Architecture

Short description:

Las firmas inteligentes aprueban transacciones de gasto y los contratos inteligentes facilitan el almacenamiento global y local. La arquitectura de la DApp incluye una interfaz de usuario (UI) en el front-end, transacciones de pago entre cuentas, transacciones de activos para NFT y tokens fungibles, y llamadas de aplicación para contratos inteligentes. El índice es una base de datos Postgres SQL que descarga el proceso Algod y sirve como una herramienta de informes.

Estos son básicamente generadores de Teal. Cada uno de estos productos que acabo de mencionar y más están en camino. Las firmas inteligentes básicamente aprueban transacciones de gasto y luego los propios contratos inteligentes proporcionan las transacciones y facilitan tanto el almacenamiento global como el local. El almacenamiento local estaría a nivel de cuenta y el almacenamiento global estaría a nivel de blockchain. Todos estos se pueden combinar con otras tecnologías de Algorand incluyendo transferencias atómicas y activos de algoritmo.

Entonces, para resumir la arquitectura de la DApp, básicamente tienes una interfaz de usuario (UI) en el front-end, tal vez haya algunas firmas inteligentes sucediendo allí utilizando los SDK o API REST de Algorand. Y luego tienes tres tipos diferentes de transacciones que se muestran aquí. Tienes una transacción de pago que sería entre tus cuentas. Las transacciones de activos girarían en torno a NFT y tokens fungibles. Y luego las llamadas de aplicación serían tus contratos inteligentes y estos facilitarían el estado local y el estado global en la blockchain. Entonces, el índice es básicamente una base de datos Postgres SQL que descarga el proceso Algod. Y luego se indexa y se puede buscar y es mucho más rápido y receptivo. Así que es realmente una buena herramienta de informes.

6. Setup Development Environment and Tools

Short description:

A continuación, cubriremos la configuración del entorno de desarrollo, incluyendo el portal del desarrollador, Algorand Discord, sandbox y la red privada de Vultr. Hay varios SDK y herramientas disponibles, como AlgoDesk.io, Algorand Studio y Algodia. Exploraremos PyTL y el proceso de compilación de código Python. En JavaScript, instalaremos el sandbox y el SDK, seguiremos la guía paso a paso y crearemos cuentas. Por último, presentaremos Reach, un lenguaje de alto nivel y un compilador para implementar DApps en la blockchain.

Ok, a continuación vamos a cubrir la configuración del entorno de desarrollo y lo que implica. Lo primero que debes hacer es acceder al portal del desarrollador, developer.algorand.org, un portal galardonado para desarrolladores en el espacio de la blockchain. También está Algorand Discord, donde puedes registrarte y obtener un excelente soporte para responder tus preguntas. También hay un servidor de Discord para Reach. Ambos están aquí también. Lo primero que quiero hacer es cargar el sandbox, muy sencillo. Solo crea una instancia de Docker y luego clona el repositorio de GitHub para el sandbox. También está la red privada de Vultr, que incluye Indexer, que está ejecutando un sandbox. También admite otras redes, como la beta net, test net y main net. Todas estas son compatibles con el uso del sandbox. Se mencionan algunos SDK, los que están resaltados en rojo son compatibles con Algorand. Los que están debajo, como Rust, PHP, Dart, C#, Swift y otros, son compatibles con la comunidad y el ecosistema. Hay muchas herramientas excelentes a la derecha, incluyendo AlgoDesk.io. También viste Algorand Studio. Algodia es una herramienta realmente útil para un desarrollo rápido con una cantidad mínima de código.

Con PyTL, básicamente tienes Python y luego lo compilas y devuelve TL, como se muestra a la derecha. Hay un excelente curso de PyTL en YouTube, con una lista de reproducción muy útil y un excelente trabajo del instructor. Tu primera transacción, vamos a ver esto en JavaScript. Vamos a abrir esta página en el portal del desarrollador. Si te desplazas hacia abajo, te dará los pasos para comenzar. Aquí es donde instalas el sandbox, como mencionamos, y aquí es donde instalas el SDK para JavaScript. Puedes ver la información allí, hay videos sobre cada uno de ellos. También hay una demostración en vivo que puedes probar haciendo clic en el botón de ejecutar. Verás cómo se ejecuta todo. Luego comienzas a trabajar en el código y a crear cuentas e instanciar tus clientes. Esto nos lleva a Reach. ¿Qué es Reach? Bueno, es un lenguaje de programación, es un lenguaje de alto nivel y también es un compilador que implementa tu DApp en la blockchain.

7. Reach Programming and Solution Deployment

Short description:

Los programadores de Reach se centran en la lógica empresarial, mientras que el backend se encarga de generar e implementar soluciones en la blockchain. El frontend proporciona una interfaz de usuario para crear cuentas y ejecutar métodos tradicionales del SDK de Algorand. Es fácil de instalar y requiere Docker y el ejecutable de Reach.

Entonces, el enfoque está en la lógica empresarial. Por lo tanto, los programadores de Reach no necesitan preocuparse por los detalles de cosas como el almacenamiento de contratos, diagramas de protocolo, validación del estado, detalles de la red. Así que tienes el backend. Empezaremos allí, en la parte derecha. Puedes ver que es responsable de generar e implementar la solución en la blockchain. Además, interactúa automáticamente con los contratos inteligentes. Es una implementación de solución. Define las interfaces para el frontend con las que vas a interactuar, y defines cosas como participantes y APIs así como verificación y compromiso.

En el frontend, ahora el frontend puede hacerse, el backend es como código similar a JavaScript. Muy bien, y en el frontend, esto se puede hacer en Python, Go o JavaScript o C-sharp. Y básicamente lo que tienes aquí es una interfaz de usuario que se proporciona, y hace cosas como crear cuentas y muchos métodos tradicionales del SDK de Algorand. También puedes poner código específico de la blockchain allí, por lo que si tienes algo que es ligeramente diferente entre blockchains, también puedes ajustarlo un poco en el frontend. Puedes compilarlo, ejecutarlo, y luego implementarlo en la blockchain. Muy bien, es bastante fácil de instalar. Solo tienes que abrir Docker, descargar el ejecutable de Reach, y si estás ejecutando esto en Windows, necesitarías el subsistema de Windows para Linux, y luego, este es el código que escribes aquí, creas tu directorio para el proyecto, y luego descargas el ejecutable de Reach, dándole permisos de ejecución.

8. DAP Walkthrough and Verification

Short description:

Un recorrido simple por DAP. Archivo de backend con interacción de jugadores, reglas y resultado. Implementación de frontend, adjunto de contrato y métodos de interacción. La verificación protege contra ataques a la blockchain y garantiza que el saldo del contrato sea cero.

Un recorrido simple por DAP. Así que aquí estamos viendo el archivo de backend. Entonces, ya sea el jugador Bob o Ellis, obtienen los dedos que jugaron y hacen una suposición, y ven quién ganó el juego. Y puedes ver que en la parte superior está realmente, eso es solo la interfaz de los métodos que están definidos en el frontend. Y también tienes otros participantes que están involucrados, ¿verdad?

Entonces, al final del juego, se obtienen los dedos lanzados y la suposición total, y se publican, y luego `commit` significa que has terminado. Estás comprometiendo eso en la blockchain. Entonces, el backend ahora también continúa con las reglas y el resultado. Así que esta es la lógica de un juego. Tengo un juego que te voy a mostrar aquí, Mora, donde lanzas los dedos y haces una suposición entre los dos oponentes. Y si alguno de ellos lo adivina correctamente, entonces ganan ese partido en particular. Así que al hacer esto, todos están de acuerdo en las reglas para el resultado, y todos ven el resultado del motor que tenemos.

Ahora en el frontend, tomas el número común de 10, por ejemplo, en cualquier plataforma nativa compatible. Entonces tomas, por ejemplo, 10 algos, los conviertes en micro-algos. Y luego tienes la capacidad de crear una nueva cuenta de prueba en el entorno de desarrollo con ese saldo inicial. Y luego ves abajo, aquí es donde Alice está implementando el contrato. Y luego Bob se va a unir al contrato, en otras palabras, optar por participar, y luego seguimos adelante y ejecutamos el juego. Y luego también, estos son los métodos de interacción. Así que vimos las interfaces de estos en el backend, y ahora este es el código real en el JavaScript en el frontend que proporciona esto. Así que puedes ver que solo estamos usando algunas funciones aleatorias.

A continuación, hablemos de la verificación. Este es un tema muy, muy importante. Y esto es lo que hace, protege contra ataques a la blockchain. Y garantiza cosas como que el saldo del contrato sea cero. Porque piénsalo, estás creando cuentas sobre la marcha potencialmente en estos contratos. Y ahí estás financiándolos. Y si se crea sobre la marcha, está en el contrato, solo ese contrato sabe cuál es la clave privada, ¿verdad? Nadie más lo sabría. Y si el contrato termina de ejecutarse y todavía hay fondos en esa cuenta y no se han agotado, ¿adivina qué? Vas a perder esos fondos. No hay forma de acceder a ellos porque el contrato termina de ejecutarse, desaparece. Y sabes que eso es un problema, es un inconveniente. Y ha habido, ya sabes, algunas grandes sumas perdidas en el pasado debido a este problema en particular.

9. Verification, Audits, Reach, and Pipeline UI

Short description:

La verificación y las auditorías desempeñan un papel crucial en la prevención de tokens bloqueados. Reach proporciona un compilador que verifica el código, mientras que los auditores verifican las afirmaciones proporcionadas al compilador. Las demostraciones muestran la importancia de una verificación adecuada, y hay una solución disponible en el portal del desarrollador. La interfaz de usuario de Pipeline ofrece controles y componentes para una integración fácil en las soluciones. En resumen, exploramos la blockchain de Algorand, las características de la capa uno, la configuración del entorno, Reach y la construcción de una DApp simple.

Entonces, lo que hace la verificación y las auditorías es prevenir tokens bloqueados, ¿verdad? Por el contrato y, por lo tanto, se vuelven inaccesibles. En cuanto a las auditorías, la solución no Reach es que un auditor demuestra que el programa con su propio análisis y realiza la verificación de una versión del programa. Si hay un cambio menor, entonces la auditoría no sirve para una versión anterior. Tienen que hacer todo desde cero. Con Reach, el compilador verifica y luego el auditor verifica que proporcionaste al compilador Reach suficientes afirmaciones. Y los cambios de código, bueno, el auditor de Reach solo necesita verificar que las afirmaciones correctas se incluyeron en los cambios de código.

Entonces, aquí puedes ver que Alice lanza cuatro dedos y adivina un total de cinco. Esto es solo una demostración de imprimir algo en el backend y luego también puedes ver que Bob lanza cero dedos y adivina cuatro. Entonces, el valor real lanzado es cuatro y Bob gana la apuesta. Y puedes ver que a medida que aumenta el valor de la cuenta. ¿Qué sucede si cambio esto a solo una vez la apuesta? Ahora mismo tienes dos veces porque cada jugador está proporcionando una cantidad de apuesta. Entonces, dos veces la apuesta es el total que está en el bote. Si intentamos ejecutar esto, se dará cuenta de que, oye, esto no funciona porque vas a dejar dinero sobre la mesa. Y ahora puedes ver algunas violaciones a continuación. Puedes ver aquí que el mensaje de saldo cero al salir de la aplicación falló. No es un saldo cero, todavía queda algo ahí dentro. Tengo una solución que escribí en el portal del desarrollador. Aquí hay un enlace que detalla paso a paso la construcción de esa solución en particular que acabamos de ver.

Entonces eso nos lleva al frontend, ¿verdad? La interfaz de usuario de Pipeline, es un SDK de JS vanilla y una biblioteca de componentes de React. Y aquí puedes ver que hay controles disponibles que solo tienes que copiar fragmentos de código y HTML en tu solución. Puedes ver a la derecha un ejemplo que muestra una cuenta, pero no solo el número de cuenta, sino también un código QR. También hay componentes específicos de Algorand en React. Y tenemos espacios de Twitter con Algorand dev Twitter y sigue nuestro Algo Devs Twitter. En resumen, echamos un vistazo a Algorand blockchain a un alto nivel, así como algunos casos de uso, lo que puedes construir con soluciones. Y vimos todas las características de la capa uno. Luego echamos un vistazo a lo que implica configurar el entorno. Echamos un vistazo a Reach y a la construcción de una DApp simple. Este es un producto fascinante. Construye cosas como la verificación como un buen beneficio. Pero nuevamente, lo estás escribiendo en un código similar a JavaScript para el backend, el frontend también puede ser en JavaScript. Y el proceso de verificación es muy, muy importante para construir aplicaciones descentralizadas sólidas. Y finalmente, vimos los controles de la interfaz de usuario de Pipeline. Muchas gracias. ♪♪♪

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Scaling Up with Remix and Micro Frontends
Top Content
Do you have a large product built by many teams? Are you struggling to release often? Did your frontend turn into a massive unmaintainable monolith? If, like me, you’ve answered yes to any of those questions, this talk is for you! I’ll show you exactly how you can build a micro frontend architecture with Remix to solve those challenges.
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Full Stack Components
Top Content
Remix is a web framework that gives you the simple mental model of a Multi-Page App (MPA) but the power and capabilities of a Single-Page App (SPA). One of the big challenges of SPAs is network management resulting in a great deal of indirection and buggy code. This is especially noticeable in application state which Remix completely eliminates, but it's also an issue in individual components that communicate with a single-purpose backend endpoint (like a combobox search for example).
In this talk, Kent will demonstrate how Remix enables you to build complex UI components that are connected to a backend in the simplest and most powerful way you've ever seen. Leaving you time to chill with your family or whatever else you do for fun.
JSNation Live 2021JSNation Live 2021
29 min
Making JavaScript on WebAssembly Fast
Top Content
JavaScript in the browser runs many times faster than it did two decades ago. And that happened because the browser vendors spent that time working on intensive performance optimizations in their JavaScript engines.Because of this optimization work, JavaScript is now running in many places besides the browser. But there are still some environments where the JS engines can’t apply those optimizations in the right way to make things fast.We’re working to solve this, beginning a whole new wave of JavaScript optimization work. We’re improving JavaScript performance for entirely different environments, where different rules apply. And this is possible because of WebAssembly. In this talk, I'll explain how this all works and what's coming next.
React Summit 2023React Summit 2023
24 min
Debugging JS
Top Content
As developers, we spend much of our time debugging apps - often code we didn't even write. Sadly, few developers have ever been taught how to approach debugging - it's something most of us learn through painful experience.  The good news is you _can_ learn how to debug effectively, and there's several key techniques and tools you can use for debugging JS and React apps.

Workshops on related topic

React Advanced Conference 2021React Advanced Conference 2021
145 min
Web3 Workshop - Building Your First Dapp
Top Content
Featured WorkshopFree
In this workshop, you'll learn how to build your first full stack dapp on the Ethereum blockchain, reading and writing data to the network, and connecting a front end application to the contract you've deployed. By the end of the workshop, you'll understand how to set up a full stack development environment, run a local node, and interact with any smart contract using React, HardHat, and Ethers.js.
React Day Berlin 2022React Day Berlin 2022
86 min
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
Top Content
WorkshopFree
Using a library might seem easy at first glance, but how do you choose the right library? How do you upgrade an existing one? And how do you wade through the documentation to find what you want?
In this workshop, we’ll discuss all these finer points while going through a general example of building a code editor using CodeMirror in React. All while sharing some of the nuances our team learned about using this library and some problems we encountered.
TestJS Summit - January, 2021TestJS Summit - January, 2021
173 min
Testing Web Applications Using Cypress
WorkshopFree
This workshop will teach you the basics of writing useful end-to-end tests using Cypress Test Runner.
We will cover writing tests, covering every application feature, structuring tests, intercepting network requests, and setting up the backend data.
Anyone who knows JavaScript programming language and has NPM installed would be able to follow along.
Node Congress 2023Node Congress 2023
63 min
0 to Auth in an Hour Using NodeJS SDK
WorkshopFree
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool.
We will enhance a full-stack JS application (Node.JS backend + React frontend) to authenticate users with OAuth (social login) and One Time Passwords (email), including:- User authentication - Managing user interactions, returning session / refresh JWTs- Session management and validation - Storing the session for subsequent client requests, validating / refreshing sessions
At the end of the workshop, we will also touch on another approach to code authentication using frontend Descope Flows (drag-and-drop workflows), while keeping only session validation in the backend. With this, we will also show how easy it is to enable biometrics and other passwordless authentication methods.
Table of contents- A quick intro to core authentication concepts- Coding- Why passwordless matters
Prerequisites- IDE for your choice- Node 18 or higher
React Summit US 2023React Summit US 2023
96 min
Build a powerful DataGrid in few hours with Ag Grid
WorkshopFree
Does your React app need to efficiently display lots (and lots) of data in a grid? Do your users want to be able to search, sort, filter, and edit data? AG Grid is the best JavaScript grid in the world and is packed with features, highly performant, and extensible. In this workshop, you’ll learn how to get started with AG Grid, how we can enable sorting and filtering of data in the grid, cell rendering, and more. You will walk away from this free 3-hour workshop equipped with the knowledge for implementing AG Grid into your React application.
We all know that rolling our own grid solution is not easy, and let's be honest, is not something that we should be working on. We are focused on building a product and driving forward innovation. In this workshop, you'll see just how easy it is to get started with AG Grid.
Prerequisites: Basic React and JavaScript
Workshop level: Beginner
Node Congress 2023Node Congress 2023
49 min
JavaScript-based full-text search with Orama everywhere
Workshop
In this workshop, we will see how to adopt Orama, a powerful full-text search engine written entirely in JavaScript, to make search available wherever JavaScript runs. We will learn when, how, and why deploying it on a serverless function could be a great idea, and when it would be better to keep it directly on the browser. Forget APIs, complex configurations, etc: Orama will make it easy to integrate search on projects of any scale.