Skip to content

Modules

James Dunseith edited this page Oct 12, 2023 · 9 revisions

Onboarding

Module 100: Get started

Here is a checklist of what you will need to know in order to participate in Mesh PBL.

Note: we are using SLTs as pre-requisites in this Module 100

Note: can pull content from PPBL 305

Describe pre-reqs: You need to know about Transactions and UTxOs. If you don't have this basic knowledge, check out Plutus PBL. Throughout this course, we will link to specific lesson in Plutus PBL to help you learn more about concepts...

  • 100.1 I have a Cardano Browser wallet extension installed on my computer.
  • 100.2 I have NodeJS installed on my local computer.
  • 100.3 I am familiar with some essentials of the React framework, like components, props, and hooks.
  • 100.4 I can integrate Mesh into a new Project.

Mini Project: Do this -- https://meshjs.dev/guides/nextjs -- we'll be using NextJS as the example in this course.

Module 100: Links

  • Cardano Browser Wallets (for example PPBL Module 100)
  • About NodeJS + Link to Tutorial
  • About React + Link to Tutorials about key concepts: [useState, useEffect, conditional rendering, children, props] about React.

Narrative (move to another file): Here’s the stack we’re using We’re using NextJS (for now! — later, App Wallet is more general. also, other dev frameworks might be added to course - this is an example of how community can contribute to further maintenance/development of Mesh PBL)

Module 101: Browser Wallet Integration

  • 101.1: I can use Mesh to connect a CIP-30 compliant wallet to a decentralized application.
  • 101.2: I can see information about my wallet in my web browser.
  • 101.3: I can build a component that lists the assets in my browser wallet.

Assignments

  • Mini project: Build your own wallet connect UI component
  • Mini project: Build an Asset Gallery

Module 102: Mesh React

Convenience — now that you built a wallet connect component, let’s look at how @mesh/react helps!

  • 102.1 I can set up Mesh Provider so that I can use Mesh React Components and Hooks.
  • 102.2 I can connect or disconnect wallet using useWallet hook.
  • 102.3 I can get the connected wallet address using useAddress hook.
  • 102.4 I can get a list of assets or tokens in connected wallets using useAssets hook.
  • 102.5 I can get information regarding the amount of ADA in lovelace in the connected wallet using useLovelace hook.
  • 102.6 I can get information about the connected wallet network using useNetwork hook.

Building Background Knowledge (BBK)

  • 201: Transactions
    • I can build, sign and submit transactions to send assets
  • 202: Minting
    • I can mint tokens and I understand assets’ policy ID, name and metadata
  • 203: Multi-Sig
    • I can create multi-sig transactions to
  • 204: Interact Smart Contract
    • I can
  • 205: Staking
    • I can
  • 206: Wallet Verification + Message Signing
    • I can mini project:
  • 207: App Wallet
    • I can use the App Wallet to sign transactions
    • mini project: multi-sig wallet?