Solana Developer Bootcamp 2024 - Learn Blockchain and Full Stack Web3 Development - Projects 1-9 - Ep60

[kotlin] Time: 2025-07-11 11:51:02 Source: AIHackNode Author: cs Click: 164 times
account instead of of thecount we want the company name to be build ai startuptheheaderokay now before the buttons we're goingto need a text input so we're going todo basically the same thing we did AboveSo for Simplicity let's just copy thatover instead of having to write it allout okay so we'll make that update underthe header and then under this div so sothis div is separating all of ourbuttons so we have aninput and this will be text we're goingto set this as starttime the value will be starttime and now we want the start timeplaceholder to show so because of thatwe're just goingto do thisokay and now we have the value on changeit's going to set the starttime and this is going tobe because this is a number we're goingto have to parse the integer so we'll doparse intthere wego and we'll keep the class name thesame so now we're going to do the samething for the rest of the inputs sowe'll just copythis and update this to endtime and this will be set intime okay then we'll do the same forCliff and totalamount so total amount comes firstactuallyand we'll set totalamount and then we'll do Cliff timeokay so let's just make sure we did allof that so start time set starttime end time total amount and Clifftime okay and let's just writeallocation here so it's easier on thefront end so you know what that value isit's the total allocation an employeegets okay so now we can update ourbutton so the button it'll have the sameclass on click we want tocreate employeevesting and that is going to updatethese arguments to starttime end time total amount and Clifftime okay and then we'll update this tocreate employeevesting okay and now we're getting anerror so let's figure out why so you cansee beneficiary is missing in the typeso we actually we are forgetting onefield so let's update this to also havethebeneficiary so here we're going to needconstbeneficiary setbeneficiary and beneficiary is a typestring so we're going to use thestring and then we're going toneed to have an input field for thatand this will be abeneficiary and this will be the walletaddressokay we'll update this to justbeneficiary and this is not an integerso we can get rid of theparsent okay and then this should be setbeneficiaryokay and now we can pass that through aswell okay and we'll update the name ofthe button to create employee vestingaccount and this we can get ridof because this is coming from thecounter programwe'll just clean everything up okay andwe'll clean up our Imports anything unuswe'll get ridof all right so lastly we need to updateour feature so the counter feature isgoing to use the vesting program it'sgoing to use the vesting create let'supdate our counter list to be namedvestinglistokay then we'llupdate everything for vesting so thisshould be a vestingfeature okay this should be vestingcreate investinglistokay we'll update the title to vestingsmartcontract actually we'll just name ittoken vestingokay and then create a new vestingaccountbelow and we'll just remove the rest ofthesecommentsokay so it's see this is our featurewe're setting up the vesting featurewe're connecting the public key from thewallet that is connected to the frontend we have the program ID from ourvesting program if there's a public keyconnected it'll return to create a tokenvestingaccount okay so this looks likeeverything we need we're just going torename this vestingand now we should have gotten rid ofalmost everything related to the counterby now there's just one more thing we'regoing to need toupdate so vesting let's just commandshift f forcounter okay these are all justcomments so here wego in the layout we'll update this tovesting programand this should be using the vestingpath on the page we want to use thevestingfuture and we're going to import thevestingfeatureokay these are all comments okay and nowlet's just update our queries tovesting okay so now we're good to go sonow to recap everything that we've doneso far we've created our smart contractusing incor in our incor workspace we'vebuilt the project and deployed it alsousing incor we deployed onto our LocalHost so we're running a salon testvalidator locally on our computer andthen we've updated the front end to beable to connect to our wallet andexecute smart contractinstructions now that all of that's donewe're going to run onour local host the UI and be able totest it out one thing to know before westartrunning you're going to want to makesure that your package.json the lockfile is updated because it's probablystill going to have dependencies linkingto all of your counter files so I wouldjust delete the package. loock and rerunmpm install to make sure that everythingis set and good to go and then we canjust gointo our web folder so we'll CD intoweb and we can run mpmrunev and get this running on our LocalHost okay so we're going to open up ourbrowser navigate to our Local Hostokay so this is whatour UI looks like using the create SalonD app you have the cluster that you'reconnected to you can see here we'reconnected to local you have your walletconnectionhere and this is connected to my Phantomwallet that I have linked on this webpage now you can see that itautomatically prompts you that I'm onlocal but I don't have an account foundso I'm going to request an airdrop sothis account that my wallet is connectedto is now funded with soul and theaccount exists so this is ourplaceholder um you have this basic frontend that has just GM this is your newsalana D app and some links now what weupdated was the vesting program Tab andjust to make sure you're familiar withthe crate Salon appb scaffold we'll justgo through all the other tabs first soso you have this accountTab and this shows the account that Ihave connected here is my wallet addressit is the same as the wallet that'sconnected you can see that I have onesoul that I just aird dropped to myselfyou can see the transaction historywhich was the soul that I just airddropped to myself you can see that Ihave no

(Editor in charge: rust)

Related content
Wonderful recommendations
Popular Clicks
Friendly links