New Ethereum talks, every Monday. The week's conference uploads by event, in your inbox.

Loading player…

Revise - Make Dynamic NFTs

ETHGlobalMon, Oct 9, 2023, 12:00 AM

ETHIndia is a hackathon — a movement with the goal of inspiring and fostering a community of builders promoting technological advancements for Ethereum. It’s a place where the leading minds in the Ethereum ecosystem are uniting with 1500+ builders from around the globe to build decentralized applications for the future. And we invite you to be one of them. Help us build a garden where everyone is self-sovereign, where everyone is an owner, where hierarchies don’t exist. ----------------- Follow us: https://twitter.com/ETHGlobal​ Check us out: https://ethglobal.co​m Email us at: hello@ethglobal.com

Transcript

foreign [Applause] [Music] we're going to be doing a fun tutorial creating Dynamic Pet nfts to begin we've created a Blog article that gives you a high level overview as to what we're trying to do today we're trying to create a pet whose mood changes and we want to update this in the back end to metadata as well as the images regarding the pet be trying to update those things to achieve this we're going to be using revise and we're going to be using revises SDK we'll also be able to see the revisions using revise um on the on the Verizon dashboard and I'll walk you through all of that to show you effectively what we're getting to we're trying to make our nft change dynamically from image to metadata to other things and all the revisions will be shown um within the within your own revised dashboard if you do go ahead and read this blog article at the very end there is a guide you can follow which will take you to a notion page and this is the end-to-end guide with code Snippets and everything for you to successfully Implement your own Dynamic Pet nft to begin we're going to be going to this GitHub repository which I already have open here um we are going to clone this repository into somewhere on wherever you want to on your computer okay clown and paste that perfect I am then going to go into this directory CD nft tutorial one there we go and I'm going to open this and my favorite code editor so for this you're going to be needing node installed you're going to be needing some um equivalent of Visual Studio code or some code editor um and otherwise it should be pretty straightforward so going back to our notion I'm going to keep the notion beside um just so that you can also refer to it as I go through this video um but this should be fairly straightforward um what we've cloned is we've flown the boiler we've flown the boilerplate for revise and setting it up setting up revised within your code editor it's quite straightforward now first thing we're going to do is we are just going to open a tiny window over here oh it's going to go npm install to install all the node packages so four packages perfect the next thing I will do is I am going to create a new file called index.js this is going to be our main file that we're going to be using to Mint our collection to create a collection and also mint infd to it so I'd ask you to go ahead and copy this I'll walk through this code very quickly we're effectively looking for the Verizon SDK which we've installed we're going to be generating our token and pasting that op token over here and within the Run function is where we're going to be pasting the code about creating a collection or minting nft so let's go ahead and create a not token to create your alt token go to generate API key section of notion and we if you just click on this link over here it will open up this click on get started if you haven't created an accountable device um you will have to register which is a really straightforward process if you already have an account like myself it will just take you to your revised dashboard directly or you might have to log in um this is revised dashboard it shows any nfts you've minted that you can go view you can also generate API keys or you can explore a documents so in our case we're going to be generating an API key provides doesn't store any of your API keys so it's once you've generated it one time please store it somewhere and if you forget it you can come and generate another one so I'm just gonna copy that and I'm gonna paste it in his side over here perfect okay and then the next thing I'm going to do is I'm just going to close this um leave this web page open because you will need it it's going back over here we're going to copy the code to create our own collection I'll just go copy that and paste it in here and name and URI have to be unique so in my case I'm just gonna call it uh testing akashes pet Dot and for the URI it can be alphanumeric no spaces and no special symbols are allowed or special characters allowed so I'll just say um homie oh yeah Tommy is akash's I said URI okay perfect and the next thing we're going to do is we're going to paste in the actual nft data so that we can mint the nft hold before we run this file so we're just giving the image so if we click on that image quickly we can see that currently we're setting the image to be neutral so just keep that in mind we're saying my pet's name is Tommy token ID of one a description and we're getting some attributes like attack mode and stamina and we're passing the collection ID so if I save this [Music] um I put my authentication token perfect and I'm just gonna go node index.js to run it perfect you know it's been successfully minted when it produces an ID do not clear your terminal because this ID is going to be important for the next part we will quickly go back to our revised dashboard we'll do a quick refresh I currently have four nfts it should become five we have five nfts now you can see my pet Tommy and testing a cautious pet as the collection has come through if I just go and click View I can see my pet Tommy is neutral at the moment um and all the data around it including the revisions the layout might be a bit different there we go Provisions so this revisions will get updated or should get updated if all goes to plan at the moment so the next thing we're going to do is we're going to come back to visual studio code and I'll bring back the notion and we are now going to dynamically change the mood of our pet so we'll create another Javascript file called blue.js and what we're going to do for mood.js is where we're going to add the dynamic capabilities to our nft so I'll go ahead and copy all this the first three lines have already has the same as index.

js we need to paste our authentication token it is Then followed on by options of the different types of mood with different images and we're setting a random number generator random to Randomness we're setting what the mode should be uh we're also saying that the mood should get updated every two minutes by listening to the API um and we are saying that the update needs to happen to the nft with this ID this needs to get replaced so we will replace this with the nft ID that's popped around down here perfect and for the um and it sets the property um for mood based on what the mood is going to be sets the image as a new image for the mood and it saves it now the do not forget to paste the authentication token that you had from index.js I'll just quickly go there and I will copy that kind of sorry here and delete all this and paste that perfect just have a quick look yeah looks great I'm just gonna save that and it's pre-formatted everything looks all good and now what we're going to do is we're going to start to dynamically see the changes happening with our pet so if we just go back over here you can see there's only one revision and there's not end the mood is Happy um and the image is neutral so I guessed um go over here and if I go node mood .js there we go my pet Tommy is now neutral so if I go back to this one if I do a quick refresh we will see that it's been in revision so I went from it went I actually went from neutral to neutral so it's not ideal um but every two minutes the Civil effectively get updated so originally it was happy is what we had passed and now it's become neutral although the image um was happy and we had a bit of a mix up there but every two minutes this will change so become neutral become happy it'll become sad um and I'll show you one of the other pets that I did this on it had six revisions done and as you can see um it shows each one of them neutral happy happy neutral A Pet's really happy generally so yeah that's um that's everything for today um well done for minting your first Dynamic nft if it was your first one and well done for um maintaining your first Dynamic Pet nft do tell us what you've named your pet on our Discord or our Twitter send us a photo if you have any in real life pets and come hang out with us thanks foreign [Applause]

Automatic transcript — names and jargon may be misspelled.