Client library to onboard users to web3 apps
easy way to connect users to dapps
Install the core Onboard library, the injected wallets module and optionally ethers js to support browser extension and mobile wallets:
NPM
npm i @web3-onboard/core @web3-onboard/injected-wallets ethers
Yarn
yarn add @web3-onboard/core @web3-onboard/injected-wallets ethers
Then initialize in your app:
import Onboard from '@web3-onboard/core'
import injectedModule from '@web3-onboard/injected-wallets'
import { ethers } from 'ethers'
const MAINNET_RPC_URL = 'https://mainnet.infura.io/v3/<INFURA_KEY>'
const injected = injectedModule()
const onboard = Onboard({
wallets: [injected],
chains: [
{
id: '0x1',
token: 'ETH',
label: 'Ethereum Mainnet',
rpcUrl: MAINNET_RPC_URL
},
{
id: 42161,
token: 'ARB-ETH',
label: 'Arbitrum One',
rpcUrl: 'https://rpc.ankr.com/arbitrum'
},
{
id: '0xa4ba',
token: 'ARB',
label: 'Arbitrum Nova',
rpcUrl: 'https://nova.arbitrum.io/rpc'
},
{
id: '0x2105',
token: 'ETH',
label: 'Base',
rpcUrl: 'https://mainnet.base.org'
}
]
})
const wallets = await onboard.connectWallet()
console.log(wallets)
if (wallets[0]) {
// create an ethers provider with the last connected wallet provider
const ethersProvider = new ethers.providers.Web3Provider(
wallets[0].provider,
'any'
)
const signer = ethersProvider.getSigner()
// send a transaction with the ethers provider
const txn = await signer.sendTransaction({
to: '0x',
value: 100000000000000
})
const receipt = await txn.wait()
console.log(receipt)
}
Onboard v1 migration guide
If you're coming from v1, we've created a migration guide for you.
For full documentation, check out the README.md for each package or the docs page here:
Core Repo
Injected Wallets
SDK Wallets
Hardware Wallets
Frameworks
If you would like to test out the current functionality of V2 in a small browser demo, then:
git clone [email protected]:blocknative/onboard.git
cd onboard
git checkout main
yarn
(if running a M1 mac - yarn install-m1-mac
)yarn dev