Reader small image

You're reading from  Blockchain Quick Start Guide

Product typeBook
Published inDec 2018
Reading LevelIntermediate
PublisherPackt
ISBN-139781789807974
Edition1st Edition
Languages
Concepts
Right arrow
Authors (2):
Xun (Brian) Wu
Xun (Brian) Wu
author image
Xun (Brian) Wu

Xun (Brian) Wu is a senior blockchain architect and consultant. With over 20 years of hands-on experience across various technologies, including Blockchain, big data, cloud, AI, systems, and infrastructure, Brian has worked on more than 50 projects in his career. He has authored nine books, which have been published by O'Reilly, Packt, and Apress, focusing on popular fields within the Blockchain industry. The titles of his books include: Learn Ethereum (First Edition), Learn Ethereum (Second Edition), Blockchain for Teens, Hands-On Smart Contract Development with Hyperledger Fabric V2, Hyperledger Cookbook, Blockchain Quick Start Guide, Security Tokens and Stablecoins Quick Start Guide, Blockchain by Example, and Seven NoSQL Databases in a Week.
Read more about Xun (Brian) Wu

Weimin Sun
Weimin Sun
author image
Weimin Sun

Weimin Sun has 20 years' of experience working in the financial industry. He has worked for top-tier investment and commercial banks such as J.P. Morgan, Bank of America, Citibank, and Morgan Stanley, where he also managed large teams for developing IT applications. Weimin has also held corporate titles such as executive director and senior VP in some of these firms. Weimin has in-depth knowledge of the blockchain technology, data science, data architecture, data modeling, and big data platforms. He holds Ph.D, M.B.A and M.Sc degrees. He has co-authored Blockchain Quick Start Guide and published several statistical journal papers.
Read more about Weimin Sun

View More author details
Right arrow

Chapter 4. Building an Ethereum Blockchain Application

In the previous chapter, we reviewed the basic features of smart contracts and how to write a crowdfunding smart contract example. After we deployed the smart contract to the blockchain, we needed to write the web application to interact with the smart contract. Ethereum blockchain provides the web3 API by calling smart contract functions and getters.

In this chapter, we will cover the following topics:

  • What is a decentralized application (DApp)
  • web3js quick overview
  • Setting up an Ethereum development environment
  • Developing and testing a DApp

Decentralized application overview


A decentralized application (or DApp) is an application that uses smart contracts to run. Smart contracts are deployed on the Ethereum virtual machine (EVM). It is similar to a client-server low-tier architecture. A DApp can have a frontend (web) that makes calls to its backend (smart contract) through the web3.js API.

 

The following structure is what we are going to build for our crowdfunding DApp:

Strucuture of what we will be building for crowdfunding DApp

web3.js quick overview

web3.js is an Ethereum JavaScript API, that provides a collection of libraries to interact with a local or remote Ethereum network. The connection between web3js and Ethereum is made by using the HTTP or IPC protocol. In the following table, we quickly review a number of important web3.js API concepts:

DApp development tools


There are some popular blockchain web development tools used being by developers for creating a basic structure of a DApp project. The following sections list a few of these.

 

Truffle

Truffle is an Ethereum DApp end-to-end development tool that provides a development environment for writing, compiling, and deploying test smart contracts and DApps. You can write HTML, CSS, and JavaScript for the frontend; Solidity is for smart contracts, and uses the web3.js API to interact with the UI and smart contract. Truffle Boxes provide helpful boilerplates, which contain helpful modules, solidity contracts and libraries, frontend code, and many other helpful files. The Truffle Boxes help developers to quickly get started with their DApp project.

The Truffle command line uses the following formats:

  • truffle [command] [options]

Here are the frequently used options in command-line tools:

API reference

Description

Example

web3-eth

This package provides an API to interact with the Ethereum blockchain and smart contracts

getBalancesendTransaction, coinbasegetBlockNumber...

Setting up an Ethereum development environment


Follow these instructions to obtain the Ethereum development tools and start up an Ethereum private local blockchain environment (primarily used to run/deploy your smart contract to a local blockchain).

Installing Truffle

Open up the command line and run the following command:

npm install -g truffle

Installing Ganache

Open up the command line and install Ganache's command-line interface as follows:

npm install -g ganache-cli

