WHERE ARE MY KEYS? Onboarding the Masses with NEAR Protocol - Matt Lockyer

so uh just uh changing pace here um we're gonna have matt up next so matlock here um you probably have run into him uh before at prior eat denver's he's been a steward in the past um now he's rocking out with with near all right and there he is what's up matt hey what's up ken good to see you yeah it's great to see you too except i kind of wish it was in person i know it's it's not quite the same at least we have this are you up in vancouver i am and uh it's actually uh surprisingly sunny today but i'm locked inside because i've been working on my presentation and my demo i'm excited to see it uh you know we've talked about near uh throughout this weekend so far but it sounds like you're gonna talk about an interesting challenge with respect to mainstream adoption which is like like key management um it's it's hard for novices to to grok as they get into the space that's right cool well yeah uh take it away awesome thanks ken and thanks everyone from eat denver for uh putting this on i know it's been hard this year uh doing a virtual event um i'm just gonna set up my screen now okay i can see my own screen so you guys should be able to see my screen so i'll just jump right into the presentation i'm going to be hopping between a presentation and a live demo um so uh where are my keys i'm talking about progressive onboarding with near protocol so basically i will get into that in just a moment um but first i'm going to do a little background so you know who the f am i uh if you've never met me before uh what's in here and uh teach me stuff so i am going to teach you stuff in just a moment i'm just going to be mindful of the time as well so i don't want to be remembered as this guy uh i talk a lot and i do a lot of presentation-y kind of stuff and sometimes people bump into me and they say what wait you're a developer and uh yes i'm also a developer but i do have no problem with talking so sometimes people think i'm just this guy but i'm actually this guy so i'm this guy with a bunch of really cool developer friends and people doing awesome stuff and i'm going to show you a little bit of uh you know the the in person eat denver's that i was a part of um i did some help with the uh the content scheduling and the stage managing in 2019 and 2020. so in 2019 um you know this is a rare glimpse behind the scenes you know we had an amazing event and it was really uh i missed 2018 and i was pretty upset about that but 2019 was uh was really killer i think we had close to 2 000 people lots of fun you know before and after the event um here's some some of us partying after um this was when uh burner wallets were a big thing and we were giving out x die it was pretty rad and who could forget the maker bus breakdown on the way to the retreat that was pretty cool and uh we had some fun and of course i have to put in my my suitcase that i could barely fly home with that was stuffed with so much swag we got like portis tuque buffa corn socks and all sorts of stuff i i could barely close the thing all right and 2020 we were setting up the castle so this is a little bit of a behind-the-scenes look i think it's kind of fun to look at this stuff and here's some more memories from 2020 and some great friends um the mr the buffalo corn there um i was actually in that suit uh when when they were reading that b is for buffalo corn and it was horrific it's so hot in that thing um there's uh tay moynihan up on the stage with the big rainbow stage that's awesome there's mariano and there's brendan from pool together so it's a just a trip down memory lane because i miss everybody and i just wanted to take two minutes it only took two minutes to show you guys you know how much i love the the east denver community so what's a near um so near is obviously a protocol so it's a layer one protocol we have amazing tech and team um we have an incredible developer experience and i have a typo here uh it's scaling i with ethereum i guess so it's scaling like you or i and everyone with ethereum so um we are an l1 but uh we like to think of the tools that we are spending a lot of time and a lot of money and resources on building um as potential l2 solutions for developers so we're building a lot of um of really great uh technology that goes hand in hand with that incredible developer experience making your life super easy to uh to basically scale up with near um and uh that falls under two broad categories the rainbow bridge and the evm so uh we have an evm running on near on our beta net and we have a rainbow bridge that has been sort of up on main net but we're making we're constantly making improvements to it and we're trying to get that that sort of l1 ethereum to you know l1 in brackets l2 near experience and back back and forth across the rainbow bridge we're trying to get that down to like maybe like under 20 seconds going both ways or something like that i don't want to make too many you know big statements but we are we do have amazing tekken team as you can see by this slide right here so um so we're probably going to get it done um so just some of the stuff that's from the early sort of near ecosystem we were mainnet in uh like way back in may but not much was happening because every all the tokens were locked we just were getting our validators set up and getting decentralized that was a big thing for us we wanted to be um decentralized before we enabled token transfers and people to like deploy contracts and sort of transact with any any meaningful value so then in october we did that um so we fully decentralized our network and unlocked our tokens and then we had um the likes of peras uh boot up which is a really cool nft marketplace they wanted to be a identity solution peras actually stands for face um and i think they're based in indonesia but now it's an nfg marketplace and it's really darn cool and lots of people are making uh i think thousands of dollars selling nfts on peras so that's cool to check out and the the folks from perasa are buzzing around uh we've if you jump into our discord and and the the near channel and eat denver we'll we'll hook you up with them and then we have uh something from from one of our um one of our developers at near uh uh eugene he developed berry club and berry club is almost just too complicated to to explain but you should check it out barryclub.io and if you need a near wallet jump by the booth uh the near booth in the virtual castle we're giving away uh you like near wallets with account ids but i'm going to show you some really cool stuff on how you can develop some cool apps in just a moment so uh time to learn okay so um i am going to go over an overview of a few pieces of sort of the the near uh the near sort of account system and these things called access keys i'm going to be kind of working with a lot with those um but before we get into all of this kind of overview stuff um i am going to actually show you a demo of what your of what we're going to look at in just a moment so i just want to make sure i've got enough time got plenty of time okay hold on gotta get out of here okay so uh okay what i'd like to show you is and remember this is a demo this is for developers this is for you this is a technical workshop so i'm going to be explaining as i go along like what's happening here um it it does look pretty cool but it's not a slick product demo this is actually um this is actually an app that i kind of hacked together uh since last night only so um basically what i'm going to show you is i'm going to sign in as a guest um so without a near wallet at all so no near to pay for gas none of this stuff i'm just going to sign in with a as a guest now there's something magic that's happening here there is a node.js server i'll show i'll zoom out my screen here and i'll show everybody what's happening i don't know if that'll be enough zoom i hope that's enough because i can't i don't think my screen can take anymore it's pretty good all right i i get a voice from god looks good um okay so we've got node.js server running so when i sign in as a guest that back-end serv server that isn't doing any authentication which i'm definitely going to get civil attacked on um is basically adding a access key to uh to what i call like the app account or the contract account so this is the account that actually deployed the nft contract in case you couldn't tell this is an mft example um but yeah that's how it works so basically i'm going to sign in as a guest and i'm gonna get given a key now this key comes with some sort of caveats uh i'll just go to my presentation here it is uh scoped to the receiving account id so it's basically gonna have method called scope to to basically that app account so it can it can't do anything else it can't run around near and like do a bunch of other stuff it scoped to the methods in the contract so you can actually give it fine grain control and it's given a gas allowance so i can't burn more gas than the app is willing to give me for this key pair okay so now that we've gone over those technical details let's jump back to the app and let's actually sign in okay that was really fast but that was total bs so i'm going to actually uh clear my local storage so you guys don't think like oh near near is actually like some crazy fast blockchain it's not that fast it's pretty fast though so now i'm going to sign in as a guest and there's my little loader and then it should be very fast i don't want this to happen on a live demo oh a transaction timed out so the server's telling me the transaction timed out for some reason so it might be my internet because i'm live streaming right now but basically that you know through talking to the blockchain things have to kind of go to the blockchain and come back with responses so my server my node.

