NoahZinsmeister/web3-react
Web3 React
web3-react is a React framework for building decentralized applications that connect to Ethereum wallets and read blockchain state. It provides a unified interface for wallet connection management, enabling Ethereum dApp development through a collection of hooks and providers that abstract away provider-specific logic.
The library is built around a connector plugin architecture that normalizes interactions across different Ethereum networks and wallet implementations. It distributes blockchain state through React Context and synchronizes state reactively by subscribing to provider events like account changes and network switches. This architecture supports runtime switching between wallet providers such as MetaMask, WalletConnect V2, Coinbase Wallet, and Gnosis Safe without reloading the application.
The framework exposes wallet connections, account data, and transaction capabilities through custom React hooks, keeping the core library lightweight by requiring only a single provider wrapper with connectors loaded on demand. It also supports reading on-chain data like account balances and network information, as well as initiating and tracking Ethereum transactions from components.
Features
- React dApp Frameworks - Provides a React framework for building decentralized applications that connect to Ethereum wallets and read blockchain state.
- Blockchain Provider Abstractions - Normalizes interactions across different Ethereum networks and wallet types through a common provider abstraction layer.
- Frameworks - Provides a React framework for building decentralized applications that connect to Ethereum wallets and read blockchain state.
- React dApp - Provides a React framework for building decentralized applications that connect to Ethereum wallets and read blockchain state.
- React Connectors - Provides a React framework for building decentralized applications that connect to Ethereum wallets and read blockchain state through hooks and providers.
- Provider Abstractions - Ships a React context-based provider that normalizes interactions across different Ethereum wallets and networks.
- Wallet Access Hooks - Exposes wallet and blockchain interactions through custom React hooks, decoupling UI from connection management.
- Wallet Provider Connectors - Provides a connector plugin system that supports interchangeable wallet adapters for MetaMask, WalletConnect, Coinbase Wallet, and Gnosis Safe.
- Browser Extension Connections - Provides a unified interface for connecting Ethereum wallets through browser extensions, hardware devices, or hosted providers.
- Connection Management - Connects Ethereum wallets to web apps through browser extensions, hardware devices, or hosted providers with a unified interface.
- MetaMask Connections - Connects to the Ethereum blockchain through the MetaMask browser extension to sign transactions and manage accounts.
- Wallet Integrations - Provides a React integration layer that connects browser wallets, hardware wallets, and hosted providers to dApps.
- React Wallet Hooks - Provides a collection of React hooks that expose wallet connections, account data, and transaction capabilities without provider-specific logic.
- Runtime Wallet Switching - Enables swapping the active wallet connection at runtime without reloading the application or losing state.
- Component Context Sharing - Shares blockchain state across the component tree through React Context, avoiding prop drilling for wallet and network data.
- Wallet Connector Plugins - Defines a standard connector interface that third-party wallet providers implement as interchangeable plugins.
- Event-Driven State Synchronizers - Updates React state reactively by subscribing to provider events like account changes and network switches.
- React Libraries - Provides React hooks and providers for connecting Ethereum wallets and reading blockchain state in dApps.
- WalletConnect V2 Implementations - Establishes wallet connections using the WalletConnect V2 protocol for cross-platform dApp interactions.
- Blockchain State Querying - Reads account balances, network information, and other on-chain data from a connected Ethereum provider in a React application.
- Ethereum Transaction Sending - Initiates and tracks Ethereum transactions from a component after the user confirms them in their wallet.
- Coinbase Wallet Connections - Supports connecting to Ethereum via Coinbase Wallet for multi-chain management and account operations.
- Direct Network Connections - Connects directly to an Ethereum network provider without a browser extension for read-only or custom wallet interactions.
- Gnosis Safe Integrations - Integrates with Gnosis Safe smart contract wallets to approve and manage multi-signature transactions.
- On-Demand Connector Injection - Keeps the core library lightweight by requiring only a single provider wrapper, with connectors loaded on demand.
- Development Boilerplates - React framework for building single-page Ethereum dApps.
- Development Frameworks - React framework for building single-page dApps.
- Project Starter Kits - React hooks library for managing Ethereum wallet connections.
