Web3.js Setup

import Web3 from 'web3';

// Connect to provider
const web3 = new Web3(Web3.givenProvider || 'http://localhost:8545');

// Check connection
const connected = await web3.eth.net.isListening();

// Get accounts
const accounts = await web3.eth.getAccounts();

// Get balance
const balance = await web3.eth.getBalance(accounts[0]);
const etherBalance = web3.utils.fromWei(balance, 'ether');

Interacting with Contracts

// Contract instance
const contract = new web3.eth.Contract(ABI, contractAddress);

// Read data (call)
const data = await contract.methods.getData().call();

// Write data (send transaction)
await contract.methods.setData(newValue).send({
    from: accounts[0],
    gas: 500000
});

// Listen to events
contract.events.ValueChanged({
    fromBlock: 'latest'
}, (error, event) => {
    console.log(event.returnValues);
});

MetaMask Integration

// Check if MetaMask is installed
if (typeof window.ethereum !== 'undefined') {
    // Request account access
    await window.ethereum.request({ method: 'eth_requestAccounts' });
    
    // Create Web3 instance
    const web3 = new Web3(window.ethereum);
    
    // Listen for account changes
    window.ethereum.on('accountsChanged', (accounts) => {
        console.log('Account changed:', accounts[0]);
    });
}

Development Tools

• Hardhat: Ethereum development environment
• Truffle: Smart contract framework
• Ganache: Local blockchain for testing
• Remix: Browser-based Solidity IDE
• Ethers.js: Alternative to Web3.js
• OpenZeppelin: Secure contract library