Build Your First Full Stack ‘Hello World’ dApp on Ethereum Blockchain

  1. Install go-ethereum on your machine or Geth. You can refer https://geth.ethereum.org/docs/install-and-build/installing-geth for instructions.
  2. Install NodeJS on your local machine. You can refer this https://nodejs.org/en/ for further instructions.
  3. Install Truffle on your local machine by running $ npm install -g truffle
  1. Create a project called Hello-dAppand go to the project. Hello-dAppis your root directory.
$ mkdir Hello-dApp
$ cd Hello-dApp
{
"config": {
"chainId": 2021,
"homesteadBlock": 0,
"eip150Block": 0,
"eip150Hash": "0x0000000000000000000000000000000000000000000000000000000000000000",
"eip155Block": 0,
"eip158Block": 0,
"byzantiumBlock": 0,
"constantinopleBlock": 0,
"petersburgBlock": 0,
"istanbulBlock": 0,
"ethash": {}
},
"alloc": {},
"coinbase" : "0x0000000000000000000000000000000000000000",
"difficulty" : "0x400",
"extraData" : "",
"gasLimit" : "0x2fefd8",
"nonce" : "0x0000000000000042",
"mixhash" : "0x0000000000000000000000000000000000000000000000000000000000000000",
"parentHash" : "0x0000000000000000000000000000000000000000000000000000000000000000",
"timestamp" : "0x00"
}
$ mkdir datadir
$ geth --datadir ./datadir init genesis.jsonNote: If throws error, shorten the length of root directory folder name, since Geth crashes when data-dir filepath is too long
$ geth --datadir ./datadir --networkid 2019 --rpc --rpcport 8545 --rpcaddr 127.0.0.1 --rpccorsdomain "*" --rpcapi "eth,net,web3,personal,miner" --allow-insecure-unlock
$ geth attach ./datadir/geth.ipc> eth.accounts
> personal.newAccount() //Remember the passphrase
> miner.start()
> web3.personal.unlockAccount(web3.eth.accounts[0], "passphrase");
Note:By default, your accounts in Geth are "locked," which means that you can't send transactions from them. You need to unlock an account in order to send transactions from it through Geth directly or via RPC (though web3 does not support this). In order to unlock an account, you'll need to provide the password, which is used to decrypt the private key associated with your account, hence allowing you to sign transactions.

With that being said, how do you unlock an account? There are a couple different ways you can do it :-
geth --unlock <YOUR_ACCOUNT_ADDRESS> --password <YOUR_PASSWORD>
Unlock account from the Geth interactive Javascript console. Again, the password is optional. If you don't provide it, you'll be prompted to type it in. Note that in earlier versions of Geth, providing the password as a parameter would cause the password to show up in the Geth log, which may be a security concern.

personal.unlockAccount(address, "password")
Geth JavaScript Console
  1. Open new terminal tab with root directory and let’s use truffle initto initialise a project
$ truffle init
module.exports = {networks: {development: {host: "127.0.0.1",port: 8545,network_id: "*", // Match any network idgas:2000000}},compilers: {solc: {version: "0.5.2"}}};
├── contracts
│ └── Migrations.sol
├── migrations
│ └── 1_initial_migration.js
├── test
├── truffle-config.js
└── truffle.js
3 directories, 4 files
$ truffle create contract HelloContract
├── contracts
│ ├── HelloContract.sol
│ └── Migrations.sol
├── migrations
│ └── 1_initial_migration.js
├── test
├── truffle-config.js
└── truffle.js
3 directories, 5 files
pragma solidity >=0.4.22 <0.9.0;contract HelloContract {//constructor() public {//}string message = "Congratulations, you made it. Hello World!";function GetMessage() public view returns(string memory) {return message;}}
const Migrations = artifacts.require("Migrations");const HelloContract = artifacts.require("HelloContract.sol");var Web3 = require('web3');const web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"));module.exports = function(deployer) {//web3.personal.unlockAccount(web3.eth.accounts[0], “passphrase");  //Note: Please enter the same passphrase you were asked to remember //while creating this new account.deployer.deploy(Migrations);deployer.deploy(HelloContract);};
{
"name": "yana",
"version": "1.0.0",
"description": "Yet Another NodeJs App",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js"
},
"author": "Anand Sinha",
"license": "ISC",
"dependencies": {
"cookie-parser": "^1.4.5",
"ejs": "^3.1.6",
"express": "^4.17.1",
"truffle-contract": "^4.0.31",
"web3": "^1.5.2"
}
}
var express = require('express');var cookieParser = require('cookie-parser');var Web3 = require('web3');var contract = require('truffle-contract');var path = require('path');var provider = new Web3.providers.HttpProvider("http://localhost:8545");var app = new express();var port = 3000;app.listen(port, function(err) {if (typeof(err) == "undefined") {console.log("Your application is running on port " + port +"\nView the application in your favourite browser using url: https://127.0.0.1:3000");}});app.set('view engine', 'ejs');var ContractJSON = require(path.join(__dirname, 'build/contracts/HelloContract.json'));var Contract = contract(ContractJSON);Contract.setProvider(provider);var Res;app.get('/', function(req, result) {Contract.deployed().then(function(instance) {instance.GetMessage.call().then(function(res, err) {getname = res.toString();console.log("\nRetrieving data from Blockchain:- " + res.toString());result.render('display', {name: getname});});});});
<!DOCTYPE html><html><head></head><body><h1><%=name%></h1></body></html>
$ truffle compile
$ truffle migrate
$ truffle migrate --reset
├── build
├── contracts
├── datadir
├── genesis.json
├── index.js
├── migrations
├── node_modules
├── package-lock.json
├── package.json
├── test
├── truffle-config.js
├── truffle.js
└── views
$ npm install   //first time
$ npm start
Video Demonstation for Hello-dApp

Please comment down your errors, doubts and suggestions regarding the implementation. Also feel free to ask if you want complete source code explanation of this implementation. Give it a clap if this helps you.

If you are stuck with something feel free to tweet me here and connect me on LinkedIn , next I shall be coming with some dApps for real use cases.

Stay tuned, stay updated. Thanks!

Hope, It helps. Enjoy Blockchain!!

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store