Klaytn Docs Archive VN
  • Tài liệu của Klaytn
  • -
    • Tổng quan về Klaytn
      • Tại sao nên chọn Klaytn
      • Thiết kế của Klaytn
        • Cơ chế đồng thuận
        • Tài khoản
        • Giao dịch
          • Cơ bản
          • Ủy thác phí
          • Ủy thác phí một phần
          • Ethereum
        • Tính toán
          • Hợp đồng thông mình Klaytn
          • Mô hình thực thi
          • Chi phí tính toán
            • Chi phí tính toán (Các tài liệu trước)
          • Máy ảo Klaytn
            • Máy ảo Klaytn (Các tài liệu trước)
        • Lưu trữ
        • Phí giao dịch
          • Phí giao dịch (Các tài liệu trước)
        • Đồng tiền mặc định của Klaytn - KLAY
        • Nền kinh tế token
        • Quản trị
        • Đa kênh
        • KNI
      • Các giải pháp mở rộng
    • Bắt đầu
      • Triển khai hợp đồng thông minh bằng Foundry
      • Triển khai hợp đồng thông minh bằng Hardhat
      • Triển khai hợp đồng thông minh bằng KEN
        • Khởi chạy nút điểm cuối
        • Nạp tiền vào tài khoản
        • Cài đặt các công cụ phát triển
        • Triển khai hợp đồng thông minh
        • Kiểm tra quy trình triển khai
        • Quản lý tài khoản
          • Tạo tài khoản
          • Quản lý tài khoản
      • Môi trường phát triển
      • Nhận KLAY
    • Hợp đồng thông minh
      • Solidity - Ngôn ngữ của hợp đồng thông minh
      • Hợp đồng đã lập trước
        • Hợp đồng đã lập trước (Các tài liệu trước)
      • IDE và công cụ
        • Truffle
      • Hợp đồng mẫu
        • KlaytnGreeter
        • ERC-20
          • 1. Soạn hợp đồng thông minh ERC-20
          • 2. Triển khai hợp đồng thông minh
          • 3. Tương tác với token ERC-20 từ Ví Klaytn
        • ERC-721
          • 1. Soạn hợp đồng thông minh ERC-721
          • 2. Triển khai hợp đồng thông minh
      • Hướng dẫn kiểm thử
      • Hướng dẫn triển khai
      • Token tương thích Klaytn
      • Di chuyển hợp đồng Ethereum
    • Chạy một Node
      • Triển khai
        • Nút điểm cuối
          • Yêu cầu hệ thống
          • Hướng dẫn cài đặt
            • Tải xuống
            • Hướng dẫn cài đặt
            • Cấu hình
            • Khởi động EN
            • Thử việc cài đặt
          • các lệnh CLI ken
          • API JSON-RPC
        • Core Cell
          • Yêu cầu hệ thống
          • Cấu hình mạng
          • Hướng dẫn cài đặt
            • Tải xuống
            • Trước khi cài đặt
            • Thiết lập nút đồng thuận
              • Hướng dẫn cài đặt
              • Cấu hình
              • Khởi động CN
            • Thiết lập nút proxy
              • Hướng dẫn cài đặt
              • Cấu hình
              • Khởi động PN
            • Kiểm tra Core Cell
          • Giám sát thiết lập
          • Thiết lập H/A
        • Chuỗi dịch vụ
          • Bắt đầu
            • Thiết lập chuỗi dịch vụ 4 nút
            • Kết nối với Baobab
            • Chuyển giá trị chuỗi chéo
            • HA (Tính sẵn sàng cao) dành cho Chuỗi dịch vụ
            • Chuỗi dịch vụ lồng nhau
            • Chuyển giá trị giữa các chuỗi dịch vụ kết nối
          • Hướng dẫn sử dụng tham chiếu
            • Yêu cầu hệ thống
            • Tải xuống
            • Hướng dẫn sử dụng SCN
              • Cài đặt
              • Cấu hình
              • Bắt đầu/dừng SCN
              • Kiểm tra trạng thái nút
              • các lệnh kscn
              • các lệnh homi
            • Hướng dẫn sử dụng SPN/SEN
              • Cài đặt
              • Cấu hình
              • Bắt đầu/dừng nút
              • Kiểm tra trạng thái nút
            • Cấu hình cầu nối
            • Neo
            • Neo KAS
            • Chuyển giá trị
            • Tập tin cấu hình
            • Tập tin bản ghi
            • Genesis JSON
            • Nâng cấp & Nâng cấp căn bản
          • Hướng dẫn sử dụng
        • Tải Về Các Gói Dịch Vụ
          • v1.11.1
          • v1.11.0
          • v1.10.2
          • v1.10.1
          • v1.10.0
          • v1.9.1
          • v1.9.0
          • v1.8.4
          • v1.8.3
          • v1.8.2
          • v1.8.1
          • v1.8.0
          • v1.7.3
          • v1.7.2
          • v1.7.1
          • v1.7.0
          • v1.6.4
          • v1.6.3
          • v1.6.2
          • v1.6.1
          • v1.6.0
          • v1.5.3
          • v1.5.2
          • v1.5.1
          • v1.5.0
          • v1.4.2
          • v1.4.1
          • v1.4.0
          • v1.3.0
          • v1.2.0
          • v1.1.1
          • v1.0.0
          • v0.9.6
          • v0.8.2
    • Hướng dẫn hoạt động
      • Cấu hình
      • Nhật ký nút
      • Ghi bản ghi hoạt động
      • Lỗi & xử lý sự cố
      • Lệnh Klaytn
      • Thay đổi dữ liệu chuỗi
      • Di chuyển dữ liệu chuỗi
    • dApp Developers
      • API JSON-RPC
        • Tham chiếu API
          • eth
            • Cảnh báo
            • Tài khoản
            • Khối
            • Giao dịch
            • Cấu hình
            • Bộ lọc
            • Gas
            • Khác
          • klay
            • Tài khoản
            • Khối
            • Giao dịch
              • Làm việc với các loại giao dịch của Klaytn
            • Cấu hình
            • Bộ lọc
            • Gas
            • Khác
          • net
          • gỡ lỗi
            • Ghi bản ghi
            • Tạo hồ sơ
            • Theo dõi thời gian chạy
            • Gỡ lỗi thời gian chạy
            • Theo dõi VM
            • Theo dõi tiêu chuẩn VM
            • Kiểm tra chuỗi khối
          • quản trị viên
          • cá nhân
          • txpool
          • quản trị
        • Tham chiếu API chuỗi dịch vụ
          • cầu nối chính
          • cầu nối phụ
        • Mã lỗi giao dịch
      • Nhà cung cấp dịch vụ RPC
        • Điểm cuối công khai
      • SDK & thư viện để tương tác với Nút Klaytn
        • caver-js
          • Bắt đầu
          • Gửi giao dịch mẫu
          • Tham chiếu API
            • caver.tài khoản
            • caver.wallet
              • caver.wallet.keyring
            • caver.transaction
              • Cơ bản
              • Ủy thác phí
              • Ủy thác phí một phần
            • caver.rpc
              • caver.rpc.klay
              • caver.rpc.net
              • caver.rpc.governance
            • caver.contract
            • caver.abi
            • caver.kct
              • caver.kct.kip7
              • caver.kct.kip17
              • caver.kct.kip37
            • caver.validator
            • caver.utils
            • caver.ipfs
          • caver-js ~v1.4.1
            • Bắt đầu (~v1.4.1)
            • Tham chiếu API
              • caver.klay
                • Tài khoản
                • Khối
                • Giao dịch
                  • Cũ
                  • Chuyển giá trị
                  • Ghi chú về chuyển giá trị
                  • Cập nhật tài khoản
                  • Triển khai hợp đồng thông minh
                  • Thực thi hợp đồng thông minh
                  • Cancel
                • Cấu hình
                • Bộ lọc
                • Khác
              • caver.klay.net
              • caver.klay.tài khoảns
              • caver.klay.Contract
              • caver.klay.KIP7
              • caver.klay.KIP17
              • caver.klay.abi
              • caver.utils (~v1.4.1)
            • Di chuyển từ web3.js
        • caver-java
          • Bắt đầu
          • Tham chiếu API
          • caver-java ~v1.4.0
            • Bắt đầu (~v1.4.0)
            • Di chuyển từ web3j
        • ethers.js
        • web3.js
      • Hướng dẫn
        • Bộ công cụ trực tuyến của Klaytn
        • Ví dụ về ủy thác phí
        • Count DApp
          • 1. Thiết lập môi trường
          • 2. Sao chép Count DApp
          • 3. Cấu trúc thư mục
          • 4. Soạn hợp đồng thông minh
          • 5. Tổng quan về mã Frontend
            • 5-1. Thành phần số khối
            • 5-2. Thành phần xác thực
            • 5-3. Thành phần đếm
          • 6. Triển khai hợp đồng
          • 7. Chạy ứng dụng
        • Klaystagram
          • 1. Thiết lập môi trường
          • 2. Sao chép Klaystagram DApp
          • 3. Cấu trúc thư mục
          • 4. Soạn hợp đồng thông minh Klaystagram
          • 5. Triển khai hợp đồng
          • 6. Tổng quan về mã Frontend
          • 7. Trang thông tin
            • 7-1. Kết nối hợp đồng với Frontend
            • 7-2. Thành phần UploadPhoto
            • 7-3. Thành phần nguồn cấp dữ liệu
            • 7-4. Thành phần TransferOwnership
          • 8. Chạy ứng dụng
        • Building a Buy Me a Coffee dApp
          • 1. Project Setup
          • 2. Creating a BMC Smart Contract
          • 3. Testing the contract using scripts
          • 4. Deploying BMC Smart contract
          • 5. Building the BMC Frontend with React and Web3Onboard
          • 6. Deploying Frontend code on IPFS using Fleek
          • 7. Conclusion
        • Migrating Ethereum App to Klaytn
        • Connecting MetaMask
        • Connecting Remix
        • Verifying Smart Contracts Using Block Explorers
      • Công cụ dành cho nhà phát triển
        • Ví
          • Kaikas
          • Ví Klaytn
          • Két Klaytn
            • Thiết kế két Klaytn
            • Tạo két
            • Thêm tài sản
            • Gửi tài sản
            • Tương tác hợp đồng
            • Trình xây dựng giao dịch
            • Các điểm đến nút
            • Câu hỏi thường gặp
          • Thư Viện Ví
            • Web3Auth
            • Web3Modal
            • Web3-Onboard
        • Oracle
          • Hệ Thống Orakl
          • Witnet
          • SupraOracles
        • Trình duyệt khối
          • Klaytnscope
          • Klaytnfinder
        • Klaytn Contracts Wizard
    • Glossary
  • ---
    • Lịch sử nâng cấp căn bản của Klaytn
    • Klaytn 2.0
      • Gói Metaverse
      • Tính hoàn thiện và cải tiến
      • Tương thích với Ethereum
      • Quản trị phi tập trung
      • Quỹ sinh thái lớn
    • Câu hỏi thường gặp
    • Mã nguồn mở
    • Điều khoản sử dụng
    • Ngôn ngữ
  • ℹ️Latest Klaytn Docs
