Decentralizing Front-ends Now: Skynet, Homescreen, and More Secure dApps - Daniel Helm

hi everyone glad to hear that at least someone is already on board with my project here so i won't have much convincing to do um yeah i am daniel helm i was skynet labs going to be talking about decentralizing front ends i'm the developer evangelist at skynet labs and i want to kind of lead off and frame this conversation with a question which is should we decentralize front ends i'm very opinionated about this because i work in decentralized storage day in and day out but maybe i can say how i understand this question and it is are we building permissionless systems if they're centralized at the point of entry so thinking about how most users are accessing our smart contracts our decentralized protocols if they're only doing that through websites hosted at aws digitalocean versailles netlify i don't know are we actually building permissionless decentralized systems okay so let's back up a little bit and talk about decentralized storage for folks who aren't aware it is a core piece of web3 infrastructure where we can store files web apps nfts basically anything off chain in a way that we don't have to trust a single centralized authority ideally we're going to be doing this in environments that are trustless permissionless and also censorship resistant and we're going to be you know hopefully wrangling the user data and application data away from the likes of you know amazon facebook and google so there are projects in the space building towards this skynet is one of them you also probably have heard of ipfs or rweve and these are similar projects that also have some differences that um in their approach um i'm going to try and do live demo here i just want to show what it looks like to interact with decentralized storage because i think people find it really intimidating but really what you can do is pull up a site that interacts with decentralized storage and for the end user it's just like selecting a file and it will upload and what you get back is a link that is instantly available on that portal but it is also available if i were to go to another one so fileportal.org is run by a community member not skynet labs but this file is instantly available across these different websites okay cool images might be boring we're talking about front ends let's see what it looks like to deploy a website on decentralized storage for the developers this is a build of a create react app i can upload it and because it has an index.html file the decentralized storage is going to treat it like a website and so here we have a website fully hosted on skynet in a decentralized manner okay so that's kind of what interacting with skynet looks like and let's keep going with the slides here not f11 present all right so you might have noticed when you uploaded this file we got back this crazy looking url and what this is is it's a unique cryptographic identifier for what that file is you can think of it like a fingerprint for this file and so we can take that identifier pass it to any portal scisk.net fileportal.org and we will know cryptographically that the file that was originally uploaded is the same one that we downloaded and the portal didn't mess with it it never was changed from the time of upload and there's a kind of security there right these files are immutable which for the non-developers that just means that basically you can't change that file that file is kind of set in stone if you were to change the contents of the file this fingerprint would change as well and so um i don't know we have a lot of guarantees about these things all right but we are talking about web apps not just random files on the internet so um do we care that much does it need to be fully decentralized well some of the reasons that we're looking at the idea of decentralized storage here for web apps is that there are concerns right developers might end up being liable for user actions that happen on their website even though they are on fully decentralized platforms as the back end if the front end is still happening through their aws instance who knows in addition to this we can look at hosting providers and say you know as we grow are they going to agree with our ethos are they going to keep hosting these front ends and as they bring these things down you are blocking users from the digital assets another reason we might want to look at decentralized storage is that currently in the current paradigm users are fully unaware when changes happen in the back end of websites in the code things can get modified maliciously or by developer teams and they're kind of invisible to the user and maybe we don't want to have those trust assumptions and lastly looking at decentralized storage for front ends is great because you know protocol stakeholders might not want to just always do what the developer teams want them to do we want to have the you know we have an ethos as a blockchain community thinking about forkability and this is something that i don't know i feel pretty strongly about we should be able to always have access on our own terms these are not hypotheticals we see these playing out in the real world uh front end attacks are happening so one instance of this is uniswap de-listing 100 tokens from their front-end interface if you were using uniswap at the time to access these tokens after the update came out you didn't have access to those tokens through uniswap sushi swap had a front-end attack that put millions of dollars at risk because there was malicious code that was introduced to the front end one inch introduced geo-fencing to try to deter u.

