Framework for rapid Dapp development.
Simple. Robust. Extendable. Testable.
Introduces great features:
- 🏗️ React hooks - Uses React hooks as your primary building ingredient
- 🚅 Auto refresh - Refreshes on a new block, wallet change or network change
- 🛒 Multicall - Combines multiple blockchain calls into a single multicall
Combines the best practices:
- 🔧 Modern stack - Employs ethers.js, multicall & waffle
- 📚 Extendability - Extends easily with custom hooks
- 💡 Testability - Simple integration tests for UI and blockchain
import { Mainnet } from '@usedapp/core/modal/chain/ethereum'
import { useEthers, useEtherBalance } from '@usedapp/core'
const config = {
readOnlyChainId: Mainnet.chainId,
readOnlyUrls: {
[Mainnet.chainId]: 'https://mainnet.infura.io/v3/62687d1a985d4508b2b7a24827551934',
},
}
ReactDOM.render(
<DAppProvider config={config}>
<App />
</DAppProvider>,
document.getElementById('root')
)
const STAKING_CONTRACT = '0x00000000219ab540356cBB839Cbe05303d7705Fa'
export function App() {
const { activateBrowserWallet, deactivate, account } = useEthers()
const userBalance = useEtherBalance(account)
const stakingBalance = useEtherBalance(STAKING_CONTRACT)
return (
<div>
{!account && <button onClick={activateBrowserWallet}> Connect </button>}
{account && <button onClick={deactivate}> Disconnect </button>}
{stakingBalance && <p>ETH2 staking balance: {formatEther(stakingBalance)} ETH </p>}
{account && <p>Account: {account}</p>}
{userBalance && <p>Ether balance: {formatEther(userBalance)} ETH </p>}
</div>
)
}See application here.
For detailed feature walkthrough checkout documentation.
Contributions are always welcome, no matter how large or small. Before contributing, please read the code of conduct and contribution policy.
- Make sure all tests pass.
- Make sure linter passes.
- Make sure you have test coverage for any new features.
To install dependencies type:
npm i -g pnpm
pnpm installTo build project:
yarn buildTo run tests type:
yarn testTo run linter type:
yarn lintuseDapp is released under the MIT License.