Pre - requisites

There are no special hardware requirements for building a MiniDapp.

You will need:

A laptop or server with the command line interface open A code editor, for example VS Code

and Java installed

To check if you already have Java installed type java -version in your Terminal/CLI

The minima.jar java file downloaded

Start a single test node

Starting a node with -genesis will start your own private test chain from the genesis (first) block with 1 billion coins to spend.

Create a new folder called minima and copy the minima.jar into that folder.
Copy the path to the folder
Open a new command line interface and cd into that folder - Enter the following:

Termianl
java -jar minima.jar -data minidata -basefolder minidata -genesis -test -nop2p -mdsenable -mdspassword [INSERT PASSWORD]

Replace INSERT PASSWORD with a custom password for the test node.

You will notice the minidata folder has been created in your minima folder. This will start a node on the default ports of 9001-5.

You should see the node starting up. You can type commands directly into the console, try entering balance to check your balance.

Type help for the full list of Minima commands.
Access your MiniDapp hub by going to https://127.0.0.1:9003
Accept the security warning and login with the password you set above

Start a second test node

We create a second node to test transactions between two nodes, note that we will need to:

remove the genesis parameter,
change the data and base folders,
add the port parameter to start it on a different port,
add the connect 127.0.0.1:9001 parameter to connect this node to the genesis node.

Node 2

Open a new command line window and cd into the folder where the minima.jar is located.
Enter the following command:

Termianl
  java -jar minima.jar -data minidata2 -basefolder minidata2 -test -nop2p -mdsenable -port 10001 -connect 127.0.0.1:9001 -mdspassword [INSERT NODE2 PASSWORD]

Replace INSERT PASSWORD with a custom password for the test node.

Optionally set a port of your choice, we use 10001 here

When you see Connected attempt success to 127.0.0.1:9001 in the logs, this confirms that the two nodes are connected.

You now have two nodes up and running that are connected to each other!

That's it, let's get started!

Intro

In this intermediate tutorial, we will create a simple wallet MiniDapp that:

Shows your balance
Shows one of your Minima wallet addresses
Provides a method to send Minima to another Minima wallet

Step 1 - Config file & icon

Create a new folder for your wallet MiniDapp, call it mywallet.
Inside that folder, create your dapp.conf. file as below

dapp.conf
{
  "name": "My Wallet",
  "icon": "favicon.ico",
  "version": "1.0",
  "description": "My Wallet MiniDapp"
}

Choose an icon for your MiniDapp and save it in your mywallet folder

Step 2 - Wallet interface

Now we will create a simple webpage which will be the home page of your wallet that includes the following functionality:

Shows your balance
Shows one of your wallet addresses
Provides the ability to send Minima to another Minima wallet

Steps:

Ensure you have the latest mds.js downloaded and save it in your mywallet folder. Create an index.html file containing the following code:

index.html
<head>
  <!--   The MINIMA MDS JavaScript Library -->
  <script type="text/javascript" src="mds.js"></script>
  <link rel="icon" type="image/x-icon" href="favicon.ico" />
  <title>My Wallet</title>