s users from using their product again regulatory uncertainties compound introduced a bug that was actually in their smart contracts but as a way of stopping some users from exploiting that bug they just disabled the feature on their website so anyone that was a normal user accessing it couldn't exploit the bug but everyone else who had a safe copy was still able to and lastly we can look at things like dns hijack attacks where you see um literally just instead of something changing on the website a whole different website is served so someone has full control of what might be happening during that attack time all right so the stakes are real web 3 needs decentralized front ends if you're a d5 developer if you're a d5 user please start using decentralized front-ends we see some resistance to this or just maybe laziness around it so it's useful to look at why do people not decentralize their websites well we might see that not all web 2 patterns translate into the decentralized context decentralized websites do not have the single trusted backend server and so some of these patterns don't necessarily translate from web 2 to web 3 very well because we don't have that server there can also also be like limited framework support some of these frameworks you know are not designed for web3 and lastly i think people have performance concerns about decentralized storage in comparison to big players like aws so my retort here is why not decentralize with skynet um a little bit of a shill uh but for web two patterns not translating that's still true but if we have performant user controlled data that is like cross ecosystem and has decentralized user identity we can have web apps have user data that can doesn't need that single backend server in terms of limited framework support skynet supports gatsby react router view and any kind of dynamically routed client-side framework and for performance concerns i'm not going to bore everyone with them but you saw me interacting with skynet and you'll see me doing it some more and it's all good okay so you know our goal for what we're trying to do is create a world where any developer can build a web3 app that anyone can use we don't want your users to have crazy software or cryptocurrencies or anything else just to access your front end these should be easy and accessible but also decentralized so these are kind of things that we have to weigh out so i hope to not bore the non-developers in the room but i'm sure some of you your minds are already racing if our web app is immutable if we can't update those things how are we going to get our users on the latest version of the app right we update our apps all the time well for that i have a story here we have our friendly user and our friendly user loves this website called daily builds that is deployed to skynet and so tuesday's build has a skylink which is a url that our user can use to access tuesday's build they're happy they love tuesday's build wednesday comes around the developer team releases wednesday's build and they introduce dark mode everyone's excited but our poor user doesn't have the url they don't have that immutable fingerprint for the new website okay so this is kind of a problem well as developers we come up with solutions to these kind of problems and so in the skynet ecosystem we have resolver skylinks ipfs has something called ipns but what these do is allow us to as a developer team change where a certain url points to still in these decentralized ecosystems and so our user has our resolver skylink and on tuesday everything's good they still have that same url on wednesday the developer team signs that we're going to now point to wednesday's build everyone's still happy everyone is still happy except for real world users which don't like crazy looking urls and so then we put a human readable name instead and we point that to our resolver skylink or our ips record and so this could be traditional dns it could be ens it could be handshake all of these are compatible with our decentralized structures here okay look we solved the problem decentralized hosting is wonderful no hopefully we have a lot of cynics in the room that say all those things that you talked about that were issues with the centralized model still exist here well let's take a look and see why that is thursday comes around malware developers have gone rogue worst of all dark mode has been removed from the application our developers have an automated build pipeline so whenever they push their code that resolver skylink automatically gets pointed to that latest malicious bad build and our user has only ever known about dailybuilds.com and dailybuilds.eath so they know that they don't like this new version of the website but they don't have the skylinks to go back to the old immutable versions and so this is we see as a problem and we want to you know fix that so we made a product called home screen what home screen allows you to do is take decentralized web applications sign in with your skynet credentials and you are able to pin these to your personal decentralized cloud so what that means is that when i want to access say one inch who deploys onto skynet i can save them as an app in my home screen and i can always you know when i download that thing when i download it to home screen i'm going and grabbing all the assets i'm grabbing the javascript the html the css and saving that in my personal cloud so i always have a copy of it and then at any point in time i'm free to upgrade or later on free to downgrade okay a lot of talk let's see what this looks like in action i will go to our decentralized web app here which is called home screen and i'm not signed in i will authenticate with my sky this is happening all in the browser this is permissionless and i'll need a seed phrase so i'm just going to sign up and here's my really secure way of broadcasting it to the world so i now have a mysky account good to go and here is home screen and keep in mind while i'm using this every single interaction that i'm doing is saving this application data to decentralized storage so this is available instantly across any portal and on any device so here i am on home screen earlier i deployed my app to skynet and i want to save a copy of that so here i can save to home screen my hello eath denver app and when i click save i the portal will then go grab all of those assets save a copy of them in my personalized storage add the record here on home screen and i'm good to go okay now i can click on that there we are okay we also have other interesting features here i mentioned one inch let's check to see if the one-inch team has rolled out updates since this old one it has so i can update it and again i will go grab all the assets save it to my personalized storage and depending on if you're on hotel wi-fi or not sometimes okay there we go and now we're all good to go with the latest version of one inch then i'm able to at any time downgrade to an older version save and if one inch takes down their website it gets blocked in the united states whatever else i always have my copy right here that i can access through any skynet portal okay and lastly i just want to throw out uniswap they deployed ipfs that's okay we can still add them to our home screen unfortunately we won't have the upgrade capabilities but it's still nice to have a copy of old versions of ipfs data so there's that okay so that is what we view as kind of some of the future looking items for users really controlling their front ends and having full control over those things we're not done the you know the question of what's next is always there and we're currently working on fully verified data so when we access data from a portal you know we can we do all the cryptographic guarantees without any special software all in the browser and if the portal lies to us it's easy in the background without our users interacting to go jump to another portal that's not a bad actor and it all just happens without our user really knowing all right if you're interested in this if you're a developer looking to you know create your hack consider decentralized front ends and consider home screen really you have to deploy an app to skynet copy paste a github action and then you have that resolver skylink you just there's a metadata file that you paste it into and then from then on out your user home screen will always know where updates will publish so here's uh two urls to check out if you want to get started um this one is that create react app with the minimal changes needed to get home screen working all right also if you're a hacker and you do this we've got you know split between virtual and in-person hacks we have a bounty for you know 500 for each yeah check out our developer guide our support stuff we have a javascript sdk for deeper scanned integration please join our discord where we have tons of really knowledgeable developers that are really generous with their time and knowledge and i would love to answer questions about decentralized storage or decentralized rents