I like that you didn't edit out the parts where you didn't do it correctly the first time, because then we can see some possible ways we can mess things up and know how to fix them. Good stuff!
I have to say this was the best basic explanation of using react and ethers to interact with a smart contract, it was simple and concise. I haven't found one better. I do have a quick question. Is there a reason you added a "get" function to the smart contract? my understanding is that all public variables (ie, storedData in this case) automatically have get functionality added by the compiler, so instead of "let val = await contract.get();" we could just use "let val = await contract.storedData();". Am I missing a nuance here?
Right now when i am going to deploy the smart contract. On the environment selection is not available Web3 Provider. Each one should i choose at the moment?
I'm getting "TypeError: Cannot read properties of undefined (reading 'web3Provider')" from trying to use ethers.providers.Web3Provider(windows.ethereum). any help please? I think it has to do with remix changing the web 3 provider environment to custom - external HTTP provider
Also Query 2- Why ethers Contract creation needs both abi_json and contract address? Isn't contract address alone good enough here as ethers could get the contract from blockchain?
Great tutorial thank you so much, am learning the decentralized applications and your tuto helped me a lot. Could you please make a new tutorial about how to make a minting Nft website and connect the collections to metamask wallet. Am newbie at the blockchain development and nft world that’s why am asking. And thank you again for your effort
This was super easy to follow but I am finding when passing the newAccount to my useState to setCurrentAccount its not actually updating the stake... is useStake asynchronous? I tried doing away setCurrentAccount(newAccount) but it says an await call has no effect on the useState call
i went to the git library, and its honestly not clear where you run the npx create-react-app command from. i think you need to address this in your git directory and not hand-wave it away. this is probably why an otherwise good tutorial is lacking - because you're assuming too much.
okay. I'm looking at that updateEthers function and I think that's the point where I got deprecated. I tried to use the old method of signing and connecting. Eventually I couldn't read events anymore and my code just became a mess. this is a fresh start. I was also using vuejs before. 21:15 the moment I've been waiting for all day sifting through everything. I'm almost invincible again.
Actually remix does not show abi anymore (or I could not find it). Great tutorial. Would be great if you make one with hardhat, which is a more serious workspace.
Thanks a lot for this. Query 1- For contract.get() await was used. But for contract.set(), there is no await. Both are calls on the blockchain. Still why the difference.?
We didn't use an await on the .set() because I didn't do any proper error checking. We could have treated it similar to .get() and checked the promise object, but we're blindly calling the method and assuming it executed correctly.
the only video that showed how all of it (the files) is connected
thankyou so much
I've only played with web3 front end some, about a year ago, and this was a great refresher, thanks.
wrg, no such thign as hx worlx about it, ts just macx, no nerx
Awesome video. I would love to see more react and ethers.js content.
Thanks! Anything in particular?
@@michael_couch I would love to see a tutorial on how to make a react page where you can mint a nft from a contract.
Thanks
@@michael_couch Would be cool to see how you can connect and disconnect metamask wallets.
In addition to my previous comment, if you could make it so the button is updated if a wallet is already connected to the website.
Awesome tutorial. Thank you.
I like that you didn't edit out the parts where you didn't do it correctly the first time, because then we can see some possible ways we can mess things up and know how to fix them.
Good stuff!
bro your channel deserves 1 million subs
This was very helpful! Thank you for making this:)
Thank you so much. It helped me so much.
Please keep going ❤
Thank you, I will!
Hello, why doesn't the Metamask pop up to ask for connection?
I have to say this was the best basic explanation of using react and ethers to interact with a smart contract, it was simple and concise. I haven't found one better. I do have a quick question. Is there a reason you added a "get" function to the smart contract? my understanding is that all public variables (ie, storedData in this case) automatically have get functionality added by the compiler, so instead of "let val = await contract.get();" we could just use "let val = await contract.storedData();". Am I missing a nuance here?
same shit
What to do if I wants to show all the messages in the screen
Hello there
I’m having issues connecting with Metamask
After connecting my react-app to the metamask, my page renders nothing
I would love to see a tutorial about payments and withdraws functionalities!!
Amazing man, please keep it up 🚀
why type = { 'submit' } with curly brackets and not straightaway?
Man. I'm struggling so much to implement React with my brownie project :( the app won't recognize the contract address for some reason.
Right now when i am going to deploy the smart contract. On the environment selection is not available Web3 Provider. Each one should i choose at the moment?
HELP?????
Unhandled Rejection (Error): call revert exception (method="get()", errorArgs=null, errorName=null, errorSignature=null, reason=null, code=CALL_EXCEPTION, version=abi/5.5.0)
Can you link to your code?
@@michael_couch l have the same problem, last your version code.
I have tried create a new contract, but it was flop
I am also facing the same issue, how did you fixed your issue?
you deserve a subscribe and damn, you're funny.
Nice tutorial! Learn a lot. I just do not understand why web3 is React oriented. Vue is so much nicer xD
I'm getting "TypeError: Cannot read properties of undefined (reading 'web3Provider')" from trying to use ethers.providers.Web3Provider(windows.ethereum). any help please? I think it has to do with remix changing the web 3 provider environment to custom - external HTTP provider
Also Query 2- Why ethers Contract creation needs both abi_json and contract address? Isn't contract address alone good enough here as ethers could get the contract from blockchain?
You need to give it the abi because Ethers.js doesn't look up the method structures for you.
Sir is ether js and web3 js same , becasue i have seen here also you are writing window.ethereum
Great tutorial!!! Thank you!!
Good job
I really appreciate bro
Is there any way I can reduce the display of the MetaMask address
When I am connected
Thanks a lot this is a great tutorial!
You don't like vscode?
Great tutorial thank you so much, am learning the decentralized applications and your tuto helped me a lot. Could you please make a new tutorial about how to make a minting Nft website and connect the collections to metamask wallet. Am newbie at the blockchain development and nft world that’s why am asking. And thank you again for your effort
Great suggestion!
Thank you so much
This was super easy to follow but I am finding when passing the newAccount to my useState to setCurrentAccount its not actually updating the stake... is useStake asynchronous? I tried doing away setCurrentAccount(newAccount) but it says an await call has no effect on the useState call
LOLLLL :)) That scream made my day!
i went to the git library, and its honestly not clear where you run the npx create-react-app command from. i think you need to address this in your git directory and not hand-wave it away. this is probably why an otherwise good tutorial is lacking - because you're assuming too much.
Great sir , How to develop our own wallet like metamask so that we can transfer ether from our own front end. Liked subscribed referred
12:29 was GOLDEN lmaoo
okay. I'm looking at that updateEthers function and I think that's the point where I got deprecated. I tried to use the old method of signing and connecting.
Eventually I couldn't read events anymore and my code just became a mess. this is a fresh start. I was also using vuejs before.
21:15 the moment I've been waiting for all day sifting through everything. I'm almost invincible again.
you are the best dude
Thanks man.
12:30 made my day.
Great tutorial, my question: how do i connect on mobile app from web (if i already installed metamask). Thanks!
Are you saying that you made a React front end but it won't connect to MetaMask on mobile?
@@michael_couch yep, i mean is there any way when i click connect wallet on web that showing on mobile browser and link to mobile app
@@tridungbk2010 if you use the meta mask explorer, it should work
Also Query 3 Is there a reason why then was preferred over await on the call to window ethereum request in connectWalletHander method?
That's just my bad practice of me mixing async/await with .then promise handling. I mix them arbitrarily, mostly for practice.
Hey would you be interested in a little gig work?
Interested, want to chat?
Actually remix does not show abi anymore (or I could not find it). Great tutorial. Would be great if you make one with hardhat, which is a more serious workspace.
It still does. It will always show abi since the whole point of deploying the contract is to get the abi
Lol you skipped the part I'm stuck on - importing ethers.js to the files - I get an error 'cannot use import outside of a module'
Are you inside your newly created React app directory when attempting to import?
Thanks a lot for this. Query 1- For contract.get() await was used. But for contract.set(), there is no await. Both are calls on the blockchain. Still why the difference.?
Ya good point, also curious
We didn't use an await on the .set() because I didn't do any proper error checking. We could have treated it similar to .get() and checked the promise object, but we're blindly calling the method and assuming it executed correctly.
🔥🔥🔥
Can you make a video about creating a more complicated dapp?
Any particular features you would like to see?
@@michael_couch Payments Dapp?
@@michael_couch Or Voting systems,E-Commerce
Please can you react with html.
Hello, how can we reach you for a consultation?
get vscode ffs