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:
- 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 ...