I am using OpenZeppelin starter kit. I wrote a smart contract that simply contains two integers which can be called. I compiled and deployed the smart contract to my local Ganache blockchain. I have started my React Dapp and it's connected to Ganache through Metamask (I can see my account balance for example).

Please see my repository: https://github.com/Lennardmulder/ozreact

I now want my Dapp to have a button that allows the user to call the count function and show its results. I suspect I first need to use something like

var myContract = new web3.eth.Contract([...], '0xde0B295669a9FD93d5F28D9Ec85E40f4cb697BAe', {
    from: '0x1234567890123456789012345678901234567891', // default from address
    gasPrice: '20000000000' // default gas price in wei, 20 gwei in this case

With the right ABI and address inserted, to allow Metamask to interact with the smart contract? But where exactly do I define this in my code?


Taking a look at your smart contract here I don't see a getter method where your dApp can point to. In your smart contract place this code:

function getCount() public view returns(uint) {
    return count;

Now in your dApp you can access this new method like this:

myContract.methods.getCount().call({from: <ADDRESS>}, function(err, response) {
    if(!err) {
        console.log(response, 'response');
    } else {
        console.error(err, 'err');

Also when upgrading and redeploying your contract don't forget to replace the contract address at new web3.eth.Contract().

| improve this answer | |
  • Thanks for your answer! Actually I believe solidity 0.6.0 creates a getter method automatically when you define a public uint256. You can test this by copy pasting the numbercall.sol contract in Remix. As for the second part of your answer, I think this will not work if I don't first specify myContract, with the corresponding ABI + address of the contract right? My question is more about where and how to specify this code. – Lennard Mulder Mar 10 at 10:08
  • Correct, myContract.methods.getCount(). won't work if you don't create myContract instance with your smart contract address and abi definition. You can take the abi definition from remix before deployment and after the contract deployment you can take the address. – Miroslav Nedelchev Mar 10 at 10:18
  • My JS file now contains a contract object as you instructed. My chrome browser loads the file just fine, but when I try to interact with the contract through the JS console by typing numberCall.methods.count.call(); it throws VM6138:1 Uncaught ReferenceError: numberCall is not defined. Any idea what I'm doing wrong? – Lennard Mulder Mar 10 at 14:10

To add to Miroslav's answer (sorry, I can't comment yet):

If you define your variable as public, the compiler will automatically generate a getter method with the same name as the variable. uint public count as declared in OPs contract will generate the function

function count() public view returns(uint) {
    return count;

There is no need to manually create a getter, just use const count = await instance.methods.count().call() inside an async function to get the value of count.

Take a look here to see how to connect web3 with metamask: How To Connect Web3 With MetaMask?

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.