Skip to content

BlockDevsUnited/React-dApp-Tutorial

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React-dApp-Tutorial

Introduction

This step-by-step Tutorial will show you how to create a simple React dApp on Ethereum. This dApp will be a basic ERC20 token wallet.

This tutorial uses the following tools

  • Reactjs - to create the front end
  • Onboardjs - To let people sign in with their wallets
  • Solidity - to write an Ethereum smart contract
  • Ethersjs - To the connect smart contract with the front end

Create React Frontend

  • init react app
npx create-react-app react-dapp
npm install
npm install hardhat --save-dev
npm install --save-dev "@nomiclabs/hardhat-ethers@^2.0.0" "ethereum-waffle@^3.2.0"
npx hardhat compile
npx hardhat run scripts/deploy.js --network rinkeby
npm start
  • create elements, buttons and inputs
  • sign in button

Integrate Onboardjs

Get Smart Contract

Connect Frontend and Smart Contract