Build Cross-Chain Ethereum Applications With ICP Chain Fusion | Kristofer Lund - DFINITY

[Music] hey everyone I'm Christopher I'm a developer Advocate at the definity and the internet computer and I lost the screen share yeah today we're going to talk about cross chain applications and and I would like to demo for you building a a cross chain um ethereum wallet built on the ICP so like I said my name is Christopher if you would like to get in contact after this call you have my contact details there and to start things off I just wanted to let this slide hang there for a second or two why do we keep inviting these Rando chains to ethereum Denver and to some of you that might be know a little bit about ICP know that ICP is an L1 so you can build things on on just just using using ICP uh but fact of the matter matter is this that we are here because we see uh that ethereum needs scaling or ethereum needs scaling but ethereum apps needs scaling as well then there are many reasons why you might want to uh scale your ethereum application so you might want to um be able to store larger volumes of data or you might want to run complex computation the or you might want to integrate with external systems somehow and all these are are good reasons to scaling your ethereum application on onto something else so that is the the the the clear message I would like to give you as as e ethereum people today is that view ICP as an ethereum scaling solution and and put it in the same category uh as other scaling Solutions such as igen layer and and risk zero Etc so just for comparison and and when you're building an ethereum application you you know you have a toolkit of of of platforms and ecosystem projects that you can use to to achieve this scaling and of course there are trade-offs for all these um when you should use which platform so with with igen layer you know you you rely on the ethereum validator set for for as a trust model and with risk zero you have the CK proofs and and in the ICP case you instead trust the ICP consensus algorithm and and the signatures that the the nodes in the subnets produce so you you use these scaling solutions for for different reasons and before go going into showing you some code on how you build this uh ethereum wallet on ICP I think it would be wise to give you a little bit more details on on how uh actually ICP works or rather I would spend half of the time of the talk roughly describing this high level overview or fairly lowlevel semi lowlevel description uh because otherwise I I think I will convert basically zero% of you um so I we need to describe this but internet computer is a blockchain and is a it is a decentralized public network uh that serves fully onchain applications and when I say applications I don't just mean smart cont I mean applications and that means we can serve both the the the front end and uh the back end which is the the the smart contracts so the decentralized public network what does that mean it means that it's geographically distributed and we want it to not be dominated by like one or or a few particular actors and in the the network we have a number of nodes that execute the smart contracts and these nodes and smart contracts these should be like general purpose meaning that we can execute any type of computation that is computable and they are composable they can call each other they are tamper proof and autonomous uh the ICP uh subnets and the networks are a replicated uh State machine meaning that they accept input from the outside world uh they're R run round of consensus um and once the the blocks have been arranged in a in a block blockchain uh the execution layer takes over uh runs the smart contracts that does a state transition uh and then the the state of the whole chain is Advanced we call the smart contracts canisters uh and these canisters are web assembly modules and uh these modules of course run in a in a web assembly runtime that is is provided by the the the nodes and in addition to this web assembly runtime the the nodes also provide uh the smart contracts with a system API that allows these smart contracts to access a bunch of of cool stuff uh uh which is are the ICP specific features uh so ICP offers a whole whole range of features that is most chains cannot offer through this system API and that https out calls means the smart contract can communicate with the outside world thereby acting as its own Oracle uh it can keep secrets that is a topic for another conversation it can use timers you can build chronik uh functionality where a smart contract wakes uh every five minutes or whatever it can access through Randomness that in itself is not a small thing it's a really important for all like game scenarios and and a lot lot of different use cases chain key cryptography we'll get back to that one and also massive cheap storage so up to 400 gabt uh storage per contract and so all of these uh features might be like a good trigger if you are developing an ethereum application and you'll be like yeah some more one or more of these feature would be I would like to use those in my application then you can you can do that so keep building on on ethereum but offload part of the computation to ICP and when I said that there's an ICP Network in reality there's a loads of ICP networks we call them uh subnets and these subnets are are managed by a DA and this is important so imagine a scenario where we have all these subnets and the subnets execute smart contracts and we want it to be decentralized and of course we the topology of these subnets might need to change every once in a while we need to add nodes remove nodes Etc if this was to be done in a completely decentralized manner it would be like extremely uh difficult for all the the the subnets and and the nodes to find each other Etc that we so instead we try to achieve The Best of Both Worlds where we have let a dow we call it the nns the network and nervous system we let that Dow manage uh the the subnets uh and the holders of ICP tokens Can stake their tokens in the Dow to get voting rights that will let them affect how how ICP as as a network uh evolv so so the Dow manages the topology and importantly it also provides all the subnets uh with key shares uh which I will talk more about in a slide or two so I think I mentioned this but where in all this is the blockchain so the the the subnets the nodes in the subnet they accept input from the outside world um and once that that input has been accepted a node that gets the the input broadcasts the messages that it accepts to the the other nodes and a round of consensus happens uh and once the the nodes have agreed on an order uh of of blocks created those blocks get stored to a blockchain and the execution layer takes over which is the yeah the smart contracts the web assembly modules so there's a lot of information in this step I know but I just wanted to we are soon done with this part uh two interesting features I said we we can host both front ends and back ends on IP uh so this is how serving uh front ends work you have a front end there on the left making an https call to something we call the boundary node and there's a number of boundary nodes and this is also decentralized uh setup so so boundary nodes are responsible for transferring uh translating these https request to the internal format that ICP uses um so it routes the https request to to a node that responds with an uh HTTP uh response if it's a query call and if it's an update call then we need to run the consensus algorithm uh before returning a response um so we uh ICP provides this candid interface specification that is a fully typed interface um so once we have a front end we we have the benefit of uh using that fully typed RPC Library uh threshold signatures is a super important thing especially when it comes to building cross-chain functionality such as an ethereum application or them wallet um so I told you that the subnets give the nodes in the subnet each a key share and threshold signatures works this way so that if uh the nodes when they need to when they sign a request um each node sign a request or a payload individually and then all those signatures gets put together to to form the the final signature and only twoth thirds of the nodes need to be online and and not malicious for this algorithm to work so it's a quite fault tolerant and uh the the the cryptographic schemes that we currently support is ecdsa and EDSA which means that we can sign transactions on on ethereum bitcoin salon and over 20 uh 20 more blockchains so I think the previous speaker said that we will we're doing the uh cross chain smart contracts for the first time time yeah but but ICP has been doing this for a number of years uh and ICP plays really nicely with ethereum that is one of the core messages of of of this talk uh and using uh the https out calls in combination with the threshold signatures means that we can achieve uh a two-way communication with with ethereum so a a smart contract on ICP can sign transactions with the help of the nodes that do this threshold signing uh process and once we have a signed payload we use we use https out calls uh to to send that signed payload to a regular uh RPC provider such as Alchemy and in in a similar manner uh we can also monitor log events from ethereum and monitor log events we can of course then we can use that as a way for ethereum smart contracts to notify an ICP smart contract now it's time to actually perform an an action uh and this is great because we don't need any Bridges we we just use these two features in combination and we can achieve this two-way um com uh communication so we will soon uh get into not coding but showing code uh for this wallet application and so I I just briefly wanted to to discuss the the architect Ure um the round circle there represents the the this the node we are running on and we have four distinct smart contracts involved in this process uh so looking at starting from the user we have the the user interacts with the front end the frontend is a smart contract that has the sole purpose of serving https uh like pre-built a pre-built front end in our case a vit and react front end uh that front end interacts with the back end using this RPC um using RPC calls that I mentioned uh the backend itself uses uh calls another canister another smart contract with is which is the evm RPC canister and that canister is responsible for routing uh the the requests we want to make to Alchemy and routing them out of of ICP using https out calls the call goes to Alchemy and then you ethereum we are also using internet ident entity which is a um a service provided by by the internet computer it's a it's an easy way for users to to generate an identity because that is one one key requirement when interacting with with icps that you have a an identity doing so you need to sign all all the all all the requests okay I'm going to fix this here and we have six minutes so I will be able to show you at least some code um first I just wanted to briefly show you the overview here this a the the project is in essence a regular vit and react project to start with and once you have set up that that project so now we are building the front end we just add one configuration file that is the DFX do Json file and this file here we we tell we we say which uh components which ICP components are included in this project and here we have the internet identity and we specify some information here we actually uh pointing this config configuration file um toward a a pre-built web assembly module that we get from GitHub so that is one of the benefits with using web assembly we can use composability on the canister level we can in this case use a pre-built one uh the evm RP C canister is also a pre-built web assembly canister that we are just adding to our project we don't need to build that from scratch and then we set up our backend canister and saying here that the the type of canister is a rust canister um and I will show you the code for that one soon and we have the front end canister and this canister is of a specific type it's an asset canister so it's like I mentioned it's sole purpose is to serve assets and here we also connected with a specific uh PMP run build script that we will use later okay next up I'm going to show you how to deploy things I need to have my list to remember stuff so DFX deploy uh DFX is the command you're using to to interact with the local ICP development environment and I have a replica of the e ICP blockchain running locally already and by saying DFX deploy uh the DFX deploy it looks at this DFX Json file and builds every every P part of the project according to its needs so basically it takes the this internet identity in the evm RPC canisters that are already pre pre-built just spins those up and builds the V front end and also compiles the the rust based uh back end um next up uh backend package yes uh so let's see the backend package or I can show you like this instead uh the back end package here uh is a uh rust a regular rust uh project that we have added to our source folder and not much to say about that but in addition to the the the rust code we have added an interface specification using this candid interface specification language and here we Define the end points that the backend smart contract canister should offer and in our case we have the get address get balance and send e just a super simple we have just three end points so let's jump over to the front end and show you some um how we connect the front end with the back end let's see it's uh this one I believe so we are jumping straight to the I didn't show you the project sorry this is how it looks by the way once it's done this is the wallet interface uh this wallet address is is generated by the backend canister and uh you can see the balance here just some basic functionality we can show you a QR code and we there's a send button uh where you can enter the two address and and an amount so let's let's try that we do we have time for that we have only two minutes sorry this will have to be cut off slightly the demo part but let's just send a little bit of sepolia eth to our metamask wallet uh and you see we don't need to sign anything um the whole signing process takes place in inside the canister nons too low next nons three okay I did something should never tried to demo things live I did something wrong when I before set setting this up um but anyway if this this would have sort of you can see we we did interact with the RPC and we got a a error response back so the the send send button we jump right into the send button the react send button and here we have defined a react hook uh that defines a send e function we are using tan stack uh query to to manage the the calls for us let's have a look at how this send e uh hook looks um it basically just interacts with the back end here backend. send e and now I have only 45 seconds I really need to fast forward and we have configure the front end with an actor here use actor uh where we basically create an actor provider that wraps the whole component Tre of the reg application saying like this is the backend canister you should interact with and by doing so we get the fully typed interface that we interact with and in 22 seconds I'll jump right in and show you the send e function uh in the backend canister that matches the the send e function we have defined in the interface specification here uh and what it does in 8 seconds is that it creates an assigner an ICP signer using the alloy Library uh a version of the alloy the Fantastic ethereum support Library um that supports ICP so you can really easily sign a transaction and it uses this threshold signature features of ICP and I think I need to cut off there and I'm happy to talk more about this later thanks