Powered by GitBook
On this page
  • 4.1 Deploying BMC Smart contract to Klaytn Testnet
  • Step 1 - Creating a .env file
  • Step 2 - Setting up Hardhat Configs
  • Step 3 - Creating deployment scripts
  • 4.2 Interacting with BMC Smart Contract
  1. -
  2. dApp Developers
  3. Hướng dẫn
  4. Building a Buy Me a Coffee dApp

4. Deploying BMC Smart contract

4.1 Deploying BMC Smart contract to Klaytn Testnet

After successfully testing the functionalities of our BMC smart contract, let’s proceed to deploy to the Klaytn Testnet Baobab in the following steps:

Step 1 - Creating a .env file

Now create your .env file in the project folder. This file helps us load environment variables from a .env file into process.env.

Paste this command in your terminal to create a .env file

touch .env

After creating your file, lets configure our .env file to look like this:

BAOBAB_URL= "Your RPC URL"
PRIVATE_KEY= "your private key copied from metamask wallet"

Step 2 - Setting up Hardhat Configs

Paste this configurations in your hardhat.config.js file

require("@nomicfoundation/hardhat-toolbox");
require("dotenv").config();
const BAOBAB_URL = process.env.BAOBAB_URL;
const PRIVATE_KEY = process.env.PRIVATE_KEY;
/** @type import('hardhat/config').HardhatUserConfig */
module.exports = {
  solidity: "0.8.18",
  defaultNetwork: "hardhat",
  networks: {
    baobab: {
      url: BAOBAB_URL,
      accounts: [PRIVATE_KEY],
    }
  }
};

