Workshop Task 3

Task 3: The Frontend

Okay now let’s look at the front end  

The front end is usually more trickier because  you need to you know integrate the metamask or whichever component to our existing codebase how it works is that it takes  data from the back end so we need to run this  pnpm build inside the back end first sorry let’s run it I forgot do we have the confidential queries now maybe we should let me just remove the confidentiality part here so 

We want  pnpm build and let’s deploy

The front end  lives in this front end folder and we will need to store our  chain ID, the contract address and so on. The front end will connect to inside these .env files so .env files are typical for the nodejs developers  and you have different flavors of them one is for development the other one is for production so we’ll just use the development  and we’ll put the message box address here and the web Gateway can remain the testnet and the network is also the testnet.

Task 3: Signing in the Frontend

I’m not sure if it okay so if I just run the pnpm dev I could connect to this 5173 Local Host  address all right and then it will allow me to connect my wallet

The idea is that you can write the message here  the metamask pops up and you can just  send the transaction  and it also offers the encryption  and signed view calls the same way it did  from the command line.

Let’s move on to our final task:  this is about the precompiles.