Dapp Introduction

[dan-i]

Hey @wilsonlee123

From documentation directly
Take a look here: https://web3js.readthedocs.io/en/v1.2.0/web3-eth.html#eth-sendtransaction-return

[wilsonlee123]

Thank you sir. I’ll be going through that doc!

Have a great day!

[bjamRez]

Hello Dan-i - so which browser is the right one to use? I am having problems as well following Filip’s tutorial as several of the commands seem to be deprecated

[bjamRez]

Disregarde, I had some misspellings and some extra "unexpected tokens ‘});’
@ Filip or @ Dan-I…I switched to Brave browser and turned to on, “Ethereum provider for using Dapps” - Metamask - - UNDER SETTINGS: EXTENSIONS. I don’t know if this helped or not.

//////////////////////////////IT’S WORKING NOW - SO FAR///////////////////////////////////

[bjamRez]

@filip Lesson Ethereum 201: setting data…I have a new problem. I m trying to add name, age and height to create a person on the html site but I am getting this error:

This is were I am at:

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

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

});

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

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

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

sorry - I just noticed I am missing some code…
------------------------I was missing this code----------------

var name = $('#name_input').val();
  var age = $('#age_input').val();
  var height = $('#height_input').val();

[Anonymous]

I have some question.

If I want to create a one real app on web3 and connect with smart contract I must be understanding about all the full stack.

someone can provide me which stack technology I should know.

at least can create my own by myself or at the best way.

[dan-i]

Hi @Anonymous

You can create a web3 dapp by following what Filip explains in this course.
HTML and js/web3 is enough.
Of course you can use React too, we have a nice course in the academy for it too.

Happy learning,
Dani

[Anonymous]

After I learn all the course of you provide its has any knowledge I have to learn.

[RCV]

It worked with brave, i was using chrome before. I have new issues now haha it will try to figure it out first before i ask fro help. Thanks dani

[dan-i]

You are welcome

[RCV]

var web3 = new Web3(Web3.givenProvider);
const contractAddress = "0x0142Aa786DfAa4abd6116BfeC3fa11F49107C43E";
var contractInstance;

$(document).ready(async() => {
    contractInstance = new web3.eth.Contract(abi,contractAddress);
    const accounts = await connectMetamask();
    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"), from: accounts[0]
  };

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

async function connectMetamask() {
  if (typeof window.ethereum !== undefined) {
    const accounts = await web3.eth.requestAccounts();
    return accounts;
  };
};

Here is my latest issue, lol.

[Tom1]

Hi all,

I can’t get my page to load on localhost: I get the error: ERR_CONNECTION_REFUSED. I have tried disabling my antivirus and unticking the “don’t use the proxy server for local addresses” as often suggested but it didn’t work… I managed to set up Metamask fine.

Any suggestions?

Thanks!

[RCV]

Has anyone at support had the opportunity to look at my issue??

[dan-i]

Hey @Tom1

Can you post a screenshot of your error?

thanks
Dani

[dan-i]

Hi @RCV

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"), from: accounts[0]
  };

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

console.log(accounts[0]) and post the result please.

[RCV]

This is the result

[dan-i]

Your compiler is telling your that accounts[0] is not defined, therefore it cannot be used as from property.

Check here:

