leaf

What is a DApp (Decentralized Application)#

Currently, common web applications such as Weibo, Douban, and Baidu are based on a client-server model, where all resources are controlled by a central server. Taking Weibo as an example, when you enter the URL address www.weibo.com in your browser, the DNS server resolves the URL and returns the IP address of the Weibo server to the browser. The browser then sends a request to the Weibo server using this IP address, and the Weibo server returns the corresponding content to the browser, which displays the results to the user. In this process, the Weibo server plays a major role, while the client (browser) only acts as a connector and display. The central server is opaque to the client, and the client cannot know the behavior of the server, which can easily lead to personal privacy and data leakage. In addition, the high cost of running a central server ultimately needs to be borne by the users, and if the central server encounters problems, it may cause the entire system to be unable to function properly. To avoid the drawbacks of a central server, the concept of decentralized applications (DApps) has emerged.

A decentralized application (DApp) is an application that runs on a decentralized network. Unlike traditional apps that rely on a central server, the operation of a DApp relies on blockchain and smart contracts on the blockchain. Currently, DApps are mainly developed on blockchain platforms such as Ethereum, EOS, Steem, and TRON. In addition, DApps need to run in an environment with wallet functionality (see section 3.2.2 for an introduction to wallets). For example, a DApp developed on Ethereum can run in Ethereum browsers like Mist, Ethereum client Parity, mobile browser Status, and browsers with the MetaMask wallet plugin installed.

A DApp consists of smart contracts and a user interface (UI). The smart contract is the code that runs on the blockchain and is responsible for interacting with the blockchain, while the UI is the front-end page implemented in HTML and JavaScript for user operations. In Ethereum, the user interface can interact with smart contracts through the Web3.js library. The structure of a DApp is shown in the figure below.

In the figure, Mist and Parity are wallets that support DApps. The Ethereum Virtual Machine (EVM) is the runtime environment for smart contracts in Ethereum, similar to the Java Virtual Machine (JVM) used to execute Java programs. The EVM is used to execute smart contracts. During the operation of a DApp, it may need to consume the cryptocurrency on Ethereum, called Ether. Due to the large price fluctuations of Ether, another unit of measurement called Gas is used on Ethereum to ensure relatively stable execution costs. So when the word Gas is mentioned in the development process of a DApp, it refers to Ether. HTML and JavaScript are the languages used to develop web pages, and Web3.js is a JavaScript library provided by Ethereum. It encapsulates Ethereum's JSON RPC API and provides a series of JavaScript objects and functions for interacting with the blockchain, including viewing network status, viewing local accounts, viewing transactions and blocks, sending transactions, compiling/deploying smart contracts, and invoking smart contracts. The most important API is the one that interacts with smart contracts.

Characteristics of DApps#

Unlike common centralized applications, DApps usually have the following characteristics.

• Publicly transparent and trustless: DApps generally rely on blockchain technology, and their data has the same characteristics of being publicly transparent and trustless as the blockchain.

• No central point of failure: Since DApps are decentralized and do not rely on a central server, the failure of a single node will not cause the application to fail to function properly.

• Consensus mechanism: In centralized applications, data updates and effectiveness are determined by the central server. However, DApps running on top of blockchain technology rely on a consensus mechanism, where all nodes in the blockchain collectively determine which data is valid and which data is invalid. A single node cannot make data updates effective throughout the entire blockchain.

• Reward mechanism: In the blockchain, the entire system is generated and maintained by all nodes together. The same is true for DApps, so running a DApp can also receive a certain amount of cryptocurrency rewards.

Well-known DApps#

Based on these characteristics, developers have created a large number of DApps on Ethereum. Here are a few well-known and widely used DApps, such as Augur, Golem, and Aragon.

1. Augur

Augur can be seen as a decentralized market prediction platform that allows users to predict the potential returns of transactions. Compared to expert predictions in the real world, Augur uses "the wisdom of the crowd" to predict real-world events, and sometimes the predictions made by this application are more accurate than those made by experts. When users make correct predictions about events, the platform rewards them. In addition, market creators and users who report events also receive certain rewards. The homepage of Augur is shown in the figure 5-2.

2. Golem

Golem uses computers and data centers to create supercomputers that can be rented externally, and anyone in the world can apply to rent them. This project does not rely on any central server cluster, but distributes computing loads to "providers" who are willing to rent out their computers for work. These providers share computer resources in exchange for cryptocurrency rewards. Compared to centralized projects, this distributed computing power provided by Golem is faster and cheaper. The homepage of Golem is shown in the figure.

3. Aragon

Aragon is an application on Ethereum used to manage decentralized autonomous organizations (DAOs). It allows users to create and manage a decentralized organization, managed by the Aragon Foundation. The platform was created to build and manage DAOs, and this application can vote on the future development direction of products using cryptocurrency. The decentralized nature of Aragon can be used for any organization or company, even non-profit foundations. It implements basic functions of organizational structures such as shareholder registry, token transfers, voting, appointment of positions, financing, and accounting. The behavior of organizations created on Aragon can be customized by modifying the bylaws. In addition, Aragon can extend other required functions through smart contracts. The homepage of Aragon is shown in the figure.

There are many other applications of DApps, and their uses are becoming more widespread with great development potential. Mastering the ability to develop DApps is very valuable. Next, let's start learning about the development of DApps. First, we will learn about the development and use of smart contracts.

Ethereum has versions based on various languages such as Python, Go, C++, and Java. Regardless of the language used for development, the Ethereum blockchain architecture consists of three main parts: core library, communication library, and client.