js server that's running locally might have had a little glitch okay on with the walkthrough so now i have this access key account and i'll show you later time permitting in the smart contract it how the key that i just got is like scoped so not even the app can like mess with my funds now of course the key is stored the the secret phrase or secret key or whatever the secret part of the key is now stored in my local storage and of course it was given to me by the server so there is some notion of progressive you know decentralization or progressive onboarding here and you'll just have to deal with it for now but i think you you understand what i mean so i've got a key pair it's it's i didn't store it on the server it's in my local storage but yeah you know web app malicious code blah blah blah but basically if your app is open source the contract is open source you should be kind of generally okay so now what i want to do is i want to take an image so i'm going to copy this image address and remember i don't have any near i just came to this site and i just clicked the button i said give me you know let me let me be a guest um so i'm gonna paste that in i hope i got this right uh i did it before i want the image to show up the actual image link so if i go to there uh oh yay it showed up okay so that's our fearless leader uh near punk ilia here um so i am going to uh sell this i'm gonna raise some money for myself so i'm gonna sell it by setting the price to five near so i'm gonna set that and now the price is set and of course if i go to the market by the way these are my tests these these are the only gifts i could find this morning these are my test gifts and and it was owned by some you know random test accounts and stuff but under my tokens we see that i have this set for sale for five okay so now i'm gonna sign sign out of this account as you can see i have i have zero balance so i'm going to sign out of this temporary key account and i'm actually going to connect with my wallet okay um i am being redirected to localhost that's because just for some weird reason never mind i'm running a local version of the the wallet i just had to take out our test account flow because i want to show you later how we're going to fund an account as if we were funding on mainnet so i'm just uh my local host is actually more like a mainnet experience than the test net so i'm going to allow uh this app to sign in my account so now i'm signed in as sio1.testnet so that's just one of my random you know test net accounts and if i open up my profile here those cute little uh we call them near cats um you can see i've got my balance and i've got sale proceed zero okay so i don't have any sale proceeds because i didn't sell anything but actually uh that's a good point let me um let me add a gift for this person oh yeah so i got some crazy good gifts from nema earlier uh nemazar community manager spirit animal whatever sorry anima uh copy image address i want to make sure i do this right all the time um oh quick quick add break here's here's how cool people that work at near are uh eugene who made berry club sent this to me at like 9 30 last night it's a it's a transaction receipt kind of like a kind of like like event output in ethereum i have no idea why i saved that uh just for fun okay so i'm gonna mint something from this wallet account so now i'm a full i'm a full near wallet i have near to pay for my own fees and i in fact i am going to pay for my own fees to mint this item because if you see this the app is actually charging me one near um so it's basically charging me to um to mint that item so i don't have any free mints so i have to pay for my minting and if i go to my tokens i've got a token here too so i'm going to actually set a price of one for that just dowitt token and put my token on the market from from this account so remember i'm in the full wallet account as i want but let's go back to the market and let's go um let's go hey this is pretty cool right and it's all working wink wink hey by the way developers in the hackathon i made this for you i make cool and then i just give it away so that's what i'm by the way i'm on the devrel team i should i should talk about what that means developer relations we make cool and we give it away um so we want you to build on near and we want you to build hopefully starting from our cool ship i'm saying way too much aren't i oh well sorry guys um so purchase that um so now it's going to ask me by the way every time it redirects it's redirecting me to the near wallet just to approve so you get redirected every time you're approving a transaction that involves some near if you see all these errors on the side it's because i'm using brave and i'm blocking our analytics sorry team okay i hope this is fun for everyone else i hope we get to the code zone okay i'm trying to give myself like a limit here i hope this transfer works actually all right okay so we bought some token i hope so i have my token it's on sale for one there are no tokens on the market where is my token oh i i bought it okay great so this is now a token in my tokens as well so i bought the i bought the near punk token so now that belongs to si1.chestnut okay so great so now remember i'm in a full near wallet account but what about my guest what about the person i was trying to progressively onboard what happened to them i i bought their nft right so i'm going to sign out and i'm going to sign back in as that guest so now i have two out of three free mints and i can go to the market and i see owned by si1.testnet owned by sio1.test.

