App.js

App.js has the following functions:

  • Use the injected web3 objected to connect to the Ganache blockchain and set the network in the navigation bar.
  • Asynchronously access MetaMask for account authorization.
  • Define the Transfer, Approve, and Mint methods for interacting with the token contracts.
  • Set the state and pass the relevant props to the container component before each operation (Approve, Mint, and Transfer) is carried out.

Let's look at the code:

  1. We will start writing App.js by first importing React, Web3, and the app components, as shown here:
import React, { Component } from 'react';import Web3 from 'web3'import Tokens20 from './Tokens/all20';import Tokens721 from './Tokens/all721';import Nav from './Components/Nav';import ...

Get Blockchain Development for Finance Projects now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.