How to build a dapp on a private Ethereum network : Part — 5

Amey
Coinmonks
6 min readJun 4, 2020

--

This is a series of 5 articles for developing a decentralized application (dapp) on a network of 2 private Ethereum nodes without using any third-party APIs or apps (such as Infura, MetaMask, etc.). This tutorial covers the essential elements of what I learn during my research project at CSIR-CEERI.

I have covered sections I-VIII in parts 1–3. If you feel lost, you can read through the previous 3 parts whose links are mentioned at the bottom of this article in the All series links section.

Recently released — “Part 5 : Section VIII-IX

Table of Contents

Here, you can find a list of the sections and subsections that I have divided this tutorial into :

I. Creating the project

II. Installing prerequisites

III. Configuring the network

IV. Designing the smart contract

V. Setting-up the Truffle project

VI. Launching the network

VII. Building the web app

VIII. Testing the dapp

IX. Modifying the dapp

If you want to skip to a particular section, you can scroll down to the All series links section at the end of this article.

The dish is served. Needless to say, it is mouth-watering. You are the chef and you need to taste it first — to make sure everything is just right. Besides, a good chef isn’t afraid to experiment. After tasting it, we will quickly glance through a few points to make it easier for you to play around.

Here, we will test the dapp we have developed and discuss the steps to follow if you want to tweak the dapp.

VIII. Testing the dapp

It is now time to test the dapp. Given below are the possible scenarios that the dapp has been built to sustain. This section explains the correct method of execution for the process to be successfully demonstrated.

  • Restart a node, here Node-1, in a terminal opened in TruffleDapp (T1) using the commands mentioned in Restarting Node-1 (Section VI, Point 3, Sub-part 1b).
  • In a new terminal window in TruffleDapp (T2), run $ npm run dev to start the server.
  • Open the link http://localhost:3000/index in a web browser. It should look similar to the image below.

1. Proper Flow of Execution

  • Enter your name in the text field and click on “Save Name” button. Within 5–10 seconds, you will receive a confirmation as OUTPUT. This implies that your name has been submitted to the network to be stored in the string name variable of your smart contract.

Pro-tip : We have used multiple console.log() statements in our app.js file. Hence, you can press Ctrl + Shift + I to open the Inspection window, where you will receive further prompts on the status of this dapp execution.

  • Next, click on “Get Name” button to fetch your name from the smart contract name variable and display it in the OUTPUT field.

2. Error handling

Some basic adverse scenarios have been taken care of in our code. For example :

  • If you leave the text field blank (i.e. do not enter a valid string) and click on the “Save Name” button, the ERROR field will show “Valid name is required !”
  • Then, if you click on “Get Name”, a message stating “No output as no name is entered” is displayed as an ERROR (since the name variable stores null, an invalid string)

IX. Modifying the Dapp

Explained below are the steps to undertake if some changes are to be made to the dapp.

Note : If the NodeJS server and/or go-ethereum node are running, abort them, and then follow the guidelines as given.

a) Binding A System IP

The NodeJS server and go-ethereum node are still running on localhost or 127.0.0.1. In computer networking, localhost is a hostname that means this computer, which is the default name describing the local computer address. When setting up a web server or software on a web server, 127.0.0.1 is used to point to the software on the local machine.

It is important to verify that the NodeJS server and go-ethereum node will function appropriately when bound to an IP address. To set the host to your IP address, follow the steps given below :

  1. Find out your IP address. For Ubuntu, click on the “Network” icon on the top bar and then select “Connection Information” option and copy the value of the field labeled “IP Address”.
  2. Replace all instances of localhost or 127.0.0.1 with this IP address in the .env, main.js, app.js and truffle-config.js files.
  3. Also, replace the 127.0.0.1 in the geth commands with your IP address (here, referred to as IP_ADDRESS). For example, for Node-1, the modified commands would be :

b) Altering the HTML, CSS

Any change to the design of the web page is brought about by editing the corresponding HTML and CSS files. To preview the alterations, save the file, run the NodeJS server by executing either $ npm run start or $ npm run dev in a terminal open in TruffleDapp, and open the respective URL in a web browser.

c) Add New JS Functions

In order expand dapp capabilities, adding HTML components (explained in B) Altering the HTML, CSS) and implementing JS functions may be required. To do so, follow the steps as given :

  • Open the app.js (or the concerned JS file) in an editor and add the desired functionality.
  • In a terminal open in TruffleDapp, run $ npm run dev. Test the dapp, and debug if any issues are encountered.

d) Modifying the Smart Contract

If a modification is required in the module of the smart contract that runs on the private ethereum network, do as mentioned below :

  • Open the IDManagement.sol file (or add a new .sol file, if you must) in the contracts folder and make the desired changes.
  • In a terminal open in TruffleDapp (T1), run commands $ truffle compile and $ truffle migrate in succession
  • Run $ npm run dev in T1. Test the dapp, and debug if any issues are encountered

Ba-Dum-Tss !! The dapp is ready to be toyed around with. Through these 5 articles, we have covered the development of a simple decentralized application. Moreover, it does not rely on any third-party APIs which frees you from being dependent on them. I am sure you have plenty of ideas buzzing in your head. Go ahead... Code and create !

I will be publishing more such interesting articles and I’ll definitely post them on Twitter. Follow me here to stay updated, or you could slide into my DMs and share your ideas with me.

P.S. — Clap 10 times if you liked the article! Comment below to let me know your thoughts or if you want to share some hacks.

All series links

In case you want to skip ahead and jump onto a specific section, you can use the links below for reference. Refer to the Table of Contents below to match a section with its corresponding topic.

Part-1 : Section I-III

Part-2 : Section IV

Part-3 : Section V-VI

Part 4 : Section VII

Part 5 : Section VIII-IX

Get Best Software Deals Directly In Your Inbox

--

--

Amey
Coinmonks

A product afficianado and an endorser of decentralization | Everything about me is at ameys.in