net but where are my tokens i don't have any tokens but if i look in here i've got five near okay this is pretty cool now i'm still just some floating key some random key that i'm not sure how much i trust this key and i'm just floating around in this app right so but i didn't do anything i didn't even i haven't even seen the near wallet as far as this guest account is concerned they've never seen the near wallet but now they have funds they have funds kind of waiting for them in escrow so i'm actually going to go to the near wallet and you can see my very advanced naming convention here i've got meow mix and meow mix 2. everybody remember meow mix you know meow makes meow mix okay never mind um so i'm going to create a new account and i'm going to actually i'm going to stick with meow mix i'm going to make meow mix 3. um so i'm going to continue i'm going to copy that seed phrase i'm going to do something that nobody should ever do i am going to paste this in my console so that i never forget it um that's bad don't do that with your real seed phrases everybody uh okay so it's copied i'm gonna verify word number nine twelve eleven ten nine yes this is how everyone does it uh when they're testing when they're testing um okay so now i get to an interesting step where it says fund your account now i don't have any near how do i do this okay well you know i'm going to copy the funding address i could go and like purchase near on some shady centralized exchange sorry you know finance and blah blah or i could like do some credit card thing gross um uh but instead i'm going to i'm going to use um this app i don't know what to call this app because i've been working on it for like eight or nine hours straight since last night very late um but yeah i'm gonna use this app i'm gonna use the balance of five near i'm in my guest account remember i have never seen the near wallet except for this part here and now i'm gonna fund that account so there's my little we call these eath cats actually because it's like ethan near riding the rainbow bridge and we're building that rainbow bridge it's coming out like next week right guys wink uh no pressure okay so now this guest account has a balance of zero so what happened oh i went back to the wallet look at this how cool is this okay cool so that temporary funding account that i funded is gonna put the funds into meowmix3.testnet that's awesome so all i have to do is acknowledge that this one-time funding address is now going to be invalid i'm deleting the the funding address and i'm going to finish it okay are we ready oh please this is the end of the demo by the way so i'm glad it worked actually i'm going to do something cool i'm going to log back in with meowmix i'm going to buy that nft from sisi1.test.