Creating a Truffle project

To initialize a new DApp project, we can run the truffle init command to initialize an empty Truffle project. This will create the DApp directory structure, including apps, contracts, and tests with Truffle configurations. Since Truffle Boxes provide many working templates, in our DApp example, we will use pet-shop box—a JQuery version of a JavaScript UI library—to develop our crowdfunding DApp example. 

Create a folder called Crowdfunding, open a command-line prompt, navigate to the  Crowdfunding folder...

Deploying a smart contract


As you might have noticed, two migration-related files were created by the previous command, Migrations.sol and 1_initial_migration.js. Migrations.sol stores a number that corresponds to the last applied "migration" script. When you add a new contract and deploy the contract, the number of the last deployment in stores will increase. After the contract has run once, it will not run again. The numbering convention is x_script_name.js, with x starting at 1, that is 1_initial_migration.js. Your new contracts would typically come in scripts starting at 2_....

In our case, we will add a new migration contract to deploy CrowdFunding. Let's create a file called 2_deploy_contracts.js

CrowdFunding.sol defines the constructor as follows:

constructor (address _owner, uint _minimumToRaise, uint _durationProjects,
        string _name, string _website)

To deploy a contract, with optional constructor arguments, you can call the truffle deploy function, deployer.deploy(contract...

Writing a campaign decentralized application


We just deployed our smart contract on our local Ganache blockchain environment. Now, we will start to write UI code to trigger smart contract functions through an RPC call. The source code for this chapter is available here:

https://github.com/PacktPublishing/Blockchain-Quick-Start-Guide/tree/master/Chapter04/CrowdFunding.

Selecting a web3 provider

When we load a web page, we need to connect to a web3 provider. If you have already installed a provider such as MetaMask, you can use your correct provider option, as follows:

App.web3Provider = web3.currentProvider;

In our crowdfunding example, for the sake of simplicity, we will directly connect to our local Ganache server, as follows:

App.web3Provider = new Web3.providers.HttpProvider('http://localhost:8545');

Loading account information

To load accounts, we define a drop-down menu with empty content, as follows:

<div class="form-group">
                <label for="exampleFormControlSelect1">...

Summary


In this chapter, we learned DApp basics and we now understand the web3.js API. By running Ganache as our local Ethereum environment, we could use the Truffle development tool to create a crowdfunding project and write a DApp component. Finally, we deployed and launched the crowdfunding DApp. In the next chapter, we will start to explore the most popular enterprise blockchain—Hyperledger Fabric.

lock icon
The rest of the chapter is locked
You have been reading a chapter from
Blockchain Quick Start Guide
Published in: Dec 2018Publisher: PacktISBN-13: 9781789807974
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
undefined
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $15.99/month. Cancel anytime

Authors (2)

author image
Xun (Brian) Wu

Xun (Brian) Wu is a senior blockchain architect and consultant. With over 20 years of hands-on experience across various technologies, including Blockchain, big data, cloud, AI, systems, and infrastructure, Brian has worked on more than 50 projects in his career. He has authored nine books, which have been published by O'Reilly, Packt, and Apress, focusing on popular fields within the Blockchain industry. The titles of his books include: Learn Ethereum (First Edition), Learn Ethereum (Second Edition), Blockchain for Teens, Hands-On Smart Contract Development with Hyperledger Fabric V2, Hyperledger Cookbook, Blockchain Quick Start Guide, Security Tokens and Stablecoins Quick Start Guide, Blockchain by Example, and Seven NoSQL Databases in a Week.
Read more about Xun (Brian) Wu

author image
Weimin Sun

Weimin Sun has 20 years' of experience working in the financial industry. He has worked for top-tier investment and commercial banks such as J.P. Morgan, Bank of America, Citibank, and Morgan Stanley, where he also managed large teams for developing IT applications. Weimin has also held corporate titles such as executive director and senior VP in some of these firms. Weimin has in-depth knowledge of the blockchain technology, data science, data architecture, data modeling, and big data platforms. He holds Ph.D, M.B.A and M.Sc degrees. He has co-authored Blockchain Quick Start Guide and published several statistical journal papers.
Read more about Weimin Sun

command

Description

compile

Compile solidity contract files.

console

Command-line interface to interact...