• Core library: The main function of the core library is to implement the blockchain, Ethereum Virtual Machine (EVM), and consensus mechanism. The Python version of the core library is called pyethereum, the Go version is go-ethereum, the C++ version is cpp-ethereum, and the Java version is ethereumj.

• Communication library: The communication library is a P2P network library that implements node discovery, connection, and data synchronization between nodes, providing data transmission services in a decentralized network. The Python version of the communication library is called pydevp2p, and the Go version is packaged in the P2P module of go-ethereum.

• Client: The client is responsible for connecting to Ethereum and interacting with it, including obtaining data from the Ethereum blockchain network, sending transactions to the network, deploying contracts, and even compiling smart contracts. The client listens on a port opened through JSONRPC and performs corresponding operations upon receiving messages. The Python version of the client is called pyethapp, which listens on port 4000 by default, and the Go version is called geth, which listens on port 8545 by default.

The development environment for smart contracts that needs to be set up here is actually selecting a suitable client to connect to the Ethereum network. Since operations on the Ethereum public chain require the consumption of Ether (ETH), which is not cheap, it is necessary for developers to set up a local Ethereum blockchain network for testing and development.

Setting up a local Ethereum environment#

The Ethereum community has provided a series of tools to help developers quickly set up a local Ethereum development environment. Here, we will use Ganache (formerly known as testRPC) to set up a local Ethereum testing environment.

To understand how DApps work and the state changes in Ethereum, including viewing account balances, contract and gas costs, you can adjust Ganache's mining control to better suit the DApp you are developing. The installation steps for Ganache are as follows.

First, download and install Ganache. The download address for Ganache is https://truffleframework.org/ganache/. Choose the version that corresponds to your operating system and download the Ganache software installation package. After the download is complete, double-click the installation package to install it. Follow the prompts to complete the installation, and then double-click the generated Ganache icon to open the graphical main interface of Ganache, as shown in the figure.

As shown in the figure, the main interface of Ganache has 4 tabs, which are Account, Blocks, Transactions, and Logs. After Ganache starts, it will listen on port 7545 locally and automatically create 10 test accounts, each with 100 Ether for testing and development. Click the "Blocks" icon to switch to the Blocks tab, where you can see that there is only one block in the current blockchain, the genesis block, as shown in the figure.

2. Installing and using the Ethereum wallet#

Here, we will use the MetaMask plugin as the Ethereum wallet. MetaMask is a browser-based plugin type Ethereum digital wallet. It does not need to be downloaded, just add the corresponding extension to the browser. It is very convenient to use (currently supported by Firefox and Chrome browsers). You can visit the MetaMask official website for installation. Enter the website address in the browser: https://metamask.io/, and open the MetaMask homepage.

After entering the MetaMask homepage, click the "Get the Plugin" button to go to the corresponding browser's plugin library for installation. After the installation is complete, you can see the MetaMask fox icon in the browser. Click the icon to open MetaMask. The first time you use it, you will see a privacy prompt. Choose "Accept" to accept the terms and enter the login page, as shown in figure 5-11.

There are two entry points here. The first entry point is to create a new DEN - CREATE button (DEN is the wallet format encrypted by MetaMask with a password), and the second entry point is to import an existing DEN - Import Existing DEN link. Here, we will take creating a new DEN as an example. Enter a password in the password box above and enter it again in the confirmation box below. Then click the "CREATE" button to successfully create a MetaMask wallet. MetaMask will automatically create 12 English mnemonic words for the user. These mnemonic words must be saved well. It is recommended to copy and save them in a secure place. The mnemonic words are credentials for confirming the ownership of the wallet account. They may be used when importing this newly created account into other wallets or when making modifications. You can also click the "SAVE SEED WORDS AS FILE" button to automatically generate a mnemonic word file and save it locally. Click the "I'VE COPIED SOMEWHERE SAFE" button to enter the main interface of MetaMask.

After entering the main interface, you can click the icon in the upper right corner of the page to log out, switch accounts, create accounts, import accounts, and other settings, as shown in the figure.

The main interface of MetaMask

MetaMask automatically creates a wallet address for the user, and the wallet balance is 0 Ether. Click the menu button on the left side of the account to view the detailed information and address of the account, as shown in figure 5-13.

MetaMask is initially connected to the Ethereum main network. Here, we will switch the network to the local network of Ganache. Click the dropdown button to the right of "Main Ethereum Network" at the top of the MetaMask page, and select the "Custom RPC" option, as shown in figure 5-14.

In the new popup window, enter the local RPC address http://127.0.0.1:7545, and then click the "Save" button, as shown in figure 5. At this point, you are connected to the local Ethereum testing environment.

Switch to the Ganache account interface, click the key icon behind the account, and you can see the private key information of the account.

Copy the private key mentioned above, open MetaMask again, select "Import Account", and paste the copied private key into the input box for the private key, as shown in the figure. After successful import, switch to the new account "Account 3", which has 100 Ether, as shown in the figure.

At this point, the setup of the Ethereum testing environment is complete. Next, we can start developing smart contracts.

Smart contracts can be developed using various languages, such as Solidity (syntax similar to JavaScript), Serpent (syntax similar to Python), LLL (syntax similar to Lisp), etc. Among them, Solidity is currently the most popular. Solidity is the official programming language for smart contracts, so we will use Solidity for smart contract development.

Solidity is a high-level language used to write smart contracts that run on the Ethereum Virtual Machine (EVM). Its syntax is similar to JavaScript and it is an object-oriented language. Readers familiar with JavaScript should be able to learn it quickly. Next, we will explain the basic syntax of Solidity.