OpenViSTAI · Agents · Blockchain · Crypto
Menu
Developer Tools

WEB3 Vs Ethers

WEB3 Vs Ethers is a JavaScript comparison guide and example project showing how Web3.js and Ethers.js connect React frontends to an Ethereum smart contract. It includes paired interfaces and a Truffle Counter contract for demonstrating contract setup, state reads and transactions.

Independent OpenViST project profile, based on linked sources.

WEB3 Vs Ethers — OpenViST project profile in Developer Tools.
OpenViST project illustration. See the linked sources for product details.
Understand the project

Practical overview

When it fits

Use it as a focused learning reference when comparing Web3.js and Ethers.js contract interaction or preparing a small local demonstration with the included Counter example.

Who it is for

  • JavaScript developers learning the differences between Web3.js and Ethers.js.
  • Ethereum developers seeking a small React example of smart contract reads and writes.

Documented uses

  • Compare how the two libraries initialize a contract instance using its ABI and deployed address.
  • See how each library reads a constant contract method and represents the returned value.
  • Study how each library submits a state-changing transaction and handles its result.
Before you choose

Requirements & limits

  • The examples use React with Hooks and a Truffle Counter contract written for Solidity ^0.5.0.
  • The sample workflow targets a Truffle development chain and serves the frontend locally.
  • Contract setup differs: the Web3.js example uses a from address and network ID, while the Ethers.js example uses a Signer and chain ID.
  • The example returns a string for the Web3.js count and a BigNumber for the Ethers.js count.

Check current requirements in the official documentation. Source-based guidance does not mean OpenViST has run or independently tested this project.

Source-based practical guide

Prepare and serve a sample frontend

Deploy the sample Counter to the Truffle development chain, then serve one of the documented React frontends.

Before you start

  • The project repository, including its Truffle smart-contract project and either app-ethers or app-web3js.
  • Truffle and npm.

Steps

  1. Start the Truffle development console with truffle develop.

  2. Run migrate in the Truffle console to compile and deploy the contract to the development chain.

  3. In the chosen frontend folder, run the command below and then the command below.

    Documented command
    npm install
    Documented command
    npm start
  4. Open http://localhost:1234 in a browser.

Expected outcome

The selected React frontend is served locally and configured in the project to interact with the sample Counter contract.

Guide limitations

  • The guide documents the sample contract and development chain workflow; it does not describe deployment to a public network.
  • The frontend requires the contract deployment and matching artifact information.
Evidence and transparency

Sources & review

Source record details
Source availability
Active
Sources checked
17 October 2026
Original website title
adrianmcli/web3-vs-ethers · Official homepage title · retained in its source language