Rimble toast demo
This is a starter React dApp that uses the Rimble UI component library to call methods on a smart contract deployed to the Ethereum Rinkeby testnet.
Overview
- Implements a web3 component library (Rimble UI)
- Wraps common web3 functions for consumption by React components
- Integrates Rimble UI web3 components with web3 provider
Requirements
Quick start
Clone the repo
git clone https://github.com/ConsenSys/rimble-app-demo
Change directories
cd rimble-toast-demo
Install dependencies
yarn install
Start local server
yarn develop
Navigate to http://localhost:3000 in your browser
Modifying smart contract
The smart contract address and the application binary interface (ABI) for the contract are both in the SmartContractCard.js
file. Update these constants with your own smart contract details.
Calling methods
The RimbleWeb3.js
component passes a proper for the web3.eth.contract.send
method and only needs the smart contract's method name.
Customize toast message content
You can customize the toast message content. See Rimble's content guidance for writing toast messages. Read content guidance
Lifecycle states
This is meant to enhance the existing web3 states and show relevant transaction detail to the user to monitor the progress of the transaction.
- Start
- Pending
- First confirmation
- Success
- Failure