leaf

What is DApp (Decentralized Application)#

Currently, common web applications such as Weibo, Douban, and Baidu are based on the client-server model, where all resources are controlled by a central server. Taking Weibo as an example, when entering the URL address www.weibo.com in the browser, the DNS server resolves the URL and returns the IP address of the Weibo server to the browser. The browser sends a request to the Weibo server using this IP address, and the Weibo server returns the corresponding content to the browser, which then displays the result 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 any problems with the central server can cause the entire system to be unusable. In order to avoid the drawbacks of the central server, the concept of decentralized applications (DApps) has emerged.

Decentralized Application (DApp) is an application that runs on a decentralized network. Unlike traditional apps that rely on central servers, the operation of DApps 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 wallet introduction). For example, DApps developed on Ethereum can run in Ethereum browsers like Mist, Ethereum client Parity, mobile browser Status, and browsers with MetaMask wallet plugin installed.

DApps consist of smart contracts and user interfaces (UI). Smart contracts are code running on the blockchain that interacts with the blockchain, while the UI is a 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 as mentioned above. EVM (Ethereum Virtual Machine) is the Ethereum virtual machine, which is the runtime environment for smart contracts in Ethereum, similar to how the Java virtual machine (JVM) executes Java programs. EVM is used to execute smart contracts. In the process of running a DApp, it may require the use of Ether, the encrypted digital currency on Ethereum. Due to the large price fluctuations of Ether, another unit of measurement called Gas is used on Ethereum to ensure relatively stable execution costs. Therefore, when the word Gas is mentioned in the development process of a DApp, it refers to Ether. HTML and JavaScript are languages used for web development, 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, local accounts, transactions and blocks, sending transactions, compiling/deploying smart contracts, and calling smart contracts. The most important part is the API for interacting with smart contracts.

Characteristics of DApp#

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

• Public transparency and trustlessness: DApps generally rely on blockchain technology, and their data is as transparent and trustless as the blockchain.

• No central point of failure: Since DApps are decentralized and do not rely on central servers, the failure of a single node will not cause the application to stop working.

• Consensus mechanism: In centralized applications, data updates and effectiveness are determined by central servers. However, in DApps running on blockchain technology, all nodes in the blockchain collectively decide which data is valid and which data is invalid based on the consensus mechanism. 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. This is also the case in DApps, so running a DApp can also receive a certain amount of encrypted digital currency 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 below.

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 the computing load to "providers" who are willing to rent out their computers for work. These providers share computer resources in exchange for encrypted digital currency 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 below.

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 encrypted digital currency. 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 also extend other required functions through smart contracts. The homepage of Aragon is shown in the figure below.

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 called go-ethereum, the C++ version is called cpp-ethereum, and the Java version is called 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 of the communication library has been packaged into the P2P module of go-ethereum.

• Client: The client's role is to connect to Ethereum and interact 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 to be built here is actually to choose a suitable client to connect to the Ethereum network. Since operations on the Ethereum public chain require the use of Ether (ETH), which is costly, 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.

Ganache allows developers to see how DApps work and the state changes of Ethereum, including viewing account balances, contract and gas costs. The mining control of Ganache can be adjusted to better adapt to the DApp being developed. The installation steps of Ganache are as follows.

First, download and install Ganache. The download address of Ganache is https://truffleframework.org/ganache/. Choose the version of Ganache that corresponds to your operating system, and 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 interface of Ganache, as shown in the figure below.

As shown in the figure, the main interface of Ganache has 4 tabs, which are Account, Blocks, Transactions, and Logs. After Ganache starts, it listens on port 7545 locally and automatically creates 10 test accounts, each with 100 Ether for testing and development. Click on 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 below.

2. Installing and using 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 supports 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 on "Get the Plugin" to go to the plugin library of the corresponding browser for installation. After the installation is complete, you can see the MetaMask fox icon in the browser. Click on this icon to open MetaMask. The first time you use it, there will be a privacy prompt. Choose "Accept" to accept the terms and enter the login page, as shown in the figure below.

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 carefully. It is recommended to copy and save them in a secure place. The mnemonic words are the 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 on 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 below.

The main interface of MetaMask

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

MetaMask is initially connected to the Ethereum main network. Here, we will switch the network to the local network of Ganache. Click on 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 the figure below.

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 the figure below. At this point, it is connected to the local Ethereum testing environment.

Switch to the Ganache account interface, click on 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 below. After the import is successful, it will switch to the new account "Account 3", which has 100 Ether, as shown in the figure below.

At this point, the setup of the local 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), Serpernt (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.