ENS 🛠 Identity in your dApps - luc.computer
ETHGlobal·Mon, Oct 9, 2023, 12:00 AM
Join luc.computer of ENS for a workshop titled "Identity in your dApps" Thank you for joining us for ETHSanFrancisco—our first west-coast hackathon in nearly four years. This was officially our biggest event ever 🎉 👥 1700 attendees 🗺 from 46 countries 🌱 38% new to web3 📮 284 projects And: ETHGlobal just turned five! 5️⃣🎂 Thanks to every single one of you for making this community great 💙 --------------------------- Follow us: https://twitter.com/ETHGlobal Check us out: https://ethglobal.com Email us at: hello@ethglobal.com #ethereum #web3 #blockchain #eth
Transcript
foreign [Applause] [Music] there we go I'll hold it I think we'll figure it out can everybody hear me sweet okay so good morning afternoon or evening if you're watching this from the recording um but to those of you in the room I suppose it's just afternoon um I am 0x225 F1 three seven one two seven d nine zero six seven seven eight eight three one four BC 7 FCC one F three six seven four if I make a mistake correct me 6a3c3b5 otherwise known as Loop dot computer or looseman study if you want to go the OG ens way and that right there is am I too loud the core premise of ens ens the ethereum name service is simply the ability to convert human readable names like nick.heath I should have probably full screened this huh um into machine readable names such as 0xb8 C2 C2 okay I will I'll cut you the pain all right um this way and obviously backwards sweet so ens allows us to turn the the general dap experience that would look like this right this is my 0x225 f1373 you know the drill to this loop.computer my DNS name I've been clicking on the wrong slide so this one's behind lovely it's going great okay so uh if you're here and you already know yes I hope most of you do you might want to keep watching because I do have some cool stuff to show in no particular order and that is going to be chaotic um let me run you through the agenda first I'm going to talk about what ens actually is and how the core logic works all the fun stuff second I'm going to be talking about resolvers and oh the DNS integration there we go that went great um DNS integration for all sorts of fun stuff you can do with that um records and resolvers and essentially how text records work storing data on chain off chain resolving and all that fun stuff cost changing our operability like I just mentioned um how to implement it and last but not least if you are new here how to register your first DNS sweet um before I do all of that I want to point out some Milestones um we're absolutely thriving we've currently got 2.75 million names registered which is ridiculous over 506 Integrations that I am in group chats with so I think that kind of explains my suffering but there's a ton more and if you do end up building a super cool project and you end up scaling and you end up needing my help Beyond these walls then feel free to send me a message we'll start up a group chat and I'll happily help you out um and 593 000 different people who have their own ens name sweet so let's look at another practical example right because we saw the lovely one I showed earlier and you're probably all familiar with apps but let's do it anyway um this is tic-tac-toe a stupid dap that I built a hackathon project back in uh two three months ago now uh in Paris I had a bit of time left over and I said screw it I'm gonna build Tic-tac-toe and solidity because I'd like to not sleep tonight and um yeah it might not look good but it works and if you look right there in the top right corner uh this screen is too much brightness um using v3x study which is back then my ens name ens by the way lets you swap between what currently your primary name is and I'm pretty bipolar so I keep switching between v3x study loop.computer and looseman study but all of those will end up at my address so that's me right there in the corner I should have probably zoomed in earlier um so yeah now your your favorite dap obviously has all this cool stuff um and you go okay is that all ens does Lane but bear with me here you want to invite your friends so you press create game and then right there you can type the address or you can type their ens name so you type in nick.
heath because casual Flex I played a game of tic-tac-toe with the founder and um right there his name his profile picture and his address show up and you can verify it's the right nick.e if you're not getting rugged it's a tic-tac-toe game who cares um and then you press an invite and then he accepts and then you can play Tic-Tac-Toe with Nick daddy and regardless of my shitty tic-tac-toe skills not my strong suit okay I'm a developer um this is the core idea of ens right we have my name there his name there and a profile pictures sweet so what you saw there the simple dap decentralized app um shows just one of the things ens does which is usernames and profile pictures but we do a fair bit more so this is me lizman studyth again lucius.e 50x study all the all the fun stuff um but it stores a whole ton more than just my cool profile picture and my address nick.heath is a better example because I don't have half of these setup uh source's eth address sources BTC address is Doge address is Litecoin address his website his email his Discord his Twitter his Reddit his telegram his GitHub and who he delegates to or at least his delegation page if you want to know more about him and being part of the Dao and it's a step Forum link who cares um and obviously most importantly the Avatar and specifically this is a in a specification to link towards uh his nft that he uses as his profile picture but this could be a simple HTTP URL this could be https this could be on our Weaver this could be on ibfs so how does all of this work ens is pretty simple we have a couple core contracts and they work as follows the core contract this is specifically the dot eth section um stores the following information the name blue Smith study the registrant the person who is currently in charge of the domain so that is me zero x225 f1373 okay yeah when it expires and the current resolver so a smart contract address that stores the rest of the information the Avatar the telegram the Discord all the other fun stuff and the in this delegate link the only difference between a DOT eth name and a DNS name or a subdomain is simply we don't store the expiration date because it's handled externally um so it stores that for nick.e for vitalik.
if those are real records um and and for everybody else so what you do is you you go over there and you're saying hey I'm looking for nick.if and then the smart contract says all right here you go nick.eath registrant expires and resolver and then what you do is you look at the resolver or at least the tooling does this for you you don't have to put any effort into this um it grabs the resolver address it goes to the contract because it's a smart contract and the smart contract then gives us back all of the fun information we were looking for but this is a little cooler than it seems this is the public resolver it's a simple smart contract that has a key value pair and key value pair storage and you can edit your records in there but this could be your own contract which means that you can write your own logic and you can change your profile picture depending on the day of the week the current balance in your account happy face sad face very sad face and and whatever else you'd like um and a ton of other cool stuff so this allows us to do all sorts of fancy things I I hear you say like this is cool fun but we're still stuck underneath mainnet um I want to find the new stuff the shiny stuff the fancy things right I want to build on all these things I want to have you know I want to play my my hackathon prize uh bingo and I want to take all the boxes um so so do we not the hackathon prize thing but the the playing with the fancy things right so I've got good news for you you can right you can play with all of the fancy things we can play with optimism we can play with polygon we can play with ghosts you can play with whatever the hell and off chain um the way we do this is using a spec uh that was written by a combination of people but one of which was nick uh our founder and it's the cross chain interoperability protocol I misspelled protocol shoot this presentation is old oh work me okay well ccip for sure let's just call in ccip and forget about the typo um so the cross trainer operability protocol um allows us to do all sorts of cool stuff it allows us to fetch data on chain whatever chain you'd like off chain um on a roll up on a layer two using zero knowledge using https if you you like April Fool's Day jokes from the ietf using HTTP CP the hypertext coffee pot control protocol using your toaster or using anything else which gives you a lot of control um it's pretty cool so so how does it work thank you for photographing my face this is going to haunt me isn't it um so this is ccip I would recommend photographing that one um and essentially this is a simple example of what ethers does when you store something on optimism so the way that it works is the client Library reaches out to eat mainnet grabs the resolver from the ens core contract goes to whatever smart contract is attached to in this case 0x497 whatever and the smart contract just throws a cross chain interoperability error or in this case off-chain data um it says this is optimism this is the contract on optimism and this is the call data you should give to optimism and then optimism will tell you where to go next so then it goes back to ethers ether says oh shoot this transaction failed it was an off-chain data error okay and then it reaches out to your HTTP server to your toaster to your coffee pot or to optimism which all scale just as well um it goes to optimism your optimism smart contract and decides what to do with it returns your avatar returns whatever other records you'd like to set and voila it works zero extra effort on your part might I add so all of this is happening behind the scenes all you do is use ens name in your react app and it magically works it's phenomenal it's also half of my nightmares but I make sure that it's phenomenal for you guys so I recently built a cool example of this uh using off chain lookup I'm running an HTTP server it connects to Twitter it simply does some lookups and it has some heavy caching on it because I'd not like my API key I've used it's called twitter.ngo it's a web 2 domain that I ported over using dnssec um and the way that it works is you just go to any Twitter username.twitter.
ngo um the ensmart contract on Main Nets or previously on Gorly um will then tell you here's off chain here's error off-chain data lookup this is Luke's server address this is the data you need to feed it and then my server will start running reach out to Twitter fetch your Twitter data get your username see if there's an ens name in there do resolution there and then return your address your profile picture in your description and then eventually you get something like this so you go to Nick Nick's Nick s d johnson.twitter.ngo and then everything magically loads in the background and then um so now we have his address his URL which links to Twitter his Avatar which is Twitter Avatar in his description cool so you know this is I don't know I thought it was a fun use case um so this works in almost all the libraries out there uh ethers wagme in sjs that was supposed to be on the same slide I don't know what happened here my presentation's going great um ethers wag me in sjs web3js web3j K ethereum web3pi go ens whatever library is on this list if your library is not on this list message me and I'll add it next time um but all of these support ccip and it's super cool so how do you use this right forward resolution super simple this screen doesn't like my cool colors I guess it's too white um contrast but for ethers you simply just say provider.resolve name you give it v3x.heath and it will output you 0x225 f137 okay you get the drill and with wag me the react Library hooks for ethers you simply do ucns address v3x studies or the actual address and it will return you with the address sweet and you can also do reverse resolution so if you have the address you can turn it into a name and a profile picture using ether's lookup address and wagme's use ens name or use ens Avatar and a bunch more um obviously I there's so much cool stuff to cover I haven't even talked about subdomains but that's a whole other rabbit hole and you can build resolvers to control subdomains and we have a new thing coming out the name wrapper that's essentially a resolver contract that allows you to sell subdomains as nfts and control them that way so you can transfer them to people and make it fully spec compliant um if you'd like to find out more you can check the documentation this is docs.
domains I technically maintain these uh they need another cleanup but that's all right if you have any questions outside the docs just come to me and then I'll happily help you out um now if you're sitting here and you're going this is kind of cool uh I don't have an ens name seems pretty cool I'd like one how do I register um you can always come to me I'll happily help you out or I'll even give you one but otherwise you can use the ens manager or any of the other cool things so there's the Enos Ferry it's a application written by one of our community members it allows you to give names at lower gas costs to new users so instead of having to purchase the name then change the records to the other person's address and then transfer the thing and then get them to set it as their primary name you can just do it in one transaction which is super cool still two but cost less gas um and it looks nicer it uses the new design system you can do it directly from rainbow rainbow the mobile app has a built-in coinbase hands out subdomains of cb.id because again any valid DNS name is a valid DNS name and you can verify them using dnssec if you just enter your.com or dot IO or whatever in the ens app it will magically tell you all about it um lens if you have a lens profile at dot XYZ behind it loosemans.lens.xyz and magically it'll work as your EMS name Argent does it with argent.
xyz there's a whole bunch more cool stuff there's also some some Alpha I'm going to drop again yay we have the new Alpha manager coming out soon TM it's fully mobile compatible and like we have a whole new design system for it because our current manager is slightly outdated so we've put a ton of effort into this one it has cool animations it does caching it does all sorts of fancy stuff but it also works on desktop and if you want to test it out and you happen to have Gorly eth then you can check out alpha.inst.domains there we go um my slides are also on my website loop.show so can't be that bad uh Alpha ens domains I'll say that one more time so the events manager in its current state uh let me walk you through it real quick so this is the NS manager I know the alpha one looks cooler um app ens domains right seems pretty self-explanatory what you do is you click the box right there you type find your name alice.eth if that was hypothetically still available and then you go to register your name um so the way your next names are registered is there five USD a year as long as it's five characters or longer um and then there's gas fees Etc depending on the network situation so you might want to register for multiple years because it might save you some gas I think currently it's not too bad but it used to be pretty bad because ethereum so yeah you register your name uh it does it in two transactions the way that it works is it uses a commit reveal system so it hashes your name doesn't really matter but it does sorts of cool stuff so it prevents people from front running you so if there's anybody between you and the ens smart contract whether that is wallet connect whether that is inferior or Alchemy or your fancy RPG provider or JavaScript library or your ISP they're not going to know what name you've registered until you've already gotten the name which is super cool um you wait 60 seconds because of the commit reveal situation and then you do the second transaction send over five USD worth of ethereum and then then you have your name this is the new manager already um it looks super cool I'm too excited about it so it looks cool you sit there you look at this and you go okay how do I set my avatar right um it's not that bad this is the old manager you go over to the the fun add or edit your records button you click it and then you go to the Avatar which is like down here somewhere um you set it in this case I set it to an ipfs link from nft.
storage um and then that's it you just set your Bravo picture and you're done sweet one last thing and all of you are probably going to harass me for this one afterwards but that had to be in the presentation um I'm looseman study v3x studies bluetooth computer Loop dot contact whatever luismanzanel on Twitter um if you have any questions I'm also hacking I'm upstairs at the moment I'm building a whole cool thing or at least planning on working on I don't know we'll we'll figure it out um so yeah keyboard Gober um if you have any questions feel free to reach out to me I'll happily take a slight break walk around and answer any questions you might have um if after this you you go oh my God I really wanted to build something with ens or I didn't get it included in my dap just reach out loop.contact it's a website it's an actual domain um my Twitter's on there my telegram's on there my email my phone number yes my phone number is on the public internet um and my address yeah I have regrets um reach out to me and I'll happily help you out uh Happy hacking that picture's off the screen and if you have any questions right now you can ask them as well go for it yep sweet so um the way that it works is if you go to the docs we have a template smart contract also on GitHub available um and essentially there's just a smart contract function and all of the functions get called with the name the person is trying to look up so if I write a smart contract for twitter.ngo or I did it on chain what I'm doing right now for verified.heath um what you can do is the Smart contract will just get called and the function will be called with hello.verified.
eth or Foo dot or whatever so the smart contract gets it as a parameter you write your logic on how to reply to that and then the library takes that in hope that sort of answers your question sweet awesome otherwise I'll happily help you out awesome any others speak now or forever no okay you can always ask sweet awesome thank you
Automatic transcript — names and jargon may be misspelled.