Use Wallet

👛 useWallet() · All-in-one solution to connect a dapp to an Ethereum provider.
Alternatives To Use Wallet
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
a month ago106otherJavaScript
Mastering Ethereum, by Andreas M. Antonopoulos, Gavin Wood
Metamask Extension10,655319 hours ago2June 10, 20221,784otherJavaScript
:globe_with_meridians: :electric_plug: The MetaMask browser extension enables browsing Ethereum blockchain enabled websites
Full Blockchain Solidity Course Py10,031
3 months ago215mit
Ultimate Solidity, Blockchain, and Smart Contract - Beginner to Expert Full Course | Python Edition
Scaffold Eth8,903
4 days ago8mitCSS
🏗 forkable Ethereum dev stack focused on fast product iterations
Wtf Solidity8,319
2 days ago11otherSolidity
我最近在重新学solidity,巩固一下细节,也写一个“WTF Solidity极简入门”,供小白们使用,每周更新1-3讲。Now supports English! 官网:
19 hours ago805apache-2.0Rust
Foundry is a blazing fast, portable and modular toolkit for Ethereum application development written in Rust.
Hardhat6,190203,202a day ago126August 01, 2023439otherTypeScript
Hardhat is a development environment to compile, deploy, test, and debug your Ethereum software.
Awesome Solidity6,134
7 days ago7
⟠ A curated list of awesome Solidity resources, libraries, tools and more
Web3 React5,16113266 days ago58April 19, 2023139gpl-3.0TypeScript
A simple, maximally extensible, dependency minimized framework for building modern Ethereum dApps
Wagmi4,911409a day ago302August 09, 202329mitTypeScript
React Hooks for Ethereum
Alternatives To Use Wallet
Select To Compare

Alternative Project Comparisons

👛 useWallet()

useWallet() allows dapp users to connect to the provider of their choice in a way that is as straightforward as possible. It provides a common data structure for any connected account, no matter what provider has been chosen by the user. It aims to provide some features that are often reimplemented by dapp developers: connecting to a wallet, keeping track of transactions, and more (submit a issue or PR!).


  • All-in-one solution to connect to Ethereum providers.
  • Completely library agnostic (use Web3.js, ethers.js, …).
  • Provides the current balance.
  • Keeps track of the recent transactions (coming soon).


Oh yes:

  • React only.
  • Ethereum only (for now).
  • Supports one network at a time.
  • Embeds as many providers as possible.
  • Every prop and parameter is optional.

What useWallet() is not

  • An Ethereum wallet implementation.
  • A low-level, fully configurable connection system for Ethereum providers (see web3-react if you are after that).
  • An general library to interact with Ethereum (see ethers.js, Web3.js, etc.).

Used by


Add it to your project:

yarn add use-wallet

Use it in your React app:

// App.js

import React from 'react'
import { useWallet, UseWalletProvider } from 'use-wallet'

function App() {
  const wallet = useWallet()
  const blockNumber = wallet.getBlockNumber()

  return (
      {wallet.status === 'connected' ? (
          <div>Account: {wallet.account}</div>
          <div>Balance: {wallet.balance}</div>
          <button onClick={() => wallet.reset()}>disconnect</button>
      ) : (
          <button onClick={() => wallet.connect()}>MetaMask</button>
          <button onClick={() => wallet.connect('frame')}>Frame</button>
          <button onClick={() => wallet.connect('portis')}>Portis</button>

// Wrap everything in <UseWalletProvider />
export default () => (
      // This is how connectors get configured
      portis: { dAppId: 'my-dapp-id-123-xyz' },
    <App />


<UseWalletProvider />

This is the provider component. It should be placed above any component using useWallet(). Apart from children, it accepts two other props:


The Chain ID supported by the connection. Defaults to 1.


Configuration for the different connectors. If you use a connector that requires a configuration but do not provide one, an error will be thrown.

  • injected: no configuration needed.
  • frame: no configuration needed.
  • fortmatic: { apiKey }
  • portis: { dAppId }
  • provided: { provider }
  • authereum: no configuration needed.
  • squarelink: { clientId, options }
  • walletconnect: { rpc: { 1: 'https://rpc-url', 3: 'https://rpc-url' } }
  • walletlink: { url, appName, appLogoUrl }

See the web3-react documentation for more details.


Automatically connect to wallet on page load. Defaults to false.


This is the hook to be used throughout the app.

It takes an optional object as a single param, containing the following:

  • pollBalanceInterval: the interval used to poll the wallet balance. Defaults to 2000.
  • pollBlockNumberInterval: the interval used to poll the block number. Defaults to 5000.

It returns an object representing the connected account (“wallet”), containing:

  • account: the address of the account, or null when disconnected.
  • balance: the balance of the account, in wei.
  • chainId: The specified Chain ID of the network you're connected to.
  • connect(connectorId): call this function with a connector ID to “connect” to a provider (see above for the connectors provided by default).
  • connector: The "key" of the wallet you're connected to (e.g "metamask", "portis").
  • connectors: the full list of connectors.
  • error: contains an error object with the corresponding name and message if status is set to error.
  • ethereum: the connected Ethereum provider.
  • getBlockNumber(): this function returns the current block number. This is a function because the block number updates often, which could trigger as many extra renders. Making an explicit call for the block number allows users of useWallet() to avoid extra renders when the block number is not needed.
  • isConnected(): this function returns whether the wallet is connected.
  • networkName: a human-readable name corresponding to the Chain ID.
  • reset(): call this function to “disconnect” from the current provider. This will also clean the latest error value stored in use-wallet's state.
  • status: contains the current status of the wallet connection. The possible values are:
    • "disconnected": no wallet connected (default state).
    • "connecting": trying to connect to the wallet.
    • "connected": connected to the wallet (i.e. the account is available).
    • "error": a connection error happened.
  • type: whether or not the account is a contract. Can be null when you're disconnected, or either "contract" or "normal".


To run the examples, switch to the respective directories. Then, simply run yarn install to install, and yarn start to run the examples on localhost:1234.

Special thanks

useWallet() is a built on web3-react and its connectors, which are doing all the hard work internally.

Popular Ethereum Projects
Popular Dapp Projects
Popular Blockchain Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.