Build Consumer Applications on Morph - ETHGlobal Bangkok 2024

[Music] hey guys welcome to the morph Workshop so in this video we're going to teach you how to leverage our uh morph stud kit to quickly serve as a foundation of your applications that you're trying to build on morph so this is going to be super quick video we're going to uh show you some uh examples like how you install the mo packages and how we designed the structures to serve you better so without further Ado let's go so uh how do you install the morph starter kit which is very simple so we already have uh made it into a uh mpm packages so you just typing the uh commands here so it will automatically download all the files for you and first of all of course you you need to name your project let's say examples here and we offer you two options so one is a basic starter kit which is a clean starter kit uh that already include all the resources you need to build on worth and the other is a um additional version which we have uh our partner uh P Oracle already installed so depending on your needs uh let's use use basic starter kit this time and here we go we already have all the files you need so let's check out the directories here we have two major uh folders one is for contracts one for front end and you can see uh for the contract folder we oper you two options one is for fundry and one is for hotthead so uh depending on like which framework you're most familiar with you can switch to any of these uh structures and uh for the frontal folder is basically just a uh simple nextjs templates which uh including all the basic uh files and now before you uh start building there are several certain uh setups you need to uh do so first of all Let's uh go to the front end folder uh and front and and install all the dependencies this going to take uh some time because there's a lot of resources that we prepare for you to download but please just wait patiently all right so the uh installation for front end folder is down let's go to the um contract folders and let's say hard at yeah again install the dependencies all right now you already have all the uh necessary dependence for your development and uh next step is to config certain parameters for your applications the first of it is we have this uh uh we recommend you to use the wet connect application uh to serve as your uh wallet connection kit so what you're going to do here is in the under the front end folder you need to create a new file called uh un. local and uh you need to apply a w connect application ID here which is totally free you can basically do it in within 5 seconds and uh input your what connect project IDs here and with this configuration you can uh already have your whole set of wallet kits for your applications which you don't need to develop yourself and the second step is for contract development you need to config the env. file so you basically you rename this to uh EMV and uh you uh adjust two params here first is private key parameters which represent your wallet and make sure you have some uh gas tokens which is more uh eth or more Hosk eth and the second one depending on whether you are developing a manage or you're developing a holisky test net uh you can adjust the RVC here uh if if you need to develop on Manet you just uh Delete the holis key uh here all right that's all the setup you need for this dat kit and uh make sure that uh you have all the resources you need here so for the uh contract development we already have the uh scripts and the uh contract examples and the test uh uh examples here and for the front end it's all by you to uh how to play around with all those uh informations all right that's it thank you guys uh this is a super quick workshop and hope you enjoy your development at this acon [Music]