Click Here to Read the Full Tutorial

Intro

In this step-by-step tutorial, you will create a simple counter dApp on the Hedera network using Solidity, React JS, MetaMask, and Ethers JS. The goal with this example is to help you understand the fundamentals of dApp development, making it easier for you to create more complex dApps in the future.

Tools You Will Use

• React JS (Documentation)
• MetaMask (Documentation)
• Ethers JS (Documentation)
• Solidity (Documentation)
• Hedera JSON-RPC Relay (Hashio)
• Mirror node REST API (Learn More)
• Mirror node explorer (HashScan)
• Axios (npm package)

Run this dApp using GitPod (Recommended)

Click here to set up GitPod environment.

Run this dApp locally

Clone the Repo

To clone the repository, open your terminal and navigate to the directory where you want to place the project. Then, run the following command:

git clone https://github.com/ed-marquez/hedera-example-metamask-counter-dapp.git

Navigate to the Directory

Once the cloning process is complete, navigate to the project folder using:

cd hedera-example-metamask-counter-dapp

Install Project Dependencies and Start the Application

Install all project dependencies. Dependencies are listed in the package.json file, so you can just use:

npm install and npm start

Application Architecture at a High Level