CELO 🛠 Build MiniPay Dapps

[Music] hey there in this Workshop we're going to learn how to build apps on Mini and mini is built on cell so let's learn about a little bit about cell first and then about mini at cell we follow the mission of building with purpose and building for billions we want to unlock the digital economy for billions of people all around the world cell cell is a Evan compatible layer one which is transitioning to a layer two cell is built for ease of use C is mobile focused we have support for ultralight clients using which users can validate transactions on their phone cell has features like paying for gas using tokens and this does not require pay masters the feature is built natively into the protocol and the wallets can be eoa wallets a few months back C had a hard Fork which made every transaction contribute a very small amount to a carbon negative fund which then funds project working in the carbon negative space hence every transaction contributes to carbon negativity this is a brief overview of the cello ecosystem there are projects like layer zero super fluid metamask Unis swap craft I highly recommend leveraging some of these protocols into your projects as I mentioned about the cell layer 2 let's talk a little bit about the layer two and where we are this is a cell to road map which is publicly available on for. c.org and right now we are in the stack selection phase after that we're going to build the el2 with core cell features then the seller roll up to ethereum data availability layer and we're going to work on the centralized sequen as well there will be a preet launch and finally a beet launch to keep yourselves updated about cell2 and to learn more about l2s in deep we do Twitter spaces with bright Minds like btek tankr ballic and shiram and many others so please follow the cell handle on Twitter to get notified about them let's now talk more about mini the best place to learn about minay is to go to docs. c.org and the first link will redirect you to the page which has a lot more information about how to build on Mini a minay is a wallet built inside operam mini it is a digital wallet within the Opera Mini browser it is focused on stable coins for Price stability very affordable and fast transactions because it's built on the sell blockchain it's designed for very easy web3 access and particularly for people in Africa right now the wallet is available for a few regions in Africa and will soon be rolled out to many other regions why should you build on minay you will be able to leverage Opera's massive user base Opera has over 80 million active users providing a vast potential audience for your D the access to mini pay is seamless minay integration within the Opera Mini browser streamlines on boarding removing typical web hle for new users reduce customer acquisition cost build on Mini pay and leverage its build-in audience significantly reducing customer acquisition expenses compared to traditional web3 channels and we have approved success metrics as well mini acquired 1.

6 million users in just a few months now let's learn how to build on minay to quickly start building on cell and on minay you can use COC composer COC composer is a CLI tool which lets you initialize your project and it also includes a template for minay so we're going to use C composer in this video to initialize a pay project to start working with cell composer we need to install cell composer as a global app global package so we're going to use this command to install C composer once you're done installing Sil composer we can use the npx command to use the minay template create and the template we want to create is mini now all we have to do is give it a name so I'm going to give it a name called e Global demo and that's it now we can go into the folder and install package using yarn this will install all the dependencies of the project once the packages are installed uh we can run the project so we can use the command run react app T before before I run the command I would want to show you so if you open up uh the project you will see that it's a monor repo if you open up the package folder you will see that there are two folders react app and hard hat hard hat is for all your contracts that you would use in your app um you can go that inside that later react app is an xjs app uh with the pages router um and some code related to uh some initial functions that we have created for you here so now let's run the project uh so if you go to packet Json you will see that from the top level of the project we can use these commands to run the react app now this should start the app at look lost you can see now um there is first thing that you would notice is that there is no connect button it connects to the wallet directly there is no connect wallet button that is the experience that has been unlocked by minay and even as a web tab it just connects to the uh injected wallet now since we have the front end ready a sample front end Let's uh install the mini page app and see how it looks inside mini mini app is Android only and if you're developing on your laptop you would want to use an emulator so for that you would have to use Android Studio you can go to Android Studio website and in install Android Studio which will also bring in the Android uh emulator with it and then you would want to install uh the emulator with Google Play Store available so I've already done this so I'm going to use the command to open it up this command basically starts the Android emulator uh the one which I have is pixel 4 Once the Android emulator is up now we need to install the uh minay app but minay app is actually not a stand alone app so we open we need to download the Opera Mini beta browser and then we can get access to minay so for the instructions for that you can go to do.org you can click on developers build on minay and overview so the first thing that we have to do is uh install Opera Mini beta so we can go to Play Store and we can download Opera Mini beta once the OPA mini beta browser is downloaded you can open it up once the app is up we can copy the link to access minay so we copy the link and then we can visit that link here in Opera Mini beta once you visit the link you will be given the welcome screen of uh mini and click on next and see all the features of minay and now you can CH it with Google once you do sign with Google it will try to find an account if there's already one if not then it will prompt you to enter your phone number and then it will give you an onetime password which you can use to complete your on boarding I'm going to restore my account here uh one thing that Min will also ask during onboarding is for your pattern or your fingerprint just to securely lock your wallet you can now also select your display currency you can either have the CD as your display currency or you can just go with dollars and this is how the interface of mini looks like now uh before going to start the tab we can go to settings and we can go to about and tap the version 10 times after tapping the version for 10 times we now have the developer settings enabled and if we go to developer settings we can enable test net the reason we do this is because we are usually building projects in deset in hackathons so this is how you enable the developer settings now what we can do is now we can go to the explore button here we can go to the last app in the export section called site tester now the tester can open any URL uh belonging to a web3 app inside the mini pay wallet and it will inject the wallet uh into that tab so right now we have our project running on Local Host how do we get the project on a link which can be accessed bya the site tester for this we will need an inro enrock will basically allow us to uh share our Local Host via a link so uh you can follow the instructions uh to install enro and once you're done with enro installation um you can run the following command to share your Local Host with uh with minay app once you tap enter the command you will get a link which you can use to visit by minay once you hit go it will visit the app you might get this warning but you can click on visit site because you know that this is basically your Local Host so now we can see that we can see our app here in um the minay wallet itself and this address is the address of the wallet um that is the mini pay wallet address now you can click on this button uh to send 0.1 ussd to yourself and the uh currency of this wallet is USD and also the gas fee currency is also C USD so you can click you can create such uh withdraw request buttons or transfer uh buttons uh using uh very quickly uh in the front end and this is all already shipped with along with the template um the minay template the DB can also request to sign messages uh to the m wallet which then have to be uh signed while the pattern or fingerprint lock and you can also M FTS this is also something that is shipped with uh the template itself so now let's dive a bit into the code um this is the sense USD function uh which is being used to send CD to other P wallets basically using VM here and we are creating the wallet client and we are using the custom transport with window. ethereum so the site that is open by site tester uh window. ethereum uh is injected the wallet is injected by window.

