Intro al desarrollo frontend para DApps en React

React Buenos Aires | Octubre 2022

Sitio web hecho en NextJS usado durante la charla para demostrar como interactuar con DAI y CompoundJS desde nuestro browser usando React.

Acá dejamos los links a la demo online y a la presentación.

Iniciando el servidor

npm run dev
# o
yarn dev

Pre-requisitos

• Instalar metamask en el browser (link)
• Obtener GoerliEth de faucet (link)
• Convertir un poco de GoerliEth a DAI en Uniswap (usar dirección de DAI para Goerli especificada más abajo)

Pasos

• Paso 0 - componentes mockeados
• Paso 1 - leer contratos
• Paso 2 - verificar si se otorgó acceso a los fondos
• Paso 3 - conectar billetera
• Paso 4 - autorizar a compound a acceder a los fondos
• Paso 5 - obtener info de la TX
• Paso 6 - mintear CDAI

Direcciones de contratos (Goerli)

• DAI: 0x2899a03ffDab5C90BADc5920b4f53B0884EB13cC
• CDAI: 0x0545a8eaF7ff6bB6F708CbB544EA55DBc2ad7b2a

Links

• Ethers.js (para interactuar con ethereum)
• Wagmi (hooks de react para interactuar con ethereum)
• Goerli Faucet (para obtener Eth de prueba)
• Block Explorer (para ver info de txs)
• Docs de Compound (sección para verificar los contratos que debemos usar para cada network)