$(document).ready(async() => {
    contractInstance = new web3.eth.Contract(abi,contractAddress);
    const accounts = await connectMetamask();
    console.log(contractInstance);

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

You are getting the accounts and assign it to a constant accounts that is local in your function. Because it is local, other functions do not know about account.
const accounts = await connectMetamask();.

You should declare a global variable and assign the accounts to it, then you will be able to use it throughout your code.

Regards,
Dani

[RCV]

Success!! It finally worked, thanks Dani. Heres my code incase anyone ran into a similar issue. Also i had to declare accounts as a var, if i used const it didnt work.

Im assuming const variable cannot be modified later on in the code. Where var variable allows this flexibility? Am I understanding this correctly?

var web3 = new Web3(Web3.givenProvider);
const contractAddress = "0x0142Aa786DfAa4abd6116BfeC3fa11F49107C43E";
var contractInstance;
var accounts;

$(document).ready(async() => {
    contractInstance = new web3.eth.Contract(abi,contractAddress);
    accounts = await connectMetamask();
    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"), from: accounts[0]
  };

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

  console.log(accounts[0]);
};

async function connectMetamask() {
  if (typeof window.ethereum !== undefined) {
    const accounts = await web3.eth.requestAccounts();
    return accounts;
  };
};

[Bhujanga]

Wow! What a journey today. Finally I decided to take a look into Filip’s “Final Code” he put up for download on github. Here is what I found: The difference to my code was mainly window.abi instead of only abi. While rewatching the ‘Creating an Instance’ video I noticed that the code in the video seemed to be wrong:

, So this error in the somehow led me to the conclusion, and confusion, that window.ethereum.enable is not working anymore, but it still is as I know now.

Then, reading through the thread here I found that @dan-i uses yet another approach (which you can find in the “Road To Madness” Summary. lol
This also did not work at all for me, also not after changing web3.eth.requestAccounts() to await ethereum.request({ method: 'eth_accounts' }); which seemed to be promising first.

So, Wow! I get that developing demands the ability to adjust to changes and look for solutions all the time as the field is evolving fast. Still I would appreciate if the courses were up-to-date with the code, just for the sake of saving some precious life time.

Anyway, I love the course anyway and will stay on track. @filip and @dan-i would you mind to educate me on how to go about the main.js today ? Thank you for all the work you put into this

RoadToMadnessHaHa

Another UPDATE:

After taking a break and restarting ganache, python and re-migrating the contract, the previous error(Trying to call function on a non-contract address), is gone, but now it shows “no from address specified” although it is specified inside the config:

Uncaught (in promise) Error: No "from" address specified in neither the given options, nor the default options.
    at Object.o._executeMethod (web3.min.js:1)
    at HTMLButtonElement.inputData (main.js:23)
    at HTMLButtonElement.dispatch (jquery-3.4.1.min.js:2)
    at HTMLButtonElement.v.handle (jquery-3.4.1.min.js:2)

Update 1

UPDATE:
It seems that I found the working code snippet. Look Here
The problem seemed to be that, window.web3 was removed, or at least web3.eth.getAccounts() and also web3.eth.accounts(). I hope I get this right ?

So here is what actually seems to work:

const accounts = await ethereum.request({ method: 'eth_accounts' });

EXCEPT for this error:

MetaMask - RPC Error: TxGasUtil - Trying to call a function on a non-contract address {code: -32603, message: “TxGasUtil - Trying to call a function on a non-contract address”, data: {…}}

So, what makes me wonder is, how will dApps continue to work when libraries are changed? I am somehow confused also, that 2 hours ago @RCV could make his/her code work and I cannot make it work just 2 hours later? All enlightenment on this is highly appreciated…

Hi @dan-i, I encountered the same problem as @Jose_Hernandez. I tried to use the code you replied to him, but it doesn’t work. I get the error: web3.eth.requestAccounts is not a function.

Thanks a lot for helping out

oldCode

Main Js Code

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

$(document).ready(async() => {
  contract = new web3.eth.Contract(abi,"0xf1050dB3057883F8D249B1ab42fc7724dD302298");
  const accounts = await connectMetamask();
})

async function connectMetamask() {
  if (typeof window.ethereum !== undefined) {
    const accounts = await web3.eth.requestAccounts();
    return accounts;
  }
}
$("#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);
}

Error getAccounts is not a function

@dan-i

$(document).ready(async() => {
  contract = new web3.eth.Contract(abi,contractAddress);
  const accounts = await connectMetamask();
})

async function connectMetamask() {
  if (typeof window.ethereum !== undefined) { 
    const accounts = await web3.eth.requestAccounts();  
    return accounts;
  }
}

Googling doesn’t really help me anyone a clue?

[dan-i]

Hey @RCV

Im assuming const variable cannot be modified later on in the code. Where var variable allows this flexibility? Am I understanding this correctly?

Yes that is correct.