net i got some other gifs here while we're waiting some cool stuff we've got lots of gifts in our channel oh maybe that's a little graphic for some people oof looks like it hurts um okay back to the wallet meowmex3.test.net was created okay so now you can continue to the account um and you can see that i've got near i got a wallet bounce and blah blah blah all that good stuff our wallet's pretty cool looks a lot better than since when i was working on it all right um let's do this let's go back to the app sign out connect a wallet but this time we're gonna pick a different wallet we're gonna pick meow mix three so we're gonna log in as meow mix three do-do-do yeah makes me a mix um okay and we have no proceeds or anything we're gonna purchase the just daoit uh we're gonna allow that transfer so it's all pretty fast isn't it wink wink yeah it's pretty cool um so nier's pretty swift so now we gotta sign out now why okay first my token so meow mix has a token now nam-myomex has an nfg meow ah i think that's going to get annoying um so i'm going to sign out of biomix because it's it's annoying um and then i'm going to sign in to uh by the way that this would all work exactly the same way on mainnet so don't worry and the wallet it's exactly the same there's no there's no like weird hidden surprises or anything i mean it's it's like it's an app it's running on our chestnut but it's an app it actually works i'm gonna upload it to github later so copy it copy it steal it build something cool um okay so i go to the market and i see just dowit but now it's not for sale i've got cipher punk which i bought earlier um oh yeah but i sold i sold just out okay so i click on my profile and i see sale proceeds i have one near okay cool so that's being held in escrow just like it was for the guest account so i can decide like who to oh my little hints here i can decide who to send it to so you know what meow mix is a new user so i'm going to send it back to meowmix because you know i have enough near up in that test account so we'll see that go through okay and i have no sale proceeds and then if i go back to the wallet i don't know if i have to do anything it should pull or something but if i just click profile it's probably updated huh no where's my mirror uh i don't know what happened to no okay well i'm not going to spend too much time on that miamix should have gotten a transaction should have gotten one near to i don't know why but anyway that's it for the demo i have no idea why that last part didn't work did i send it to meowmix3 i did i copied the address not sure uh unclear at this moment but i do want to take some time to jump into what how this app is made and all the contracts uh and good stuff so i'm gonna have to slide over my terminal slide it right away maybe um so here is the smart contract so really quick um so a lot of people go oh rost oh i already learned solidity blah it's so hard um it's actually not that hard um it looks a lot like um solidity i mean it's typed there's a bunch of helpers here what's really nice is that the near sdk kind of has like a big a big box of goodies in it um if you want to learn about rust smart contracts on nir you just go to like docs.rs and search for near uh i think you search for near rust rs or something i'm gonna get that wrong i know i've been there oh yeah near underscore sdk go to the latest version i don't know why it always goes to the old one but basically this is all your goodies and the environment variable here is all your goodies about like you know in ethereum it's like your message dot uh sender message dot uh i can't remember dot account or whatever um but yeah basically that's all in here um and we've got json types to make everything friendly so when things when data goes in and out of the contract it's already uh in a nice format is serialized properly for you um so then you have to do some stuff so i i declared a token data struct so i had like these these three different um these three different types here um and then i declared the struct for my actual contract so what's going to be in my contract storage and you'll see that token data oops token data is here and that's just an unordered map is just a mapping like an ethereum so just a mapping from token id to token data and then of course we got um we keep track of the public keys for the free mints and we keep track of the proceeds all right cool um so i initialized my contract when i load it so that i basically initialize the storage and then uh regular nft methods transfer set price not too surprising there's the purchase method um so just check regular stuff i mean it looks a lot like the uh things in ethereum or in solidity excuse me which are like you know require and and blah blah blah i don't even know what they're using these days but they're using something and it's like it's like an assertion so you're just making sure that um that the contract uh stops and gets out if the user can't fulfill sort of like the conditions of the smart contract so um i'm going through this pretty quick but you guys can look at it later there's the withdrawal which basically allows you to say i want to withdraw from this escrow account and i want to benefit this other account so you can actually withdraw those funds and shoot it to someone else i don't know why it didn't work though but uh i'll have to check into that but everything else worked with the nft so you know come on 90 99 um so then there's mint token uh which you have to pay them into token if you have a wallet um but then there's there's guest mint so guest mint is a special function where it allows the special public key that i got from the server originally to mint now you know why get it from the server well you could allow people to sign in with facebook and you know pass a captcha or maybe they have to like you know jump through some hoops to get a public key uh otherwise you'd have too many people getting public keys okay you're gonna wrap this up uh pretty quick there's a view method so what are those well you know what they are from uh from sort of ethereum solidity land they just get the get the data out of the contract so they're your your read methods or whatever or your calls um okay a little bit about the app uh the app is horribly structured uh because i did it really fast but basically i just check if the uh the person is signed in or not and i do a bunch of logic and i just have some components here i'll just go over the high level component overview i've got one that manages the wallet so the actual signed in near wallet one that manages what i call keys which are just the the guest account so when you saw the guest account that was happening in this component one that manages the gallery and the gallery interactions so that would be these these ones right here so when something's for sale the gallery has like a purchase button and one to manage the contract interactions and that is the minting portion so you saw the minting an example of the minting here so that's the contract part and that's it um there's some state management stuff and i mean connecting to the connecting to the near blockchain is done in like a little utility here it's super simple it's just like connect get a wallet get the contract account i mean that's it it's like five lines all right so that's the overview quick spin through the slides here um okay so i think i told you all about why we want to progressively onboard and why near accounts are cool because they have names let me just go back because they have names so it's like having a built-in ens and they have access keys so it's like having a built in noses save so imagine how cool it would be if you could make apps and you didn't have to worry about all these other projects and things and reading all their documentation it's all there in the in the protocol but by the way these are amazing projects and i love you guys um okay so accounts uh blah blah blah blah blah i already did that one i don't know why i've got a duplicate there okay uh so the app flow for existing users i showed you what that looks like you sign in with your wallet if you already have a wallet but look it took me three clicks to get to actually doing something in this app and the actual app flow for new users because i was able to give them an access key and me as the application developer i know that they have an allowance they can i because of my contract they can only do three free uh nft mints um i've kind of got them like boxed i can even take a fee from their first sale so i can actually read when they sell an nft and i can like take back the fee that i gave them with that access key so it's really cool and the the the user flow just comparing these two flows literally three clicks to get to this uh this last screen or three clicks to actually get to having a minted nft it's pretty cool so why it matters some thoughts on mainstream adoption so you want to piggyback on existing behavior so people are already used to just coming to an app and clicking like sign in with this sign in with that let them do it let them try it right and this is a nice easy way for you to fund your users um and just get them to create stuff and if they don't create anything then just delete their account after a certain amount of time i mean you you know you kind of gave them that key you could build in a functionality to just you know wipe it out or say your account's expiring i mean we don't have to go all the way right from the first start i mean i remember those 14 steps to sign in with metamask almost done here um so yeah align the ascent incentives so first make them money so you saw an example of that in the app and then profits equals a chance to teach people so once people have some skin in the game you can teach them stuff and you can tell them how to upgrade to full wallet and then you just repeat it so that's it thank you everybody um here are the resources so go to near dot ai you can find everything that i talked about there uh in terms of the technical stuff for hacking and you can also find great video tutorials on the left hand side down towards the bottom also last reminder 30 seconds um make sure to check out all the cool things near us up to at east denver uh the booth visit our booth in the sports castle free near account uh on mainnet and the sputnik dow there's 5 000 mainnet near in the sputnik dial what is it you've got to go to the zen room to find out and you can make a proposal anyone can we've got bounties we got six thousand plus in bounties for hackers at eastdenver.com bounties and check out the bounties with ceramic and textile if you want to take what i built and use actual decentralized storage that's pretty cool we also have a lot of inclusive brand uh inclusivity uh bounties for all sorts of cool stuff um and the near grants program just launched on friday there's one million in grants to be distributed in the next six months that's a lot of money all right i think that's it well thank you matt i got one thing to say you got the mound mix uh song stuck in my head i like chicken i like liver meow meows how'd we do audience terrible um also in terms of saying it's a crypto show you can you can say however i think there's a limit if you say too many times then ripple comes in and sponsors the whole thing so we don't we don't want that i definitely do not want that kent so thanks for the warning cool good to see you dude and uh yeah keep up the awesome work with uh with near guys check out what they're up to very cool that was great thanks again everybody at youth denver i was in the virtual sports castle last night and it is a blast it's so much fun alright thanks guys later