This project was bootstrapped with Create React App.
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
- this demo aim to make a concrete example on how to make a ETH transaction in minimum code
- reader can have more derived knowledge from the involved entity like provider, signer, etc
- common terms of ethers.js
- connect to MetaMask (testnet Ropsten is working in this demo)
- balance of ETH is stored as Wei on chain, so when you get balance from chain, you need to call
formatEther
to format to ETH, and when you want to send transaction request, you need to callparseUnits
to format to Wei
-
add web3-react context -
Web3ReactProvider
(source code)<Web3ReactProvider getLibrary={getLibrary}> <App> </Web3ReactProvider>
this make the data in hooks available
-
call activate to connect to wallet InjectedConnector is to handle modified behavior like account change, blockchain change, etc call
activate
will connect to walletenum ChainId { MAIN_NET = 1, ROPSTEN = 3, RINKEBY = 4, GOERLI = 5, KOVAN = 42, } const injectedConnector = new InjectedConnector({ supportedChainIds: [ChainId.MAIN_NET, ChainId.ROPSTEN, ChainId.RINKEBY, ChainId.GOERLI, ChainId.KOVAN], }) const { activate } = useWeb3React<Web3Provider>()
-
send transaction to transfer ETH
enum FAUCET_ADDRESS { ROPSTEN = '0x81b7e08f65bdf5648606c89998a9cc8164397647', } const { library } = useWeb3React<Web3Provider>() library?.getSigner().sendTransaction({ to: FAUCET_ADDRESS.ROPSTEN, value: parseUnits(value?.toString()), })