Skip to content

Latest commit

 

History

History
212 lines (148 loc) · 9.35 KB

README.md

File metadata and controls

212 lines (148 loc) · 9.35 KB
Raw
logo

MindLake Tutorial: Typescript SDK

A step-by-step cookbook for beginner to access Mind Lake !

📔 Table of Contents

🌟 0. Other Programming Languages

🌟 1. Prepare Wallet

🌟 2. Choose a Method to Explore MindLake SDK

In this tutorial, we provide 3 options to explore MindLake SDK with 3 use cases. All options has same dapp code but host in different ways. Here is the overall architecture: image

🎨 2.1 Option 1: Use dApp Page Hosted on Arweave

For beginners without tech background, we recommend to access the already compiled dApp page hosted on Arweave to have a quick glance at the use cases. You can jump to 🎨 6.2 Use Case 1

🎨 2.2 Option 2: Use Docker Image

For developers who don't want to install Node.js, we recommend to use the docker image to run the examples. You can click Use Docker Image.

🎨 2.3 Option 3: Compile with Node.js

For developers who want to explore the source code, we recommend to compile the use cases with Node.js and run the examples. You can continue to read the following sections.

🌟 3. Install Or Upgrade Node If Needed (for Option 3)

  • If you are following Option 2 and Option 3, you can ignore this steps as envrioment is pre-configured.
  • If you are following Option 3 to compile sourcecode locally, please click to view step-by-step to configure Node if Node is not installed or upgraded

🌟 4. Get Examples sourcecode and compile locally (for Option 3)

  • If you are following Option 2 and Option 3, you can ignore this steps as sourcecode are compiled and can run in your browser directly.
  • If you are following Option 3 to compile sourcecode locally, please follow bellow steps to build locally.
  1. Enter the following command in the terminal window to fetch the example code from github:
git clone https://github.com/mind-network/mind-lake-sdk-typescript.git
  1. Enter the path of example code:
cd mind-lake-sdk-typescript/examples
  1. Install depedency
npm install
  1. Check mind-lake-sdk depedency
npm info mind-lake-sdk version

An example of the output is:

1.0.2

🌟 5. Prepare myconfig.ts (for Option 3)

  • If you are following Option 2 and Option 3, you can ignore this steps as configuration is done and can run in your browser directly.
  • If you are following Option 3 to compile sourcecode locally, please follow bellow steps to configure locally.

  1. myconfig.ts contains the settings of parameters used in examples and use cases, you can copy myconfig_template.ts to the name myconfig.ts and modify it as per your requirement.

  2. myconfig.ts will need walletAddress and appKey.

  3. If you want to run the examples of quickStart, Use Case 1 and Use Case 2, you only need to fill out appKey. You can click Create Mind appKey.

  4. If you want to run Use Case 3, you need to fill out the wallets info for all of Alice, Bob and Charlie.

export const appKey = "YOUR_APP_KEY";
export const nodeUrl = "https://sdk.mindnetwork.xyz"; // or change to other node url
export const aliceWalletAddress = "Alice_Wallet_Address";
export const bobWalletAddress = "Bob_Wallet_Address";
export const charlieWalletAddress = "Charlie_Wallet_Address";

🌟 6. Execute the examples

If you are following Option 3, You can execute the following commands to run the quickstart and use cases.

cd examples
npm run start

An example of the output is:

  App running at:
  - Local:   http://localhost:8002 (copied to clipboard)
  - Network: http://192.168.137.1:8002

By default use 8000 as port number. But will auto increase port number if 8000 is used. You may see 8001 or other incremental in your side. The example bellow 8002. Use the port number shown in your terminal. Open a browser and visit http://localhost:8002

For bellow steps, we have list the command and screenshot in Option 3 by default, but also list the urls in Option 1 and Option 2.

🎨 6.1 QuickStart

  1. First, you should create a test wallet for test.

image

image

  1. Click "Quick start with your MetaMask" and you will see the logs while login with your MetaMask wallet

image

image

🎨 6.2 Use Case 1: Single User with Structured Data

  1. Open a browser and visit http://localhost:8002/use_case_1
  2. Click "Test case one with your MetaMask" and you will see the logs while executing Use Case 1.

image

🎨 6.3 Use Case 2: Single User with Unstructured Data

  1. Open a browser and visit http://localhost:8002/use_case_2
  2. Click "Test case two with your MetaMask" and you will see the logs while executing Use Case 2

image

🎨 6.4 Use Case 3: Multi Users with Permission Sharing

  1. You will need 3 wallets for Use Case 3: Alice, Bob, Charlie We show how to create a wallet for Alice for testing purpose.

image

image

Using the same way to create wallet for Bob and Charlie

Copy Alice,Bob,Charlie' wallet address into myconfig.ts to update aliceWalletAddress bobWalletAddress charlieWalletAddress

Note During testing period, please make you have all wallet address are registered in into whitelist: https://sites.google.com/mindnetwork.xyz/mindnetwork/alpha-test. Be more specific, please ensure your Alice, Bob and Charlie are registered and approved. Otherwise, you may experience the error on sharing.

  1. Open a browser and visit http://localhost:8002/use_case_3

image

  1. Switch to Alice's wallet and perform actions as Alice

image

image

Click "Insert Alice Data And Share To Charlie"

image

Wait until "insert data done" appears which means data insertion is completely.

  1. Switch to BOb's wallet and performa actions as Bob

image

image

Click "Insert Bob Data And Share To Charlie"

image

Wait until "insert data done" appears which means data insertion is completely.

  1. Switch to Charlie's wallet and performa actions as Charlie

image

image

Click "Charlie Select Data And Decrypt Data"

image

  1. Final output quick view

image