showcasecompleted
IoTeX dApp Sample V2
A starter for React with Typescript with the fast Vite and the beautiful Chakra, tested with the powerful Cypress.
This is a boilerplate template for making your awesome dApp on IoTeX and ETH, BSC, and other possible chains (request here)
Technology used in this template are
Intro
A starter for React with Typescript with the fast Vite and the beautiful Chakra, tested with the powerful Cypress.
Cheat Sheet
Here's a cheat sheet list to help you get started quickly
import { rootStore, useStore } from '@/store/index';
const {god} = useStore()// or const god = rootStore.god
god.isConnect
god.currentChaingod.currentChain.chainId // for current connected chain idgod.currentChain.Coin // eth/bnb/iotxgod.currentChain.Coin.balance // current balance// ... see ChainState
god.currentNetworkgod.currentNetwork.account // for current connected account address// ... see NetworkState
god.setShowConnecter() // to show/close the Wallet Selectorgod.currentNetwork.loadBalance() // to load chain coin balancegod.currentNetwork.multicall() // main function to batch read state from contractgod.currentNetwork.execContract() // main function to execute contract
// multicall/execContract exampleimport ERC20ABI from "..."
const newToken = { address: "0x810ee35443639348adbbc467b33310d2ab43c168", abi: ERC20ABI, symbol: "", name: "", decimals: "", balance: new BignumberState({}),}
const {address, abi} = newToken
await god.currentNetwork.multicall([ { address, abi, method: 'symbol', handler: (v: any) => (newToken.symbol = v.toString()) }, { address, abi, method: 'name', handler: (v: any) => (newToken.name = v.toString()) }, { address, abi, method: 'decimals', handler: (v: any) => (newToken.decimals = Number(v.toString())) }, { address, abi, method: 'balanceOf', params:[god.currentNetwork.account] handler: newToken.balance},);
await god.currenNetwork.execContract({adderss,abi,method:"transfer", params:["0x", "100000000000000000"]})await god.currenNetwork.execContract({adderss,abi,method:"approve", params:["0x", "100000000000000000"]})
// to help share the bignumber between on function and UIimport BN from 'bignumber.js';import { BigNumberState } from '@/store/standard/BigNumberState';
const tokenAmount = new BigNumberState({value: new BN(1000000000000000000), decimals: 18 })console.log(tokenAmount.value.toFixed(0), tokenAmount.format)// 1000000000000000000, 1tokenAmount.setValue(new BN(2000000000000000000))// 2000000000000000000, 2
Installation
Clone the repo and run
yarn install
Start
After the successfull installation of the packages:
yarn start
Tests
You can build tests with Cypress. I wrote a small test to see if it's enabled. You can run it with
yarn test