Step 3 - Creating deployment scripts

To create a new deployment script that deploys this smart contract to a specified network, create a new file scripts/deploy.js and paste in the code below:

const hre = require("hardhat");
async function main() {
  const BuyMeACoffee = await hre.ethers.getContractFactory("BuyMeACoffee");
  const buyMeACoffe = await BuyMeACoffee.deploy();
  await buyMeACoffe.deployed();
  console.log(`BuyMeACoffee Contract Address`, buyMeACoffe.address);
}
// We recommend this pattern to be able to use async/await everywhere
// and properly handle errors.
main().catch((error) => {
  console.error(error);
  process.exitCode = 1;
});

Now that we have our configurations all set, let’s deploy to Klaytn Testnet Baobab by running the command below:

npx hardhat run scripts/deploy.js --network baobab

Once the contract deploys successfully, your terminal should look like this:

BuyMeACoffee Contract Address 0x0bEd1ed7B205d8c18e38A20b5BaB6e265A96d1AC

Congratulations on deploying your BMC smart contract on Klaytn Baobab Network! You can verify this transaction on Klaytnscope by pasting your address in the search field.

4.2 Interacting with BMC Smart Contract

In this section, you will learn how to use hardhat scripts to withdraw the coffee tips sent into the smart contract. To get started, create a new file withdraw.js in your scripts folder and paste the code below:

