What am I Making?

• A minimal Html/Js site
• That has the following buttons which maos to the solidity contracts
  • Connect✅
  • Buy coffee✅
    • Button to buy a function✅
    • Call a function in a smart contract ✅
    • have a test blockchain that we can make our call in it ✅
    • We will be using the fundMe contract in other to fund the contract to see whether the balance increase✅
  • Get balance✅
  • Withdraw

Wallet and Importance

• Metamask or any other wallet is needed to make transactions under the hood because built to them they have a blockchain node connected to them and it's needed in other to interact with a blockchain
• We also need URLs where we need them to create a provider or a node to send my transactions too

rpc URLS

• Is the endpoint connecting to a blockhain
• When a website make a request it's making an Apicall or http request or http getCall to the rpc Url
• All Blockchain has urls used to connect

VIEM CLIENT

Clients

• A Client provides access to a subset of Actions.

• A Client in the context of viem is similar to an Ethers.js Provider.

• A Public Client which provides access to Public Actions, such as getBlockNumber and getBalance.

• A Wallet Client which provides access to Wallet Actions, such as sendTransaction and signMessage.

• A Test Client which provides access to Test Actions, such as mine and impersonate.

• PublicClient has different functionalities but we use th simulatecontract functionality that includes

•   address: contractAddress,
    abi: coffeeAbi,
    account: connectedAccount,  
    chain:  currentChain,
    value: parseEther(ethAmount),
  

• in order to pass in values to a blockchain contract

• getcurrentChainId function just gives us the state of our dummy blockchain

• parseEther is used so that the console in our browsers knows that it's dealing with eth

• as we move further we have to be importing all associated files

• files like fundme-anvil, constants, are needed for usage in dependencies

connectButton.onclick = getBalance async function getBalance() { if(typeof window.ethereum !== "undefined"){ publicClient = createPublicClient({ transport = custom(window.ethereum) }) } const balance = await publicclient.getbalance( address: contractAddress ) console.log(formatEther(balance))

}

TypeScripts

• It's a subset of jscript that's easier to read
• TypeScript is a statically typed superset of JavaScript that enhances code reliability and developer productivity by catching errors at compile time and enabling better tooling, while seamlessly compiling to standard JavaScript for cross-platform compatibility.
• steps in writing typescript

1. write in typescript
2. compile to javascript
3. use the converted file

i'm trying to run pnpm add typescript in other to create dependencies for my newly created index-ts.ts but i don't know why it's not installing any dependecies it's not creating new folders like node modules packae.json and pnpm-lock.yaml it's showing it passed without any issue but not creating the above dependencies and also when trying to run pnpm tsc index-ts.ts it shows "index-ts.ts" doesn't exist looking at the listed items you could see that it's there Heres' the command prompt log """

idris@DESKTOP-MPI2U9B:/Full_Crash_Web_Development/SECTION 2/html-ts-coffee$ ls Readme.md constants-js.js fundme-anvil.json index-js.js index-ts.ts index.html idris@DESKTOP-MPI2U9B:/Full_Crash_Web_Development/SECTION 2/html-ts-coffee$ pnpm add typescript Already up to date Progress: resolved 1, reused 1, downloaded 0, added 0, done Done in 929ms idris@DESKTOP-MPI2U9B:/Full_Crash_Web_Development/SECTION 2/html-ts-coffee$ ls Readme.md constants-js.js fundme-anvil.json index-js.js index-ts.ts index.html idris@DESKTOP-MPI2U9B:/Full_Crash_Web_Development/SECTION 2/html-ts-coffee$ pnpm tsc index-ts.ts error TS6053: File 'index-ts.ts' not found. The file is in the program because: Root file specified for compilation

Found 1 error.