+7

Xây dựng ứng dụng phi tập trung (Dapp)

Các bài viết trước trong chuỗi bài "Xây dựng dapp":

Giới thiệu

Sau bài lí thuyết về lộ trình tiếp cận public blockchain thì mình sẽ giới thiệu cách xây dựng một ứng dụng phi tập trung (DApp) cũng như xây dựng một bản mẫu kết hợp giữa ContractFrontend . Bài đầu tiên sẽ xây dựng một based code cho DApp dựa vào framework Reactjs .

Khởi tạo project

Đầu tiên thì phải chuẩn bị các package cần có, về cơ bản thì cũng chỉ tập trung 2 phần gồm phần contract và phía frontend

Contract

Như đã giới thiệu trong phần trước, framework Truffle cũng đã được đề cập đến với mục đích để dễ dàng test unit cho smart contract, trong trường hợp chưa cài truffle thì có dùng command này để install:

npm install -g truffle

Sau đó unbox gói cơ bản của truffle : webpack Đầu tiên sẽ tạo một folder cho toàn bộ DApp:

mkdir EthCodeBased && cd EthCodeBased

Tiếp đó là unbox gói webpack :

truffle unbox webpack

Tiếp đó init npm:

npm init

Thêm các dependencies , khi đó package.json sẽ có dạng :

{
  "name": "ethcodebased",
  "version": "1.0.0",
  "description": "",
  "main": "truffle-config.js",
  "directories": {
    "test": "test"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "dotenv": "^8.1.0",
    "solidity-coverage": "^0.6.4",
    "truffle": "^5.0.12",
    "truffle-assertions": "^0.9.1",
    "truffle-hdwallet-provider": "^1.0.6"
  }
}

Cuối cùng dùng yarn để install các package:

yarn install

Sau khi chạy hoàn thiện câu lệnh và loại bỏ một số file không cần thiết thì cấu trúc folder sẽ dạng như vậy :

Trong box webpack đã mặc định chứa contract MetaCoin, và đây sẽ là contract để chúng ta làm demo cơ bản. Contract này về cơ bản sẽ là một phiên bản siêu rút gọn của ERC20. Contract này sẽ phát hành 10.000 coin, trong đó mỗi coin sẽ tương ứng với giá là 2 ETH

function getBalanceInEth(address addr) public view returns(uint) {
        return ConvertLib.convert(getBalance(addr),2);
}

function convert(uint amount,uint conversionRate) public pure returns (uint convertedAmount) {
        return amount * conversionRate;
}

Vẫy đã nắm rõ phần Smart contract, tiếp tục sẽ là cách thứ deploy đoạn code này. Để deploy chúng ta sẽ sử dụng mạng ropsten , do đó sẽ cần config lại file truffle-config.js :

const path = require('path');
var HDWalletProvider = require('truffle-hdwallet-provider');
MNENOMIC = process.env.MNENOMIC;
INFURA_API_KEY = process.env.INFURA_API_KEY;
require('dotenv').config();

module.exports = {
  networks: {
    development: {
      host: '127.0.0.1', // Localhost (default: none)
      port: 8545, // Standard Ethereum port (default: none)
      network_id: '*' // Any network (default: none)
    },
    development: {
      host: '127.0.0.1',
      port: 8545,
      network_id: '*'
    },
    ropsten: {
      provider: () =>
        new HDWalletProvider(MNENOMIC, 'https://ropsten.infura.io/v3/' + INFURA_API_KEY),
      network_id: 3,
      gas: 4612388
    },
    kovan: {
      provider: () =>
        new HDWalletProvider(MNENOMIC, 'https://kovan.infura.io/v3/' + INFURA_API_KEY),
      network_id: 42,
      gas: 470000,
      gasPrice: 21
    },
    rinkeby: {
      provider: () =>
        new HDWalletProvider(MNENOMIC, 'https://rinkeby.infura.io/v3/' + INFURA_API_KEY),
      network_id: 4,
      gas: 470000,
      gasPrice: 21
    }
  }
};

Sẽ cần đến 2 thứ là MnemonicInfura key:

  • Mnemonic: Được lấy từ chính Metamask, 12 kí tự seed words, khi lấy thì nhớ lấy tại tài khoản có ETH vì sau này sẽ dùng tài khoản này để deploy
  • Infura key: Được lấy đơn giản bằng cách tạo project trên https://infura.io/dashboard khi đó sẽ tự động sinh ra một PROJECT ID . Infura có thể hiểu là một fullnode

Có đầy đủ các thứ trên thì giờ chỉ cần gọi command để deploy lên mạng ropsten:

truffle migrate --network ropsten

và thành công sẽ như sau:

Sau khi đã deploy xong thì sẽ xuất hiện một folder mới lưu file đã compile của contract:

File Metacoin sẽ chứa 2 phần quan trọng đó là ABIAddress :

  • ABI có thể hiểu rằng nó chứa bản mô tả về các function, các variable của smart contract vừa được deploy
  • Address địa chỉ của contract vừa được deploy, tìm kiếm trong file Metacoin với từ khóa networks sẽ thấy xuất hiện object có key là 3 - tương ứng với chainID của ropsten (mỗi network sẽ có một chainID riêng, mainnet của ETH có chainID là 1)

Vậy là về cơ bản đã xong phần contract, thứ quan trọng cần đạt được ở phần này chính là ABIAddress của smart cotnract. Ngoài sử dụng Truffle thì cũng có thể sử dụng Remix (Sử dụng remix sẽ đỡ tốn gas hơn truffle do không phải tốn thêm gas để deploy contract Migration )

Tips: Có một tips để tối ưu nhất đó chính là compile contract bằng truffle và deploy bằng remix để lấy Address và khi đó là sẽ có một file hoàn hảo với chi phí tối thiểu


All Rights Reserved

Viblo
Let's register a Viblo Account to get more interesting posts.