Polygon 🛠️ Gate Your Dapp with a Polygon ID Verifiable Credential - Steph Orpilla

foreign [Music] welcome to the last Workshop of the day so you can get to hacking soon I promise this is about getting your dap with the polygon ID verifiable credential so we'll be getting into polygon ID which is like um an ID solution and we'll talk about verifiers issuers all kinds of things this is polygon ID uh I thought I had a oh there it is my slides got all mixed up this is what I get for messing with them right before I'm going on but GM everyone I'm Steph orpilia I'm a developer relations engineer at polygon I'm also oceans 404 on Twitter if you want to tweet or anything or link up there but today I'm talking about polygon ID and polygon ID is really cool to me because it uses ZK proofs and it lets users prove pieces of their identity with verifiable credentials so that they can just present proof of a credential rather than giving up their private data so that works for things like birthdays country of origin and then any customizable use case that you can think of but it's all in the sake of preserving privacy for users and that's really important when we're doing things on chain right because things on the blockchain are permanent and most things aren't encrypted so it's really great to be able to just use a credential and ZK proofs to be able to prove something about you without having to actually put that information on chain okay so this is the first example of something this is just a data type it's called job held and you can imagine this as a credential it has some different fields so it has employed by technical role and start date so these are some of my examples of job held potential credentials so I'm currently employed by polygon Labs it is a technical role so that Boolean is true and I started back in May last year previous to that I worked at Amazon it was also a technical role and had a start date and before that I was at Sony so these are three examples of credentials that I could hold in my wallet that would be of the type job held credential this is another type of credential pet ownership this is my dog teddy um so has dog could be a Boolean field this would be true has cat for me is false I'm allergic but pet count is two so you know I have at least one dog and my peg count is two so it's a little mysterious but all of these are just claims and how do we know any of these claims are true so I could say anything I could say I went to the moon I could say that I work for NASA but how do we know if any of that's true and we know it's true because it's been issued by a trusted issuer who has given a verifiable credential that is actually signed by that issuer if we trust an issuer we can also trust that they're only giving out trusted verified credentials so these can all become trusted issuers or verified credentials by being signed by a trusted issuer so if I said I was employed by polygon labs and polygon Labs actually issued me this credential we could think okay I trust that the company's only issuing this credential to people who actually work there same for the other two places I was employed by so this is just an example is this is sure trustworthy like could Teddy the dog say that I've been employed by NASA since 1950 probably not because we don't trust that he's a trusted issuer and this all gets into the triangle of trust and the reason why polygon ID or any type of did works and it all comes back to issuer trust so if the verifier can trust that the issuer only issues credentials to people who satisfy whatever conditions um they have then they can they can accept ZK proofs based on the credentials that they've issued and so in practice this is what it looks like so the issuer in the job held case would be George my previous manager at Amazon hey George he's not watching he's he's like still way back in web 2 but good for him so George could issue me a verifiable credential of job held he can say that yes I was employed by Amazon my role was Technical and this was my start date then a verifier website or dap could come and say hey has Steph ever had a technical role in a job yes or no and I would have something in my wallet that would say true I have had a technical role before so I could present this credential and create a ZK proof based on the credential that says that I satisfy the requirement of having had a technical role so you can think of a verifier that might want to do this maybe it's LinkedIn and they want to give me a badge for being a technical developer or maybe it's my next job and they want to know if I've ever coded before for so they're also interested in this but the power of polygon ID is that these issued verified credentials can be used unlimited Times by different verifiers and they're all using that same data that only has to be issued once so you might be thinking like how do we prevent Teddy the Dog from being a trusted issuer we don't actually have to so the verifiers can specify which dids are trusted issuers so you can see in this code allowed issuers is set to all so for this case anyone could actually issue this type of credential and the verifier would accept it but you can imagine that down the line maybe a dow could manage who is a trusted issuer or any other solution to kind of like improve the trust maybe there could be even scores of issuers to make sure if someone had issued a bunch of bad verifiable credentials they were bumped down in the list so I don't know if anyone ever watched Harry Potter I did I watched all the movies I read all the books if I'm on a plane chances are if I have something mindless too I'm watching Harry Potter but anyway Harry Potter has one of the most famous issuers of all time and that's the Sorting Hat so when someone new comes to Hogwarts they put on that hit the Hat an issuer says which house they're in so Harry is famously like on the fence between Slytherin and Gryffindor but then at the end the issuer uh which is the Sorting Hat is like hey harry which house do you want to be in and he says Gryffindor so he's kind of like self-selected in but the issuer which is the Sorting Hat gives him that Badge of like okay you're in Gryffindor and so you can think of that that house as like the verified credential and then Griffin or the issuer is the Sorting Hat and Harry is the person holding the credential and he can reuse that verified credential in lots of different places all over Hogwarts so maybe he's getting into the common room and he's using a Magic Door that's the verifier and it unlocks the Gryffindor common room or maybe he's trying out for the Quidditch team so I can't remember what this guy's name is is it Lee anybody know there we go the team captain can say only gryffindors can be on the team so he's checking against that verifiable credential again for Quidditch team eligibility so that's just an example of how you can reuse these credentials anywhere so what does this look like in the polygon world it's not quite as fun as the Sorting Hat unfortunately but this is what your data looks like so I have three different different verifiable credentials in my polygon ID wallet which is a mobile app uh the first is like almost like an event ticket proving that I went to polygon at the pit which was an event the next is an example of proof of personhood this actually hasn't been implemented yet so if anyone wants to connect World coin and polygon ID that could be a killer hackathon project but all of this data is stored in your wallet and it holds the VCS and interacts with verifiers once you need to prove your identity so this is what it looks like as that VC is issued so your sense you scan a QR code and it says accept credential offer then the claim is added to your wallet and it's put in your data and then you have some information about the VC that's held directly in your wallet and then this is what it looks like when you go to actually verify claims so verifiers or dapps will have a QR code on their website as well you'll scan the code and it'll ask for a proof request of something specific so in this case it was polygon ID membership are you part of this Dao yes or no and then it generates a proof for you so you don't have to code this or anything it generates a proof that actually shares the the answer to this question so yes or no and then you can manage this from your wallet forever so if you don't have the polygon ID Mobile Wallet app yet you'll have to get it in order to kind of like interact with the the demo site and any of the other polygon ID sites right now we just have a mobile wallet we don't have a desktop wallet yet but that's another cool hack idea if anyone's to build like a desktop polygon ID wallet but currently there are two ways to issue claims so to be the Sorting Hat this is the easy way there's currently only two two types of claims that you can do the easy way which is by using the demo issuer UI so the first one is an age credential so that's what I'm going to demo today and the second one is a country of residence credential so some things you could check with an age credential or like sample use cases are are you older than 13. a lot of social media sites like Tick Tock and Instagram and be real the first thing they do when you log into their app is they say add your birthday you have to be over 13. so that could be a cool use case for adapt as well if you're creating like a social dap or maybe you're creating adapt that's just for kids and you say you have to be younger than 18 in order to like sign the yearbook or post a message so you're making sure you don't get like creepy adults and then for the kyc country of residence credential maybe you want something that's specific to Canada um I'm like loving all of the stories that Canadians say I think it's so cute uh so maybe you you say sorry only people in Canada can use this app and you have to prove that your country of residence is Canada or maybe you're creating like an election app for a specific country and you say you have to be a resident of this country in order to use the debt or maybe it's something like Country-Wide and it's only for EU residents anything like that could work for the demo issuer UI because it is able to create these two types of credentials so I'm just going to really quickly show you um the demo issuer UI so it looks like this oops come on Wi-Fi so you sign in with your polygon ID wallet and then you can create claims just to issue yourself as demos so like I said you can either create an age claim or a country or residence claim I'm just going to give myself an age claim so it auto fills all of these fields but the main thing you want to think about is the data that you're putting in the actual plane so this one is for birthday I'm just going to add my birthday or actually no I'm gonna add a slightly different version of my birthday this birthday is August 24th 1994. so I'm submitting this and then it'll create a QR code so I'm opening up my polygot ID Mobile Wallet app and all I have to do to get this QR code in my wallet is scan the QR code so it's asking to issue this credential to me in my wallet I'm just accepting the credential and it's added so now I have this birthday credential or this kyc age credential that I can use all over the Internet and that's kind of the basis of our verifier which is what I'll show you next okay actually before we get to the verifier there's a second way to create or issue credentials and that's by using our dockerized issuer node so this is what you'll need to do if you want to create custom credentials like let's say you wanted to issue people how do you think basically that's not an age credential or a country credential you'll have to host an issuer node it's dockerized which is kind of nice and then you can just kind of like host them publicly with nrock and that's how you can kind of like demo your app if you want to go this way so if you want custom issued credentials scan these two links that will take you to the code for the issuer node and also the docs to the issuer node and I put all of the slides by the way in the Discord channel so if you missed anything or need the links they'll be in Discord okay so going back to the triangle of trust we've learned about two things um the issuer which is either that demo issue or UI or the self-hosted issuer node also we know the identity holder is you and you hold those credentials in your polygon ID Mobile app so the last thing that we are not quite sure about yet is the verifier and this is what receives those ZK proofs and checks against them so back to the Harry Potter example we saw the demo verifier and what it unlocks in this last example the demo verifier is actually a VC gated website so it's a verifiable credential gated website and it unlocks a secret dap or app that you can only see if you've proved your birthday so this is what it looks like and the request is prove you were born before 2023 in order to view so I think that's everybody in here no babies are hacking at each Waterloo this year but maybe they could eventually maybe vitalik's kid honestly if he had a kid uh so if you need to prove that you were born before 2023 to view you would be doing something like this in the code so this is kind of like a really simple um query and the credential subject is on line nine it's birthday and you see this like funny looking query language on line 12 it has like a dollar sign LT which stands for less than a value so less than 2023.0101 so we're checking for line nine the birthday field is less than or before January 1st 2023 and so this is the proof request that will send from the front end via QR code and this is what it'll look it'll look like on the front end so a modal will pop up it'll say scan this QR code from your polygon ID Wallet app to prove access rights and if you can scan this and successfully generate a ZK proof it'll send back a successful authentication response to the website and you'll see the next page and so this sounds a little difficult but it's not because I created a template for you all on GitHub and what this gives you is all of the front end and also the server code for creating this verifier website so with the last 10 minutes I'm just going to kind of like walk you through what this template looks like and what it does and the parts that you should modify for your own dapps oops okay so this is that GitHub repo you can see there's two folders in the repo there's a front end and a server so the the great things about this are that it's built with react.

