Connecting MetaMask's web3 to a React app

If you want your React app to connect to MetaMask's web3, const web3 = new Web3(window.web3.currentProvider);will no longer work as suggested. We need to MetaMask to authorize the connection which is a manual process by clicking on a button to authorize like OAuth kind of process.

npm install web3

import Web3 from 'web3';

// This alone won't work anymore
// const web3 = new Web3(window.web3.currentProvider);

// Connect to metamask
window.ethereum.request({ method: 'eth_requestAccounts' });

const web3 = new Web3(Web3.givenProvider || 'ws://localhost:8545');

export default web3;

Thanks to Brian Marquis : https://www.udemy.com/user/brianmarquis/

Connecting MetaMask's web3 to a React app

Comments

More from this blog

Email validity checker using Google's JSON API for DNS over HTTPS (DoH) in Google Sheets

Getting picoclaw to work on Windows

The core use-case of TypeScript

Hashnode's GraphQL API for RSS feeds

make makemigrations work again

Command Palette

Comments

More from this blog