In the project directory, you can run:

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

Compile the contracts

Deploy the smart contracts on theblockchain

Run migrations

You can learn more in the Create React App documentation.

To learn React, check out the React documentation.

You can learn more about truffle Overview of Truffle

Truffle Installation Installation

You can learn more about Ganache Overview of Ganache

Download Ganache

You can learn more about Solidity Solidity Docs

MetaMask is the easiest way to interact with dapps in a browser. It is an extension for Chrome or Firefox that connects to an Ethereum network without running a full node on the browser's machine. It can connect to the main Ethereum network, any of the testnets (Ropsten, Kovan, and Rinkeby), or a local blockchain such as the one created by Ganache or Truffle Develop.

You can install MetaMask

  App.web3Provider = web3.currentProvider;
  web3 = new Web3(web3.currentProvider);
} else {
  // If no injected web3 instance is detected, fallback to Ganache.
  App.web3Provider = new web3.providers.HttpProvider('http://127.0.0.1:7545');
  web3 = new Web3(App.web3Provider);
}