WalletConnect 🛠 WalletConnect Quick Start

[Applause] [Music] remote signing protocol what this means is that your wallets can interact with that without your private keys leaving your wallet basically we have uh a lot of our wall a lot of wallets support wall of connect and basically any wallet you can use is uh enabled with wall connect we also have a lot of dapps a lot of doubts usually have well connect integrated with us and so then for this hackathon usually just if you want to use any wallet and interact with another app usually while connect is enabled um we have here's a full list and hopefully that by the end of this hackathon your dab will also be included in this list um we've had lots of downloads uh throughout the years so we're getting we're reaching more places as we keep growing so how do you integrate it there's a very simple ui that you see probably in a lot of the apps which is this web 3 model and it basically provides it gives you the ability to use any web3 provider and this web 3 model is is a way for dapps to connect to either metamask or wallet connect those are the two most popular ones so i'm going to focus just on those two and there's other other providers but i'm not going to mention them for now uh this is how this is the package you're interested this is the wallet connect slash web 3 dash provider this gives you uh the easiest way to start using wall connect and also use metamask at the same time so this this um application this library is this ui that you see when you click connect so then how do you configure it the web3 model is very easy to configure uh what's the most important aspect about the web 3 model is that you can pick multiple different evm chains so like for example where it says the network parameter you can put the ethereum main net that's the default you can put optimism you can put polygon by what you have to remember is that you have to pick an evm compatible chain um also something important that you need to do is that you have to have your inferior id the reason for this is because the connection with the wallets the wallets don't provide the blockchain information your dap still has to carry query that information within vira for example like nonsense or token balances that is obtained through inferior not through wall connect so the once you have it set up you can do web3 await this promise web3 model.connect and in this mo at this point the user is presented with this uh interface so only until the user presses one of the options either metamask while connectors or coinbase that promise will resolve and then you can easily integrate it with a web3 object in this case it can be ethers or web3.js and the provider would be the wallets that the webconnect has given to the through the connection once the user connects with it um some are very similar to metamask once you press connect it gives it to the user to this object [Music] this provider object follows this eip1193 standard and there's two things you should pay attention during this hackathon with regards with this standard is that it has two functions which is uh two events accounts change and chain changed so what usually happens is that on your wallet uh the user can like okay if i'm on ethereum main net i should probably want to switch to the testnet so i want to switch to rinkeby so you want to pay attention to when the the wallet changes from one network to the other because that can change the contracts that you interact with or the where your dap is deployed uh another thing that you have to listen to is the events for account change because the user you can have multiple accounts on your wallets and you want us you might switch them to to test your data and just just keep in mind that this is how you listen to them and depending on your use case uh finally so you're going to be iterating a lot in your dab probably in this hackathon and it's you might want to disconnect to try to reconnect with another wallet just like okay you're sharing with your with your teammate in the hackathon is like okay here scan this you know why is it not working for me so you have to remember that when you disconnect we also uh that disconnects the session that the cache on the browser still is still contains the information of the address that was previously used now this is useful for uh user experience because then it's like you don't have to reconnect every single time you don't have to scan the qr code every single time but it can be quite troublesome for you during this hackathon where you like forgot to clear your cache so it's recommended at least that after you disconnect you also clear the cache just to make sure that you don't have any leftover addresses that you don't want to use so here the docs uh this has uh there's a lot of other providers that are not just only uh infuria uh or i mean um uh just other uh web3 providers the the web3 model supports we recommend that you use four to six providers because sometimes having more options is too overwhelming for the user uh so the top four most popular is usually pretty good starting point and we also have the wall connect docs for when you depending on the different types of transactions you want to do with your dap and finally here's a an example repository that has ethers.js ethercs is just a a web3 library this is a react app and it already has the web3 model installed so this is a good starting point for your dap if you just want to use wall connect with ether.js um so yeah it's a very very quick demo i'll just go back because this is probably this the events accounts changed and chain changed is quite important and the disconnect you don't want to make sure that you leave a cache there that affects your adapter and your hackathon i'll just leave it the docs and that's it you know any questions go ahead alchemy yes you can use it yeah definitely you can use it so other evm chains like i know for example that some cosmos chains have uh forked well connect to support uh cosmos transactions uh i'll need to get you the i don't remember exactly the name but i'll have to get back to you in that uh version two of all connect which is we're hopefully wrapping up soon would be multi-chain so sadly it's not ready for it for this hackathon but hopefully future hackathons we will have multi-chain support all right uh if you have any questions we're going to be here at the booth uh do you know any usually most of the problems uh occur with network changes like when uh when you change your network from either mumbai or to optimism on your wallet that's usually causes a lot of confusion or like just the the event does not get updated properly so you should pay attention to that during the hackathon my personal experience rainbow wallet works really well it's really well supported with walla connect yeah that's what i have for now any more questions all right thank you very much