MiniStats

Create a MiniDapp that displays statistics about the chain and updates in the background

Please read through and complete the pre-requisites before starting the tutorial.

Tutorial Repo

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

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

Intro

In this advanced tutorial, we will create a MiniDapp that:


  • Uses service.js to create a background service
  • Records data from the blockchain
  • Stores the data in a lightweight SQL database
  • Analyses the recorded data to display statistics about the chain


Step 1 - Config file & icon


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

dapp.conf

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



Step 2 - Ministats interface


Let's create a webpage to display the following statistics:


  • Latest block speed
  • Average block speed for the last 10, 100, 500 and 1000 blocks
  • Latest block difficulty (HEX)
  • Current Chain weight (hashes)
  • Current Cascade weight (hashes)
  • Total Chain weight

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

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



Step 3 - Back end (service.js)


We will now create our service.js file which will listen to the chain and record data about the latest block with every NEWBLOCK event.


Initialise MDS and create a sql table to record the following data:


  • Block number
  • Block time and date
  • Block hash
  • Block Difficulty
  • Chain weight
  • Cascade weight

Steps: Create a service.js file containing the following code:


service.js

Create a ministats.js file for your SQL operations and JavaScript functions and insert the following code:


ministats.js

Save the file as service.js and ministats.js in your ministats folder.



Step 4 - Charts


We will now create a chart.js file to display the block speed statistics in a graphical format.

Create a charts.js file containing the following code:


charts.js

Save the file as charts.js in your ministats folder.



Step 5 - 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
service.js
ministats.js
charts.js
styling.css (optional)

  • Open your ministats folder and select all the contents and send them to a zip file.(DO NOT ZIP THE helloworld FOLDER ITSELF)
  • Name the zip folder ministats.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 ministats.mds.zip file and click install

Alternatively, from the Minima Terminal, run the command:

Terminal

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

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


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 ministats 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!