jfdesousa7 avatar

Tutorial - React Redux App + Solidity desde cero. Metamask-Ethers

jfdesousa7

Published: 24 May 2022 › Updated: 24 May 2022Tutorial - React Redux App + Solidity desde cero. Metamask-Ethers

Tutorial - React Redux App + Solidity desde cero. Metamask-Ethers


Saludos, en el día de hoy crearemos una app donde usaremos Redux en una aplicación real, en esta ocasión leeremos data desde Ethereum, crearemos un contrato inteligente usando Solidity como lenguaje de programación, además de otras librerías como ethers para la conexión con la web3, usaremos React como librería para el frontend y el core de este tutorial es la de usar Redux para gestionar los estados generales de nuestra aplicación.

App.js

import React, { useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { connect } from "./redux/ethereum/ethereumActionsCreator";
import { fetchData } from "./redux/data/dataActionsCreator";

const App = () => {
const dispatch = useDispatch();
const { ethereum, data } = useSelector((state) => state);
const [value, setValue] = useState("");

const handleButton = async () => {
const txResult = await ethereum.contract.setValor(value);
await txResult.wait();
dispatch(fetchData());
setValue("");
};

return (


{ethereum.error ? ethereum.error : null}
{ethereum.account === undefined ? (
<>

Debes conectarte con metamask


<button onClick={() => dispatch(connect())}>Conectar
</>
) : (
<>

Hola address: {ethereum.account}


Valor: {data.valor}

      <div>
        <input
          text="text"
          value={value}
          onChange={(e) => setValue(e.target.value)}
        />
        <button onClick={handleButton}>Asignar valor</button>
      </div>
    </>
  )}
</div>

);
};

export default App;


▶️ 3Speak

Leave Tutorial - React Redux App + Solidity desde cero. Metamask-Ethers to:

Written by

Blockchain developer ~ website: tupaginaonline.net ~ Instagram : tupaginaonline_net ~ Tennis player in my free time

Read more #programming posts


Best Posts From jfdesousa7

We have not curated any of jfdesousa7's posts yet. But you can encourage our curation team to review posts by visiting them regularly and by referring other readers. Because we give priority to frequently read content.

More Posts From jfdesousa7