</head>
<body>
  <!-- HTML Elements for wallet -->
  <h2>My Wallet</h2>
  <p>Current confirmed balance: <span id="balance"></span></p>
  <p>Current unconfirmed balance: <span id="unconfirmed-balance"></span></p>
  <p>Wallet Address: <span id="address"></span></p>

  <label for="address">Wallet Address</label>
  <input type="text" name="sendAddress" id="sendAddress" placeholder="address">
  <label for="amount">Amount</label>
  <input id="amount" name="send" placeholder="amount" type="text" />
  
  <p>Status :<span id="status"></Status:span></p>

  <button onclick="Send()">Send</button>

  <script type="text/javascript">

    // Send function to send Minima
    function Send() {
      //Get the address and amount from the input fields
      const sendAddress = document.getElementById("sendAddress").value
      const sendAmount = document.getElementById("amount").value
      //Call the send command with the address and amount
      MDS.cmd(
        `send address: ${sendAddress} amount: ${sendAmount}`,
        function (res) {
          //Catch error and display an error message
          if(res.error){         
          document.getElementById("status").innerText = "Something went wrong, please try again."
          } else {
            //Provide success message if transaction is successful
            document.getElementById("status").innerText = "Transaction Sent"
          }
        }
      )
    }

    // GetBalance function to get the current balance
    function GetBalance() {
      //Call the balance command
       MDS.cmd("balance", function (res) {
          //Get the current balances from response
          const balanceResponse = JSON.stringify(res.response[0].confirmed)
          const unconfirmedBalanceResponse = JSON.stringify(res.response[0].unconfirmed)
          // Assign the current balance to the variables and remove the quotes from the response
          const currentConfirmedBalance = balanceResponse.slice(1, -1)
          const unConfirmedBalance = unconfirmedBalanceResponse.slice(1, -1)
          //Display current balance on page
          document.getElementById("balance").innerText = currentConfirmedBalance
          document.getElementById("unconfirmed-balance").innerText = unConfirmedBalance
        })
    }

    // GetAddress function to get your current address
    function GetAddress(){
      //Call the getaddress command
      MDS.cmd("getaddress", function (res) {
          //Get the current address from response
          const addressResponse = JSON.stringify(res.response.address)
          //Assign the current address to the variable
          const address = addressResponse.slice(1, -1)
          //Display current address on page
          document.getElementById("address").innerText = address
        })
    }

    //Init Minima Api
    MDS.init(function (msg) {
      //Listens for the initial inited event
      if (msg.event === "inited") {
        //Once MDS is ready call the balance function created above
        GetBalance()
        //Once MDS is ready call the getaddress function created above
        GetAddress()
      }
      if (msg.event === "MDS_TIMER_10SECONDS") {
        //Run the balance function every 10 seconds
        GetBalance()
      }
      
    })
  </script>
</body>

save the file as index.html in your mywallet folder.

Step 3 - Zip up and install your MiniDapp

The next step is to zip up your wallet and install it onto your node.

You should now have a folder structure that looks like this:

dapp.conf

favicon.ico

index.html

mds.js

styling.css (optional)

Open your mywallet folder and select all the contents and send them to a zip file.(DO NOT ZIP THE helloworld FOLDER ITSELF)
Name the zip folder mywallet.mds.zip
Log into your MiniDapp Hub at https://127.0.0.1:9003 and click on the + button to install your MiniDapp.
Select your mywallet.mds.zip file and click install

Alternatively, from the Minima Terminal, run the command:

Terminal
mds action:install file:C:Usersyournamehelloworld.mds.zip

Example: mds action:install file:C:\Users\yourname\mywallet.mds.zip

Now you can open your MiniDapp Hub and see your MiniDapp installed.

Step 4 - Test your MiniDapp

Let's test the wallet to ensure it works as expected.

Go to the command line where node 2 is running
Run the balance command, the balance should be 0
Run the getaddress command and copy the address or miniaddress
Go to your miniDapp and paste in the address and enter an amount to send
Click Send. You should be prompted to approve the transaction from the Pending miniDapp.
Open the Pending MiniDapp and approve the transaction
Return to your wallet and see the balance change
Go back to the command line for node 2 and run the balance command again to see the updated balance

Setp 5 - Debug settings

When developing, it is useful to run your code locally to avoid having to zip up and install your miniDapp onto a node every time you make a change.

To see live changes in your MiniDapp we recommend installing the Live Server VS Code extension (or any other live server feature that your code editor has)
Install the MiniDapp onto your MiniHub, open it and copy the long UID string located in the URL in the browser after index.html?uid=
Open up your mywallet folder and open the mds.js file
Find the DEBUG_MINIDAPPID: variable and replace 0x00 with your minidapp UID string
Navigate back to your MiniHub and copy the host number in the URL e.g. 127.0.0.1 and the port number e.g. 9003
Find the DEBUG_HOST: variable and paste your host number surrounded by double quotes “
Find the DEBUG_PORT: variable and paste your port number
Save mds.js and start your live server. If using Live Server in VS code, click on Go Live in the bottom right to launch it.

That's it you are all set! Now try solving the additional exercises with help from the console located in your browser.

Additional exercises

Update your wallet to display the sendable, confirmed and unconfirmed balances. Do you know the difference between the three?
Add a button that enables the user to change their receive address shown (Hint: getaddress will return 1 of 64 of the user's default wallet addresses at random)
Update the send functionality to include a burn. Hint: run help command:send to learn how to add a burn to your transaction.
Notify the user when their balance changes

Simple Wallet