js which a lot of people know because it's just like a pretty common JavaScript library it's already a VC gated for you with that polygon ID age credential we saw before the birthday credential it's fully connected so that the DAP that you hide behind the VC credential is already connected to a demo dap with examples of how to read from the blockchain and also write to the blockchain so you should only have to kind of like do some rank inciting and just a slight bit of open heart surgery when you're like adding your own smart contract in because it's mostly done where you'll just see examples it's also already styled with configurable components from Chakra UI when I'm hacking I I like go down this Rabbit Hole of all just create the components myself and then I realize I don't have time so I just made that decision for you to make it easier and then um it's also just like ready to interact so it's connected with rainbow kit wallet and it is connected by default to polygon networks but you could replace those with anything you want so to get started with the template you'll just come to this GitHub and you'll say use this template and you'll click create a new repo it'll have you clone the new for trepo from GitHub down and let me show you what it's got so I'm running it right now it has a server and also a front-end the server is making two different API calls to the verifier sdks of polygon ID so let me just open the code quick so this is the server this is the index file it has just like a general welcome page it's really not doing anything here so the server runs on localhost 8080. this is just telling you the two available API routes so the first one is get off QR and that shows you that QR code that generates the proof that's sent to your wallet or generates the request for the proof I should say and the second one is API verification callback that's what uh sends the Callback to your front end saying whether or not you successfully authenticated so you need to be running this server in order to be able to get and post this data to polygon ID oh and then the last thing to mention is that when you're running the server this is in the instructions in the readme as well but you'll want to run nrock on the server so that you can have a public URL for the server because of that callback to the front end um otherwise you'll have some issues with cores and also the polygon ID app has to know about the public URL of your server and if it's just on localhost it's not connected to the internet so the polygon ID app has no way of saying hey this is the response from your API call so that's the server it's pretty minimal it's just built with Express and also sockets there's nothing in the server you should need to modify except for one file and that's proofrequest so inside of proof request we see that credential subject birthday and the query that I showed you in the slides before so this is that query of birthday is less than January 1st 2023 if you wanted to you could change this date or you could totally change the query from kyc age credential to a country credential or a custom credential as long as it existed already in some type of schema so that's the server and then the front end is what's interacting with the server so I'll just open the readme first so each of these folders the front end and the server also has their own readme with a few more instructions um but this is just that page that is created for you you know what I'll actually just go to where I'm running the front end locally which is localhost 3000 so this looks almost exactly like that other page that I had except for this is kind of just a full stack template version so I'm just going to quickly prove my access rights to this page with my wallet so as you saw I already created that kych credential and gave myself a birthday that's definitely before 2023 so I should be able to authenticate with a proof and it looks like it's preparing off so once it starts running authentication yep it runs the spinner it said verified proof and it shows me the secret page or the VC gated page which is actually adapt and like I said what's cool about this is this dap is already connected for you to the polygon ZK evm testnet so it's got the wallet connect button all of that's done so conceptually all you have to do for all of your applications is write this smart contract with all the business logic and then kind of Port it into the step so in the front end code you would just start changing out just like the the front end things so I'll show you um so I had a demo smart contract my dap that's behind the the gate is just a counter app so all it's doing is I push the button and it's incrementing the counter up one so I sign it goes up to 19 and that's all tracked on the blockchain in the smart contract basically what I wanted to do with the counter dap was give you an example of reading from the chain so this this value 19 is read from the blockchain and then writing to the chain with the increment counter that's updating a value so you have both of those examples when you're doing anything with your smart contract low battery okay so so all of that dap is happening the DAP code is happening in the VC gated app file so feel free to like gut all of this or change it to reference your smart contract I just had this smart contract address here by zkevm smart contract address so if you change this out then you should also be able to go through and update the read function and also the increment counter is the right function so you can see there's already a con a read contract function so all you would do is change out the function name to whatever your function was using and then the other thing you would update is the ABI I just put mine here it doesn't necessarily have to be there it's just where I rooted it so the ABI will just have all of the available functions from your smart contract so I had two called retrieve and what was the other one increments but all of the polygon ID stuff is created for you so the only things you would be customizing really are the queries and the type of credential so changing the age credential to either country credential or your custom credential that was issuered issued excuse me either by the the demo issuer node or your self-hosted node yeah so again this is that uh QR code to the template hopefully it's super helpful but if not I'll be around all weekend and also in the polygon Discord uh to answer any questions and help I love building so I'd love to help you if you run into anything no question is too dumb I promise um and actually if you use this template you're automatically in the running for two of our prizes I just have to plug the prizes really quick we have ten thousand dollars in prizes this weekend so three thousand for a public good with account abstraction so if you wanted to double up on prizes I saw that uh gnosis safe has safe apis they're also giving away two thousand dollars for hacks with account abstraction so if you built something with safe apis on polygon you'd be eligible to win like five thousand dollars pretty good next one is best most Innovative hacks deployed on polygon zkevm ZK evm is uh what I just showed you so this counter app was deployed on zkevm zkgvm is so similar to ethereum that all you have to do when you're deploying to it is change the RPC URL so instead of uh Gorly if you point to polygons eke evm testnet that's the only thing that changes which is pretty awesome so you don't have to worry about code you just change the string so the best tax on that are also eligible for 3K and then I just added some random ideas that I had I feel like eip6551 is so interesting the nfts that can own other nfts so super interested in any hacks like that or maybe you're interested in Cross chain hacks uh the protocol before me just did a really cool cross chain hacks Workshop so work with that if you want to do a cross chain hack um the next one is directly related to ID which is what we just talked about so two thousand dollars for best use of polygon IDs verifiable credentials so VC gate your adapt just like what I showed you whether it's an age credential a country credential or something custom and you're eligible for 2K there and then the last one is mostly for beginners but I plug it anyway because everyone can win this prize all you have to do is build in public so we want to see your tweets about what you're building so that my social media team can go like whoa eats Waterloo looks so fun uh so all you have to do is Deploy on polygon and post a tweet about it linking your smart contract to your GitHub this is the specific link so if you open this link it'll pre-generate the tweet for you so if if you're like oh I gotta submit my hack tomorrow uh all you have to do is click this button and update literally one thing this should be the easiest thing you do all weekend add your GitHub here tweet it out and you'll win a portion of that 2K all right I think that's everything for me today thank you so much for listening and like I said I'll be around all weekend ask me for help I'm happy to help thank you