Polygon 🛠 WAGMI with Polygon - Builder's Quick Start Walkthrough

[Applause] [Music] gm or actually good evening good night gn i'm steph and i'm a developers advocate at polygon and today i'm going to present on a quick start guide to polygon for biddlers or builders which you all are so quick definition of biddle or bu idl it kind of comes from hodl which i always think of uh hodor from game of thrones when he's like hold the door um but hold on for you for dear life to all of your crypto through the winter with me and also build for dear life because a bear market is a build market [Music] so about half of the hackers at east new york this year our first time web 3 developers which is really cool to me because i started my journey um in web 3 with eth online in october last year and so the main difference between a web 2 app and a web 3 dapp is just the back end there's components of blockchain on the back end but from a front-end perspective it's very similar so if you're used to creating front ends awesome you're in the right place and i'll run you through how to compile and deploy a smart contract on polygon today but really quick i just want to go through a couple fundamentals so what is a blockchain a blockchain is just a public database that's updated and shared across many computers in a network we consider that a decentralized system and a block in a blockchain is just the data or the state that's being stored in those consecutive groups of blocks so if you've ever sent crypto to someone or received it from someone the transaction data needs to be added to the block on the chain in order for it to be a successful transaction and to be accepted um as a transaction on the network and i took this nice little definition from the ethereum foundation they have a great article called what is a blockchain i love the ethereum foundation for all of their different resources it's where i start when i'm learning something new so next up what is polygon this is kind of a quick overview of a bunch of the different products that polygon offers um you've probably heard of polygon pos the most i'll go over that in a little more detail but we also have a bunch of different zk solutions we have super nets and we also have polygon id and we actually just announced an integration with polygon dow i believe two days ago and then we went into more detail about that today at polygon ignite so we would love to see you at a future ignite event but polygon pos which is proof of stake is an ethereum scaling solution and some of the reasons why i've always loved developing on polygon is because polygon is really fast so the transaction speeds um go through super fast uh 7 000 transactions a second versus ethereum at 15. it's also very scalable so it's built to scale with you we've had over 1.4 billion with the b transactions recorded so far and also 29 000 app daps on polygon which is awesome also very flexible it's evm compatible and if you've ever developed on ethereum you're already a polygon developer which is very cool we use all the same tooling and that's all built in so none of that has to change just because you're on polygon and then one of the best parts to me is the cost so as a developer if you're deploying a contract on polygon it costs far less than ethereum with an average transaction being just a fraction of a penny which i absolutely love and then the other reason to deploy on polygon this weekend is that we're giving away twenty thousand dollars in prizes we have four different tracks and we also have a pool prize um which will be split between the top ten projects that deploy on either polygon pos test net or the main net so i'm going to go over how to compile and deploy a smart contract on our test net which is called mumbai so the first thing you have to have is a wallet setup so download metamask create a new address add the test network and then go to the faucet that's a lot of steps so i'm just going to run through the whole thing as a demo i already have meta mask which is a browser extension you can see it up here and i'm also already connected to the polygon testnet but i'll show you how to add that so it you can download metamask from this link but the next thing you're going to do is create a new address for test development so within metamask open up your profile by clicking that upper right hand little dot and then go to create account i like to name my accounts with the date so i'm just going to call this wag me which is which stands for we're all going to make it and then i like to give it a date of like 6 24 so that i remember what i was doing and this is a test account so um i'm never going to use this for real transactions because just security reasons uh so now i've got a new account and the next thing i need to do is add the polygon mumbai test network so the easiest way to do this is to go to polyscan so i'm just going to open that link polyscan shows all of the different transactions on polygon it's very similar to ether scan but it's for the polygon test network because you can see the little mumbai flag up here but if you scroll all the way to the bottom of poly scan you'll see a little add mumbai network button to metamask so that's just a way to quickly and easily add the rpc so we can connect to this network by changing it within metamask so i'm just going to switch the network i'm going to connect to the wallet i just created and we can see that wagmi 624 account is on the polygon test net which is exactly what i wanted so the next step is to add some polygon mumbai test matic from a faucet a faucet is just a mechanism for receiving test crypto so that you can play with it and do different development so you can see that i'm on the faucet account and i'm going to get some test tokens again the network is mumbai which is our test net and i want matic tokens i'm going to grab the wallet address from metamask and paste it in here and i'm going to send myself some crypto if only this worked for bitcoin and ethereum on the mainnet i'd be so rich okay so request is submitted this should take one to two minutes and we'll see it directly in my metamask account as soon as this funding goes through so i don't think it'll take one to two full minutes but we'll see but once that happens we have our wallet fully set up for uh actual smart contract deployment so next we're going to get into how to actually deploy your first smart contract using remix and remix is this really awesome ide it kind of reminds me of visual studio code but not only can you write your smart contracts in solidity in remix but you can also directly compile and deploy them so you don't need a different tool like i don't know what you use for your front ends but you can do all of this straight in remix which is great i'm just going to click right into remix and open this in a new tab but first let's check metamask and see yeah so you can see that we got that 0.2 test matic uh from the faucet successfully and so let's get into the actual coding so again this is the remix ide where you can create your smart contracts and also compile and deploy them i'm going to go straight into the contracts folder and we're just going to look at the first contact this comes built in with remix for you to play with this is written in solidity on line three you can see i'm just gonna zoom in hopefully you all can see that but this is just on line three it this is defining the solidity version so that it's pinned when you're developing and on line 10 you can see this contract is called storage line 12 has a piece of state which is just number that's being defined and on lines 18 and 26 we have two different functions so on line 18 we have the store function this is taking in a number to store within the smart contract so if we did something like store three three would be stored in the smart contract and that would be like the piece of state that we're keeping and then anytime we call the retrieve function it would print the number so if you've developed in javascript i think it looks very similar which i like because i'm a javascript developer in a former life um but we're just going to practice compiling and deploying this smart contract so i'm going to save this within the remix editor and then go to the compile tab which is the third one down and click compile so this is just compiling the code okay so this compiled and the next thing we need to do is deploy this compiled code so the fourth tab down is the deploy and run transactions tab i'm going to switch my environment to injected web 3 because this will read the environment directly from my metamask account you can see there's this custom eight zero zero zero one network and that corresponds to my polygon mumbai test network so i'll connect to my account and just to show you that the network actually changes i'm going to change into the ethereum main net and watch the injected web 3 network appear change when we do that so now we're in the main net but i'm going to go back to the polygon test net but that's just to show you that as you change your network it also changes within um remix so this is an easy way to deploy to any evm compatible chain although we would really like you to do it on polygon of course so now we have our injected web 3 we have the account hooked up and the last thing to do is deploy which i do by clicking the beautiful orange deploy button it shows an estimated gas fee so it's like point zero zero zero three matic i'm gonna confirm that transaction and you can see down here creation of storage which is this smart contract is pending and we can see there is a successful transaction with this nice little green button check mark so at the bottom here you can see deployed contracts we just have this one that we just created and hopefully we all remember oh no my mouse got stuck let's see technical difficulties mouse difficulties there we go okay so back in that contract again on line 18 we had the store function defined and then also the retrieve function and those correspond on the left to two different um callable functions within our contract so remember the store function takes in a number so does anyone have a favorite number shout it out four i heard four so i'm going to set four as the store number by clicking store again this is a transaction so i'm going to confirm the transaction you can see it's pending down here and then if all goes right once this has posted we can retrieve whatever the number is in state and hopefully it will also be four i know it will be because my code always works you're supposed to laugh at that it's not true my code never works but let's retrieve and you can see down here that decoded output we retrieved was for and so just to prove this really works i'm going to update it to 4000 and store this new number on chain so i'm posting a new transaction to store the value and then we'll retrieve the new stored value and it should be four thousand okay so the transaction posted and let's retrieve that value four thousand sweet so this is how you can interact with a contract within remix but you can also do this from a front end in a very similar way to how you would call an api i'm going to show you a link to another tutorial for how to call from the front end but this walkthrough was really just to show you how quick and pretty relatively easy it is to deploy a contract because i know when i was starting out this was something that intimidated me just because i don't know why it did it shouldn't have but i've got all of these steps within the presentation so you can look at it later but just back to this here's four more developer resources we have our dev library on notion the polygon documentation polygon academy which has four levels of different courses that you can take after the hackathon and then also some web 3 concepts from the ethereum foundation if you're building with us we would love for you to tweet this is our twitter account tweet tweet tell us what you're building uh on polygon and our hashtag is hashtag on polygon and then the last thing to plug is another hackathon we have going on it's actually a two month hackathon called biddle-it and this is a great way to keep learning in web3 improve your skills we have a bunch more workshops that we'll be running it's a great way to meet friends and network this is also fully virtual so if your friends weren't able to make it out to new york you can still totally hack with them and connect with other builders by searching for them on our social media using our two hashtags one more plug we're also doing a video series called wag me with polygon some of my beautiful co-workers mitch and rahat have been filming different clips hey guys uh but they would love to meet you and hear about what you're building and we'll get it on video we'll make it look super cool so we would love to see you at our booth and thank you again i'm steph i'm oceans404 on twitter um and this whole presentation in the slides can be found at this tiny url so tinyurl.com polygon dash ethnyc thank you so much