Mantle 🛠 Deploying A SmartContract on Mantle Using Remix

foreign [Applause] [Music] engineer at mantle really excited to have you on board and glad that you are showing interests to get onboarded onto Mantle's testlet this will be our very first walkthrough which is based on the various requests and the questions we've been receiving from the community um yeah without wasting any other further time let's go through the various topics that we will be covering in this short walk through uh I'll try my level best to keep it short um so quickly running through the agendas for the day on let's say for the session uh um it is that we will be covering the prerequisites to start that is adding manual test net to metamask acquiring GS and bit tokens uh so that we are able to interact with the smart contract and also the other dabs which have been made on the testlet uh then we will be actually coming to one of the most exciting parts of the session which is the deployment of the smart contact itself uh which will be done using remix ID so I'll be giving you a quick rundown as to what remix IDE is um then I will also be telling you about the deployment of the smart contract uh the basics as to what is happening and also we'll uh we will be also interacting with the smart contract as well so yeah once we are done with that uh we will also be reading the contacts on the Explorer right we will see as to how mantles tax uh test that Explorer looks like and also what other information we are uh we are able to find about the contract from the Explorer cool without wasting many uh you know much time I think we should dive right into it let me just share my screen really quick cool I think now my screen will be visible uh we can actually dive right into it um so yeah even before getting started uh just a note I'll I will try my level best to go as slow as possible but then make sure as this is a walk through uh and then I'm pretty sure people will be looking at it feel free to pause the walkthrough uh in between right and then try to follow the steps I'll make sure there's a Blog along from bog about the same walkthrough attached in the description below as well also all the links that I'll be using in this walkthrough they will be in the description below so you don't have to worry about copying and pasting it from somewhere else uh all the materials required to go through this walkthrough will be available in the description uh yeah I think now we can get started so first of all one of the prerequisites is before we start deploying any sorts of contractors adding mantle tested to metamask uh so firstly you need to have metamask installed on your browser itself uh let me share the link I mean I'll share the link in the description let me just copy the link myself um yep metamask you can download the metamask extension from here it is pretty easy make sure you are opening your met mask right now what you do is wait uh let me shift my metamask in middle of the screen this time because pretty sure my video would be on the top right hand side so let me do that yep so hopefully my wallet is uh on the center of the screen I think so yes uh so what you have to do is click on your profile picture uh go to settings and go to Networks once you go to network all you have to click all you have to do is that you have to click on ADD Network it will take you to a new screen all together which is fine uh for some extensions it might not take you to a new screen which is fine as well just make sure that you're following the same steps um then click on add a network manually cool uh I already have this information stored with me on my clipboard I'll just copy and paste it from there you'll also have the access of this um info that we're typing in uh just make sure to copy and paste it correctly um and try not to leave any spaces um before starting out as well uh I mean starting the text yep uh once this is done okay it is saying that this URL is currently used by the mantle test Network which is fine because I already have the test net with me so what I can do is um okay where is how do I remove this let me switch my network and then remove this yep works fine let me copy and paste it again yep now it should be working click on Save and there you have it uh you we have successfully added mantle test net manually to our metamask uh now that we have a mantle tested configured with metamask we can move on to acquiring bit tokens and also getting some GE that will be needed as gas in various steps now for acquiring native bit uh since mantle test net currently lives in quality Network you will need to acquire G before you can start bridging your tokens right so we'll go uh through the whole thing step by step first is to acquire G through Paradigm faucet um the links will be in the description no need to worry about it parrot and faucet here we go okay um yeah so let me just sign out really quick uh yeah so this is how the landing page of the parenting faucet will look like if you're trying to use it for the first time sign in with Twitter it will ask you to approve I've already approved it so it wouldn't ask me again um then go to your metamask copy your wallet address right uh just click on this link below uh not link I mean click on this account button sorry um just copy the uh click on it and it gets copied and paste it uh on this search box or the blank space over here right uh and then all you have to do is click on claim yep so as you can see over here on the top right corner or if you cannot see it is showing that I have uh already taken tokens or claim tokens in the last 24 hours so you can only claim token once in 24 hours as I was doing a similar walkthrough yesterday on Discord live I uh did it live so it is like almost like there's almost like two three hours more to it uh so uh by then um I mean it doesn't make sense for me to wait because I already have the tokens but then yeah for the first time users who are able to take it they'll be able to um they will they will be able to get all sorts of tests tokens that is required you can also see as to what tokens you're getting in this drop so point one e point where we eat and five nfts ERC 721 um so yeah you can just check it out as well now um now that we have done this The Next Step would be to acquire big tokens right so for getting the big tokens you need to get uh go through the mantle test net faucet links will be in the description as well right so what I'm going to do is uh let me just check if the link is there yep I don't know it is over okay so the first step would be to connect your uh connected to your wallet over here right and I think I've already connected my wallet uh but then it will still ask me to switch to golly Network yep uh so we click on switch Network hopefully it was visible um I have to keep dragging it out my screen but then it's fine um let me just check again yep uh so the step one would be to authenticate your Twitter just click on authorize app and you should be good to go uh let me select the amount of tokens that are going to win 200 mint um I am opening my metamask yeah and it should ask me uh for some sort of guess I confirm the transaction and cool please expect bit on your address within half an hour cool we wouldn't be waiting for half an hour and usually we get it by like what the two minutes I won't be waiting because I already have done this step and I have bits in my wallet so we'll be moving on to the next step feel free to drop comments below or also directly reach us out on Discord let's say if you have any sort of doubts in any of the steps right um now the third step would be to actually Bridge your erc20 uh tokens that is the bit tokens that we had uh uh through uh through the mantle Bridge yep so I was going to say the mantle test net tokens through the mantle Bridge uh so yeah um let me just uh copy this link okay mantle Bridge we open mantle Bridge wait for it to open cool so my wallet is already connected let me disconnect it so that we can go through the steps again so one of so the first step would be obviously to click on this right top right right hand corner which says um connect wallet so we click on connect wallet we click on metamask and it should be connected directly so one of the things to make sure is that you should be on the quality tested because we are Bridging the tokens from gauri to mantle and not the other way around right so yeah if you want to bridge it you can go ahead and eat tokens that you have gotten that is the Geth uh and then you can also Bridge the beta or the bit tokens uh yeah as you can see over here it's a drop down menu okay so yeah uh make sure that you know I mean this is for everybody node to know that this is a drop down right I had seen multiple questions where people were asking I don't see bit over here so it's a drop down menu you can see as to whatever you have on your uh wallet over here select bit I want to transfer like 100 bits deposit initiating the deposit um yeah as you can see I have to control the transaction I confirm the transaction and it is pending I wait for it to happen it might take one to two minutes right uh but again like I said I already have the bits and G and the tokens already because I've done this multiple times so I wouldn't be waiting and we'll be moving on to the next step um feel free to pause the video as in whenever you want okay yeah by the time if you're talking it's already done uh so we are on this I think we are if you're viewing this and then you're trying to um do and deploy the smart contract at the same time I think we are going hand in hand um I mean there you have it like uh your bits are now available for everybody to test out um I mean obviously you to test out and interact with various tabs being built by developers and um yeah like also before we dive into interacting with various tabs uh let's look at our very simple tutorial to deploy smart contracts on the mantle test net right away um and also don't worry this is way easier than than it sounds will it come yeah okay so uh when it comes to deploying the smart contract uh we are actually using remix IDE over here there are multiple ways you can do it but because we wanted to make it as big enough entry as possible um so we tried to do it while remix uh there are multiple IDs as well where you can try to deploy smart contract as well and that would work out so let me just share my screen uh hopefully it has already shared and let me just open remix cool so a query quick rundown of the remix ID and the interface so this section is actually called the icon panel this is actually called the side panel and here where the code is displayed this is actually the main panel and the one below it is actually called remix interface right in the main panel um on the top right on the top left sorry you can see an icon which is called icon which is basically headphones right um just click on it and that will be that will directly take you to the landing page uh for um for multiple folks that there have been instances where they directly don't land on the landing page and that gets them a little bit um yeah so they get they get confused as to what is happening just click on it and yeah you'll be on the landing page um also make sure on the few on the featured plugin section uh solidity is checked in uh because we need the pre-made smart contracts for this tutorial right um also a pro tip would be that uh once you are well burst with the remix ID there might be multiple plugins that you want to use you can actually enable and disable multiple plugins from this plugin manager which is at the bottom left corner over here cool now let's start with deploying the smart contracts right um now when I say deploying smart contacts and mantle uh it can it can seem like a very big task right but uh in this guide we're trying to cover the basics of deploying the contract with a simple big no friendly tools we will show you how to compile them deploy them and also finally how to interact with them um so given we are just getting started and this is one of our first walkthroughs which is also pretty short uh for this walkthrough we will be focusing only on one contract which is one storage dot solve you can find it under contracts artifacts and there you have it one storage dot soul let me just click on it here Who We Are uh so storage.soul is a very simple contract and it does just two things uh it stores a number one chain by a function store it reads set stored number via function retrieve right we are just storing a number and then we are retrieving a number that's it right um yeah also um now that we know that what this um smart contract is doing all we need to do is that we need to start compiling right so to compile the contract all you need to do is go to the solidity compiler section on the icon panel it is this right and then you have to click on compile storage.sol okay uh yeah uh even before we begin uh make sure that uh on your metamask you are back to mantle testlet because we want to deploy our smart contracts on the mantle desk net right uh so we will be linking your account at the next step of the step which is right after this so make sure you're already on onto the mantle tested and not the quality test net cool make sense uh we compile the storage let me just check yep it is combined yep you will be getting a green check mark like this over here cool now that your smart contract is um compiled let me also show you if there's an error how the whole interface would look like let's say if I remove the semicolon from num it should ideally give me an error yeah see it gives me in password it was saying that it expects a semicolon but it got a bracket instead so we're going to put the semicolon backed so all of the errors will be displayed in the bottom left section um now that we have compiled a smart contract we can deploy the Monumental test set um so for that what we are going to do is we're going to click on deploy and run transactions icon on the icons icon panel cool and also this is pretty invite uh this is pretty important you need to click on let me just yep so the environment has to be the inject provider right and also you have to make sure that even when you are in on inject provider you have to be on mantle tested and not quarterly um yeah cool given we are on mantle test it it is I think we are doing it right yes we are we just check yep now all that is left is actually to deploy the contract right once you have selected the inject provider make sure that it is your same account that is connected that is the wallet right and you select deploy once you hit deploy open your meta mask yep you can see we need to confirm and sign the transaction confirm contract deployment is pending so we will wait for the contract deployment to uh be successful and once it is done it will be something like this because our deployed multiple contacts before as well so it should it basically turns green and shows you the current date yep uh by the time that is done uh make sure if let's say your metamask is it popping up on its own make sure to just go hover over to your extension panel and then click on the Met mask because a lot of time it doesn't happen but then uh yeah that's unless you sign the transaction it wouldn't get deployed right you need to confirm the transaction on your metamask you're still waiting for it to be deployed by the time it is deployed we can actually check on to our block Explorer as to what is happening let me check it out you can see we are directly going onto the mantles testnet Explorer and oh yeah so awesome let me just switch my headphones really quick my headphones are tired cool it isn't a walk through if nothing happens let me just change my settings really quick cool I think everything else is looking fine right um gold now that we can uh getting back to the whole thing now we can see that uh on the Block Explorer it says it is confirmed the result is success status is confirmed it also gives us the block number and also the timestamp as to when it was confirmed right so let us check go back to remix open our metamask let me put it in the middle of the screen yeah so you can see the uh the most recent activity was uh contact deployment to the spending before now we can see that it has been done amazing um so yeah one of the other things I actually didn't want to open the Explorer now but then I just wanted to confirm without wasting any time um as to is it confirmed or not or is there any sort of error which is happening but then I think we are on the right track cool um now that like um now that we uh it has shown success fully and everything is on the track let me just check yep uh so yeah like first of all congrats for deploying your very first contract on the model test that you have compiled this the smart contract and you have also deployed it on the battle tested as we could see from the transaction itself it took us to Mantle's uh test net Explorer and we could see the block it was created and also timestamp when it was created um yeah so yeah congrats um also now coming to one of the most in uh like more exciting parts of the session would be uh interacting with a smart contract that is what we are going to do next um now in the deploy contact Section you should uh now the deployed contracts section should be actually populated with lots of information right if you expand on the contracts over here you should be able to see more information right so what is happening over here uh if you go to deployed contracts uh just I can uh just beside it on the right side it says copy if you copy it it is the actual address of the contract which you have just deployed we are going to use it uh a little later once we are done with interacting with the smartphone tract right um so what is this uh store so like I said this contract that we compiled it actually does the students it stores the info and it displays an info so under stores just write any number that you want your contract to store let's say I want to give it 26. okay make sure that you're heading over to your metamask confirming the transaction pending will wait for it to happen and by then yeah um so like I was saying this solidity uh uh the smart contract that we had written uh it just does two things for now but then eventually we'll be scaling up uh like we'll be trying out our best uh through scale up through the walkthrough sessions that then eventually create our own custom contracts like that is the end goal um we are happy to help and make sure you're dropping us any sort of questions that you have throughout the walkthrough or any sort of uh questions or doubts you have for even other sorts of things that you might be using or any sorts of other IDE uh feel free to tag us there cool um if you can see the screen uh it is the transaction is actually done uh which is pretty amazing um so the store function that we called it is actually confirmed cool uh we will also confirm this by going on to Explorer later but then now we can also test if it actually worked by calling the retrieve function so just click on retrieve it says call call from this block to storage this is actually our wallet address to store dot receiver which received the value that has been stored which is actually 26 C um so yeah we are on the right page uh we are actually yeah I was just looking at the terminal for a second uh but then yeah I think everything looks good we have deployed successfully and then we have uh interacted with the smart contract as well on the mantle test net uh yeah now I think um that covers everything that we wanted to before we move on to explore or to explore us to uh what all the information we can find about the contract um congrats for deploying your very first contract under the mantle test net if you have any doubts again feel free to Ping us on Discord uh and our devs and our support team will be ready I will also be there to answer any sort of questions right amazing moving on to reading the smart contracts onto the mat on using the mantle Explorer right uh so let's try and explore all sorts of info that we can find about the smart contract which is deployed on Explorer uh first let's go to Explorer right where is Explorer cool so the Explorer web page right now for testnet it looks something like this right all you need to do is go back to your remix IDE um under deployed contracts right under deployed contracts you can see there's a copy item icon over here just make sure to copy it copies the smart contracts address go back to your mantle Explorer and then paste it over here yeah so one of the main reasons why I keep the Explorer thing on the end is because it went sometimes it does take time for the smart contract to show up on the Explorer but then it eventually does it on the battery testnet uh it is pretty fast um but then yeah sometimes due to congestion or maybe anything else it might take some time uh there are also instances where metamask API is not able to fetch it in real time there might be certain instances like that as well so that is why in between I was going on to mantle test net to check um if our contract was actually deployed onto the test set cool now let me check as to what is happening cool if we go to the transactions tab this is important for us at least at this stage to understand you can see our contract was actually created who created the contact this will be your wallet address that is there and also the contract where the ID was uh the contract uh ID where the whole thing was also created within uh one of the things to look at is you can also check the block number which was also given uh during the transaction as well it was uh the contract was created nine minutes ago and then we also had a contract called just a few minutes back after right so we did two sorts of transactions as well where we had to approve those transactions or metamask as well if you remember cool also if you want to play around a little bit uh one of cool things to try out is obviously you open your metamask make sure you're on to the mantle test it and that you copy your own wallet address and see yes to what sorts of transactions have been done cool so I have it if you go to the tokens tab it will show you as to what all tokens are available right you can it tells me that erc20 type there's three sorts of token bit token clown and ether and also under transactions over here you can see the same sorts of transaction that we made out our contact creation was there and our contract call was also there five minutes and seven minutes ago so yeah um uh if your fifth like feeler if you feel like playing around the Explorer a little bit more then you can uh definitely check out S2 token transfer tokens internal transactions and you know play around us too with others deployed contracts on the mental test set as well and check as to what is going on there uh would be really cool to look at some insights that everybody is able to find uh and what all information they are able to get um but then yes like thanks again for tuning in to this short walkthrough right um and then yeah like even before anything like congrats again for deploying your very first contract onto the mantle test net um here actually we've covered basic onboarding by setting up the metamask adding mantle tested to it manually followed by getting jeed and some bit tokens uh for the smart contract deployment also after deploying we interacted with the smart contract which was basically basically a mutation function and we were storing a value uh We've also even covered uh Explorer basis and checked if the smart contract was actually deployed on the test net and furthermore uh the various transaction calls that were made um apart from that um yeah hoping this walkthrough um was a good start to getting onboarded onto the mantel's current test that uh we encourage everybody to start building cooled apps and uh any sorts of project that you have in mind on to the material test set and reach out to our team with demos and any sorts of questions um remember to keep your keys private obviously now nobody from our team would ask you for a case ever um yeah keep building keep shipping um you feel free to reach out to us on our Discord um thanks again and see you in the next one