const hre = require("hardhat");

// contract address of BMC Contract
const buyMeACoffeAddress = "Paste BMC contract address";

// address of the contract deployer
// useful when calling the withdrawCoffeTips() function
// ensure that this address is the SAME address as the original contract deployer
const deployerAddress = "Paste deployer address";
// get the balance of a specified address
async function getBalance(address) {
    const balanceBigInt = await hre.ethers.provider.getBalance(address);
    return hre.ethers.utils.formatEther(balanceBigInt)
}

async function main() {

  // initialize the deployerAddress to a signer object
  // this will be useful when calling the withdrawCoffeTips() to the owner address
  const signer = await hre.ethers.getSigner(deployerAddress);

  // instantiate the BMC contract
  const BuyMeACoffee = await hre.ethers.getContractAt("BuyMeACoffee", buyMeACoffeAddress, signer);

  const balanceBefore = await getBalance(signer.address);
  const contractBalance = await getBalance(BuyMeACoffee.address);
  console.log(`Owner balance before withdrawing tips: ${balanceBefore} KLAY`);
  console.log(`Contract balance before withdrawing tips:  ${contractBalance} KLAY`);

    // Withdraw funds if there are funds to withdraw.
    if (contractBalance !== "0.0") {
        console.log("withdrawing funds..")
        const withdrawCoffeTxn = await BuyMeACoffee.withdrawCoffeTips();
        await withdrawCoffeTxn.wait();
        // check owner's balance after withdrawing coffee tips
        const balanceAfter = await getBalance(signer.address);
        console.log(`Owner balance after withdrawing tips ${balanceAfter} KLAY`);
      } else {
        console.log("no funds to withdraw!");
      }
}
// We recommend this pattern to be able to use async/await everywhere
// and properly handle errors.
main().catch((error) => {
  console.error(error);
  process.exitCode = 1;
});

As you can see from the code above, having instantiated the BMC contract, the scripts will execute the withdrawCoffeTips function only when the contract balance is greater than zero. Makes sense right?

Yes! In the event where the contract has no funds, it prints "No funds to withdraw" hence saving us some gas from contract invocation.

To see this in action, lets run the script below:

npx hardhat run scripts/withdraw.js --network baobab

On successful execution of the scripts, your terminal should look like this:

Ayomitans-MacBook-Pro:smart-contract oxpampam$ npx hardhat run scripts/withdraw.js --network baobab
Owner balance before withdrawing tips: 155.8337532 KLAY
Contract balance before withdrawing tips:  2.0 KLAY
withdrawing funds..
Owner balance after withdrawing tips 157.83298835 KLAY

You can see from the output that the owner balance increased by 2 KLAY after withdrawing the coffee tips.

Now that we have our contract deployed and all functionalities tested, it is time to build out the frontend.

The frontend will bring the BMC functionality to live i.e we can now visualize how we interact with the BMC smart contract.

Previous3. Testing the contract using scriptsNext5. Building the BMC Frontend with React and Web3Onboard

Last updated 1 year ago