Dapp Introduction

OK I can’t exactly say where is the problem based on your description but I’ll just write down all the steps here to follow.

  1. Launch Ganache you will see All the accounts with default balance of 100Eth.
  2. Go to settings -> Workspace and add your truffle project (point to truffle.js file)
  3. Open settings -> Server leave the host name as is and you can change the server port to 8545 Press Restart on upper right corner(this is important)
  4. Once you have server running, open terminal and navigate to your truffle project
  5. if you have a precompiled contract then do truffle deploy, make sure your contract is displayed as deployed in Ganache.
  6. After Successful deployment make sure, YOU COPY NEW CONTRACT ADDRESS in to your front end web3, may be you have wrong contract address so check for that.
  7. Following is my working react code, Hopefully this will help enjoy let me know how it goes.

const web3 = new Web3(Web3.givenProvider);
const contractAddr = ‘0x75fd53D58b707A5F532a1226849d9D8008aaBD30’;

async componentWillMount() {
accounts = await window.ethereum.enable()
flipCoinContractInstance =new web3.eth.Contract(coinFlipAbi, contractAddr, {from : accounts[0]})
}

Also the truffle.js development block
development: {
host: “127.0.0.1”, // Localhost (default: none)
port: 8545, // Standard Ethereum port (default: none)
network_id: “*”, // Any network (default: none)
}

Hi @filip,

Looks like this video was a victim of breaking changes in metamask. There is a legacy version of the metamask extension now available, but I was not able to get that working either. Will try again tomorrow.

2 Likes

Hi . . . I’m having trouble getting set up (Dapp Intro: Project Setup). I have installed MetaMask and Ganache. Per your instructions in the video, I then clicked on “settings” and “add a network” in MetaMask. After that, I entered the network name (ganache) and then the RPC/URL (http://127.0.0.1:7545). In other words, I followed the instructions in the video exactly. But the problem is that I can’t actually add a new network because the “save” button remains greyed out after entering the above info.

Thank you for the answer! I have how to create new MM acc and all point to the same answer, so I will ask again with screenshots :slight_smile:

If I switch to the PRACTICE account (on the picture I am obviously in Account1 at the moment), it has nothing to do with Account1 right? Is this what you meant by creating a new wallet?

Thanks

I just downloaded a different browser, added MM and created a new wallet there :slight_smile:

1 Like

Well done!
The goal is indeed use a new mnemonic phrase so that the private key generated is completely uncorrelated to your main wallet (where you keep your funds on).

1 Like

Hey @CaliCrypto22

If MetaMask does not allow you to save, it means that you are missing some mandatory fields.
Make sure to insert:

  • Network name
  • New RPC URL
  • Chain ID

Cheers,
Dani

@filip

I have followed the video in setting up the contract instance and then viewing it on the console.
My code is exactly the same as in the video, I have MetaMask set up properly, I am on the Ganache network and using the account address from the first account.

When I view the console I am getting a lot of errors.
Here it is in Brave, I don’t have the option to view the instance:

and here it is in Chrome, I can see the instance but still have all the errors:

With some research, and looking at some of the comments above, I see that MetaMask has made some changes with using web3 (possible legacy changes) and the code in the video is not what should be used. However, I am not sure what I should be changing it to, and I do not want to make changes that will cause me issues in the future.

Does anyone have instructions on what the new code should be?
Is it okay to proceed as it is, since I can see the instance in Chrome, or will I need to change it before I can continue?
This is my code, as per the video:

Any help would be appreciated.
Thanks!

Also, here is what is in the Powershell terminal when I ran Python and then opened the web page:

image

Ben

Hey @Jethrodog

You can follow the example I shared few posts above for another student.
This is the function I wrote to fetch accounts and connect metamask

async function connectMetamask() {
  if (typeof window.ethereum !== undefined) { 
    const accounts = await web3.eth.requestAccounts(); 
    return accounts;
  } else {
    throw('Cannot connect to Metamask');
  }
}

Keep in mind that it’s an async function (you can use promises if you prefer).

Cheers,
Dani

So just at the start where I just want to give “Add data” button the functionality I get the following problem:

I googled it but found nothing that would solve it. Below is my code. I made sure that:

  1. People contract is deployed
  2. the contract address is correct
  3. Metamask is up and running & connected to ganache network WITH correct port

The problem is I don’t even get prompted to approve the tx within Metamask, I just get this error. Does any1 see what is the error I am missing? Thanks a lot!

var web3 = new Web3(Web3.givenProvider);
var contractInstance;

$(document).ready(function() {
    window.ethereum.enable().then(function(accounts){
      contractInstance = new web3.eth.Contract(abi, "0x13eFcB6fB26ef7141051A761E5646a1F250fbb9f", {from: accounts[0]});
      console.log(contractInstance);
    });

    $("#add_data_button").click(inputData);
});

function inputData(){
  var name = $("#name_input").val();
  var age = $("#age_input").val();
  var height = $("#height_input").val();

  var config = {
    value: web3.utils.toWei("1", "ether")
  };

  contractInstance.methods.createPerson(name, age, height).send(config);
}

Thanks Dani.
I will try that out tomorrow when I get back to my computer.
Cheers!

Ben

Also check out if you happen to have the brave wallet running at the same time, that might cause problems with metamask

Thanks!
I did figure out earlier that I needed to turn off the Brave Shields in order to interact with MetaMask.

Hi Dani,

Thanks for your response. I did enter a network name and the new RPC URL. However, I didn’t enter a Chain ID. What should I enter for the Chain ID? In the video it looks like Filip left that field blank.

Hey @CaliCrypto22

Use 1337.
Let me know.

Cheers,
Dani

If worked if I didn’t use config but intstead write {value: web3.utils.toWei("1", "ether")} and it worked.

Below is my coin flip contract. I tested it using remix, and it seems to work successfully. However calling the placeBet function when using Metamask, returns an error.
I’ve been trying to find a solution for the past couple days, but I’m still stuck. Any help would be appreciated.

this seems to be the main error. Which only happens when calling the placeBet Function.
“MetaMask - RPC Error: Error: [ethjs-query] while formatting outputs from RPC”

// SPDX-License-Identifier: MIT
pragma solidity >=0.4.22 <0.9.0;

contract flip{

    //call this function to deposit funds into contract
    function deposit() external payable{}

    function placeBet() public payable{
    //require that the function call value is less than the contract balance.
    //If so, then check to see if time modulo 2 is 1 or 0. If 1 then pay out bet, otherwise keep funds
        require(msg.value < address(this).balance);
            if(block.timestamp % 2 == 1){
                msg.sender.transfer(msg.value*2);
            }
    }

  }


Hey @EdwardSantos

Check this requirement require(msg.value < address(this).balance); and make sure that your contract has enough funds so that it passes.

Keep me posted,
Dani

Dani, I changed the require statement to an if statement and I still receive the same error. It seems to work fine when I call the function in Remix. I also checked the contract balance using the truffle console after first sending it some funds, and it does have enough. I will continue troubleshooting. Appreciate the follow up.

function placeBet() public payable{
        if(msg.value < address(this).balance){
          if(block.timestamp % 2 == 1){
              msg.sender.transfer(msg.value*2);
          }
        }        
    }

Hi @EdwardSantos

Please push your project to GitHub and give me the link, I will take a look :slight_smile:

Cheers,
Dani