ethereum to the site so pretty pretty much the same as uh injected uh browser wallets we then get the address of the wallet connected and then we can uh send transactions using the world client so we are using we are since CD is a token we are using the transfer function on the token the two address which is the wallet itself uh from here but that can be changed by you and the amount in way which is the amount to transfer once the trans this will give us a transaction hash then we can wait for the receipt the waiting for the receipt will basically mean that the transaction is confirmed and you can now check the status of the transaction so let's try to do that um if you click here you get a request to transfer this request right now is in the sample app is uh to transferring to the wallet that is connected so this the wallet is sending this is a request to send 0.1 CD to yourselves um every every time there is a use of a private key you will have to use the pattern or the passcode of your lock screen once the transaction is completed you can see the transaction hash here so this is how you can uh work with uh you can build a app quickly using set composer you can quickly initialize a minip app and use it inside mini um we also have a lot of code Snippets uh that you can use to quickly uh iterate over your da if you go to B minay and code Library depending on the library that you're using uh for C composer we are using yarn and VM so we can keep the tabs as this and then uh you know let's say if you want to check C USD balance an address then the code is already here all you have to do is just copy paste it and you'll be able to uh quickly and easily uh check USD balance of an account if you want to quickly check if a transaction succeeded or not then you can use this uh we are already using this in the current example where we get the receipt the only extra step is taking the status of the receipt if it's success then the transaction was successful um maybe in some case you want to estimate gas for a transaction and you want to estimate that in the cell uh token and not C USD then this is how you would do it however this is something that you might not come across because the main currency of Min pay is CD so in case you want to do gas estimation in cusd this would mean um this would be used in a case where um let's say you have a field where the user can enter an amount of CD that they want to transfer or swap or something like that when they click the max button you can calculate the gas that would be required for the transaction and subtract that from the value that the use user already has in order to give them the real max value that they can use uh in their wallet because when they perform the transaction a small part of that CD is going to be used to pay for the gas of the transaction and this is where you would use this code to estimate the gas to find out how much value needs to be deducted from the total value the user holds this is the gas price uh in CSD um again this is related to the Gas part uh to figure out how much fees will the transaction cost and we have all the entire two code snipps combined here and this is how you'll be able to basically estimate uh the proper amount of tokens the user has access to um after they can do the transaction with USD um your DB can also use mini pay for numbers to resolve to addresses so uh this is the code to resolve basically take a phone number and get the minay wallet address um so for example the wallet the minay wallet is um buil with ux in mind so people are you people in Min pay would expect to just use phone numbers and not actually VM addresses and this is why if uh the DAP in inside site uh inside minay also leverages this technology then the experience is pretty seamless because the person who is using the app probably does not have any clue of evm addresses so better to avoid it uh and this is where this code can be used in order to take in the phone number from a user which could be their own number or someone else's number and then resol to address and this can be uh powerful because the experience will be very seamless so that is pretty much it about the building on minay um so to conclude um minay dabs are pretty much web DBS but uh they have some special features like um the the wallet gets connected there is no connect wallet button um the process of signing the transaction is very simple um and the wallet itself is buil for user experience which means there are there is no involvement of evm addresses or at least in the front end there is none which is why we would expect that you can build a app which also leverages the same technology and keeps the user experience simple for them next up we will look at some ideas that you can build on minay here are some mini app ideas and use cases that you can build during the hackathon you can build a personal finance app inside minay you can build apps that allow sending gift cards or coupons to your friends and family inside minay you could build a stable coin yield app inside mini you could even build a building app inside mini because mini is also being used among merchants and business to business so they would really appreciate a building app inside minip finally you can also build a microor Marketplace inside minay finally to learn more about building on mipay I highly recommend scanning this QR code this QR code will take you to the documentation page which has a lot more information about building on minay if you're looking for testnet tokens the link is faucet. c.org you'll get testnet tokens like cell cell dollar and celluro on the alpha test net you can also download the OPA Min Beta app and enable minay to get C USD on mainnet finally talking about the bounties the best dap built on Mini pay first place will be awarded with $4,000 usdc second place will be awarded with 3,000 usdc and third place will be awarded with 2,000 usdc we also have a themed Bounty which is best use of Mentor Stables which are cell dollar celluro and cell real if you build something really exciting with the Stables we you will be awarded with 1,000 usdc last but not the least when you are at the global London hackathon please feel free to reach out to the faes for any help and if you want some help asynchronously then feel free to message in partner hell channel on E GL Discord thank [Music] you