How do Dapps work with ERC20 tokens?

Question

I just finished reading which explains how to build a Dapp with Metamask sending Ethereum to a smart contract (Reference: https://medium.com/@merunasgrincalaitis/the-ultimate-end-to-end-tutorial-to-create-and-deploy-a-fully-descentralized-dapp-in-ethereum-18f0cf6d7e0e). Metamask doesn't seem to support ERC20 tokens, so how can you transfer these ERC20 tokens within a Dapp instead of Ether?

Answer 1

A dapp is only an user interface that let the user easily interact with the contract. You could just make a nice UI and use an ERC-20 token, no need to create another contract if your goal is letting people use an ERC20 token (transfer, check balance etc)

Answer 2

Your dapp has to build the transaction that calls the token transfer() function. This way it's able to move tokens

Answer 3

Typically, your ERC20 Token contract will be separate from your dApp contract. To utilize token functionality within your dApp, the most common approach is to:

1. Deploy the ERC20 Token contract
2. Create an ERC20 interface within your dApp contract (with signatures of functions you will use e.g. transfer(), balanceOf(), etc...)

3. Instantiate the ERC20 contract within your dApp contract using the ERC20 contract address

   import "./ERC20interface.sol";
   
   contract DAPP {
   
       ERC20interface myToken;
   
       //here, i pass the erc20 address as a constructor arg
       DAPP(address erc20Address) {
           myToken = ERC20interface(erc20Address)
       }
   
   }
   

You should now be able to utilize the ERC20 functions you included within ERC20interface.sol.

Also, MetaMask does support all ERC20 tokens. You can simply select the "tokens" tab once you are logged in, and then click "add token". You will need to enter the address of the deployed ERC20 contract. Be sure you are connected to the same network which the ERC20 contract is deployed.