介紹 Truffle Suite 和Dapp Development

Image for post
Image for post

完整的Dapp開發套件?

的發展使得dapp開發看起來更具吸引力。現在是你跳進這個工具集的好時機嗎?

從2016就開始發布使用,到至今有快三年的時光,他們一直不斷的優化改進,讓Dapps 開發者更容易開發 Ethereum Dapps,記得我一開始使用時還是使用testrpc (truffle develop 和 Ganache 的前身),常常有問題,而如今已成為一個整個開發套件,以下就是介紹整個套件,如有任何問題請留言讓我知道修改。

包括3個主要工具; Truffle:一體化Ethereum dapp開發環境,Ganache:一個具有自己的GUI的個人可配置開發區塊鏈,以及Drizzle:該套件的最新版本,用於在前端的redux存儲中同步合同狀態,事件和事務數據 — 與React一起使用效果不足為奇。

現在,這個是很多要學習的;分散的應用程式開發是一個相對較新的語詞。新工具帶來了新的工作流程,新的測試,部署和更新方式。我們將在這裡做的是分解3個Truffle套件工具,它們的功能,如何安裝和使用它們,最後使用Truffle Box概述Drizzle React項目 — 我們可以使用下載的預製Truffle樣板truffle unbox命令;稍後會詳細介紹。

這篇不是關於Solidity編程的討論,而是作為整個Dapp開發過程的概述.

Truffle

Truffle是一個開發環境,用於以太坊dapps的測試框架和部署管道 — 或任何使用EVM的區塊鏈。本節分解了這究竟是什麼意思。為簡單起見,我們僅參考以太坊(ETH),而不是“任何EVM區塊鏈”,因為以太坊(ETH)主網是Truffle的主要目標生產區塊鏈。

Truffle在終端(Terminal)中運行,因此有一系列方便的命令供我們在開發dapp的不同階段使用。

這樣的開發過程可能是什麼樣的?讓我們打破一個高級別的假設情景,以初步了解使用Truffle的感覺。讓我們開始一個新的基於Truffle的dapp項目:

  • 使用Truffle的 unbox命令,我們可以首先下載一個預先構建的樣板項目來引導我們的dapp。這些預建項目包括React with Truffle和Webpack樣板,以及ERC20智能合約示例和教程。要在這個階段了解盒子,請在此處查看。
  • 如果我們想從頭開始創建項目,則在根項目目錄中運行 truffle init 。這將創建一個非常簡單的骨骼結構供您使用。除非您的dapp是非常適合的,絕對沒有適合的樣板,否則 unboxing 更有利於 truffle init.
  • 由於項目現在已經在我們的機器上unbox(或初始化),我們注意到根項目目錄中的文件夾結構; Truffle已經包含範例和有 init命令所遵循的結構;即 contracts/, migrations/tests/。除了這些文件夾之外, truffle-config.js文件也將加入一起,作為Truffle的配置文件。讓我們看看這些文件夾的組成部分。

Truffle Project Structure

Image for post
Image for post

contracts/ — 包含您的Solidity (.sol)和Vyper (.vy)合同文件。與項目關聯的所有智能合約都存儲在此文件夾中。

migrations/ — 包含您的遷移(migrations)文件。讓我們停在這裡並更詳細地定義遷移。遷移是用Javascript編寫的文件,以編程方式將智能合約部署到以太坊區塊鏈上。

遷移本質上只是一組指令。最簡單的遷移示例如下所示:

var MyContract = artifacts.require("MyContract");module.exports = function(deployer) {
// deployment steps
deployer.deploy(MyContract);
};

我們正在導入 MyContract Solidity文件,並使用Truffle提供的 deployer 對象將所述合同部署到區塊鏈中。

但是哪個區塊鏈?

它可以是mainnet,testnet或本地私有區塊鏈,Truffle提供2個用於測試目的。 Truffle提供2種本地區塊鏈解決方案:Truffle Develop和Ganache。 Truffle Develop和Ganache都為我們生成了一個區塊鏈來測試我們的代碼。但是,Truffle Develop只為我們提供了CLI,Ganache還為我們提供了一個功能完備的GUI,使其功能更強大,用戶友好。我們將進一步詳細探討這些內容。

Image for post
Image for post
Ganache
Image for post
Image for post
Truffle develop

談回到 /migrations。現在,為了使Truffle Migrations工作,需要遷移合同,其目的是提供用於管理Truffle部署的特定接口。該合同是使用 truffle init自動生成的,並且應存在於所有 Truffle盒中。

由於此遷移合同是必需的,因此 migrations/文件夾中還有一個 1_initial_migration.js文件可供部署合同。 1_文件名前綴僅用於人類可讀性。

Image for post
Image for post

隨著向項目引入更多遷移,此數字應遞增。事實上,這是遷移的有意設計特徵; Truffle會記住已經運行了哪些遷移,並且只有在特殊的 --reset標誌與truffle migrate一起使用時才會重新運行每次遷移。依照遷移資料夾裡的檔案名稱的前面數字來遷移,並觀察您的項目如何發展。

如下面遷移資料的遷移順序為 1_initial_migration.js → 2_deploy_contracts.js

Image for post
Image for post

Truffle提供了一些關於遷移的文檔。要立即閱讀它們,請訪問https://truffleframework.com/docs/truffle/getting-started/running-migrations

我們沒有涉及的最後一個文件夾是 tests/

tests/ — 包含單元測試您的智能合約。測試可以用Javascript,Typescript,Solidity和現在的Vyper編寫,所有這些都存儲在同一目錄下。在Javascript中,Truffle使用Mocha測試框架和Chai進行斷言( assertions),為工作提供經過試驗和測試的工具。

對於像Truffle Develop和Ganache這樣的本地開發區塊鏈,Truffle使用“高級快照功能”**來確保每個測試都是隔離的,並且不與其他測試共享狀態。為了在go-ethereum或其他外部客戶端等客戶端上進行測試,所有遷移都會在每個測試文件的開頭重新部署,以確保合同狀態的新鮮度。

在這些客戶端上運行將花費相當多的時間來完成測試,而Ganache和Truffle Develop利用“特殊功能”將測試運行時間提高了90%。在考慮速度時,我們還可以配置這些測試區塊鏈以立即挖掘塊,以及其他優化以加速測試。

如果您對使用Truffle進行測試感到好奇並希望了解更多詳細信息,請從以下文檔開始: https://truffleframework.com/docs/truffle/testing/testing-your-contracts

  • 通過討論最初的Truffle樣板,我們現在知道Truffle如何處理智能合約的部署和測試。合同在合同文件夾中開發,然後遷移到區塊鏈,然後使用Truffle的自動化測試功能進行測試。當然,需要編寫契約,而像Sublime Text這樣的IDE確實為Solidity提供了語法樣式。在這裡查看名為Ethereum的Sublime Package。 Vyper語法只是遵循python。
  • 你的合同已經寫好了。我們現在需要在網絡上部署它們並連接到該網絡以訪問所述合同。 (“網絡”在此上下文中表示以太坊區塊鏈)。剩下要探索的是如何連接到Truffle的以太坊網絡。這在truffle-config.js中處理,位於項目根目錄中。

Truffle Config中配置以太網網絡(Ethereum Networks)

truffle.config.js 允許我們配置我們想要連接的網絡。默認配置如下所示:

truffle-config.js:

module.exports = {
networks: {
development: {
host: "127.0.0.1",
port: 8545,
network_id: "*" // Match any network id
}
}
};

根據上面的配置,已經為 localhost配置了開發網絡。默認情況下,Truffle Develop在 localhost:9545上運行,而Ganache在 localhost:8545上運行。松露已準備好與開箱即用的Ganache溝通。這些區塊鏈還被分配了一個與現實世界公共以太坊區塊鏈無關的隨機網絡ID(例如,主網的 network ID 是1),在此配置檔是用 * 表示可以配合任何network ID。

我們可以擴展此配置文件以包含更多網絡,例如實時主網。我們不僅限於所謂的網絡,但Truffle選擇使用livenet作為主網:

module.exports = {
networks: {
development: {
...
},
live: {
host: "<host_ip_address>",
port: 80,
network_id: 1
}
}
};

現在如果我們想在實時網絡上部署合同,我們可以使用 --network標誌調用migrate:

truffle migrate --network live

這種靈活性允許我們定義一系列網絡並按照我們的要求遷移到它們,這在您從本地測試區塊鏈轉移到主網部署時非常有用。

  • 現在是考慮前端應用程序的時候了。與Truffle文件夾一起,前端應用程序文件夾結構也將出現在Truffle項目的根目錄中。例如,如果 Create React App與Truffle一起使用,則React應用程序也會出現在根目錄中。在這種情況下,它位於一個單獨的 web-app/文件夾中。最終,開發人員要決定是否將Truffle和前端項目文件結合起來,或者像Truffle + CRA項目選擇的那樣將它們分開。
  • 在構建前端時,您希望通過web3測試與智能合約的通信。目前執行此操作的最佳方法是通過瀏覽器中的MetaMask連接到本地運行的Ganache區塊鏈。在開始安裝Truffle並訪問Drizzle之前,讓我們簡要介紹一下如何做到這一點。

The web3 Provider

按照設計,web3尋找一個web3提供者 — 一個區塊鏈客戶端或輕型節點,運行時具有處理合同通信和在以太坊區塊鏈上進行交易的功能。此提供程序將根據您選插件或設備(MetaMask,Cipher,完整的go-ethereum節點等)而有所不同。

出於開發目的,web3將與我們的Ganache或Truffle Develop區塊鏈進行通信 — 任您選擇用那一個來測試。

因此,當在公共測試網絡(Ropsten,Rinkeby等)上測試您的dapp,然後啟動主網絡時,您的web3 provider 必須運行你佈署合同相同的網絡才能訪問合同。 例如你佈署合約在Ropsten公共測試網路上,但是你的web3 provider 卻運行在主網路上,這樣是無法執行合約的,解決方法是佈署你的合約在主網路上或是讓您的web3 provider 運行在Ropsten公共測試網路上

Image for post
Image for post

MetaMask使我們可以輕鬆連接到本地運行的EVM區塊鏈,例如Ganache和Truffle Develop。以下屏幕截圖演示了該過程。從“網絡”下拉列表中選擇“自定義RPC”,然後輸入本地運行的區塊鏈URL。然後將自定義網絡添加到網絡列表中:

Image for post
Image for post

現在我們有辦法在我們私人運行的區塊鏈上測試我們的前端dapp,所有區塊都在本地運行。

  • 整體的開發就像是一般軟體開發步驟一樣,從本地環境(local — truffle develop or Ganache)開發開始,一但本地沒問題後就佈署到 模擬環境 ( staging — public test network),等驗證沒問題後再佈署到正式環境(production — public main network)裡讓使用者使用
Image for post
Image for post
  • 從這裡你的前端dapp進一步發展。然後在生產環境中構建和部署它。與此同時,您的智能合約(現已經過全面測試)將部署到Ropsten Ethereum測試網。通過Metamask切換到Ropsten網絡允許我們在公共區塊鏈上測試我們的生產dapp,以幫助我們識別任何必要的修改。
Image for post
Image for post
  • 您的智能合約已準備好遷移到主網。再次使用 truffle migrate,它們被部署。將MetaMask切換到主要的以太網網絡現在為我們提供了真正的dapp生產體驗。

為了繼續我們對Truffle套件的理解,讓我們安裝Truffle和Ganache。

安裝 Truffle and Ganache

使用npm全局安裝最新版本的Truffle:

npm install -g truffle@latest

此外,從以下網頁安裝: https://truffleframework.com/ganache. 這裡查看所有可用的平台。

Ganache提供了一個用於顯示區塊鏈狀態的GUI。在區塊鏈實例化時,會創建10個帳戶,以及助記符。你的助記符是Ganache為你創建的一個特殊秘密。它用於生成區塊鏈的帳戶地址以及簽署交易。不要在開發之外使用助記符。

Image for post
Image for post

Ganache將自動實例化一個區塊鏈,可通過 localhost:8545訪問。可以在設置部分配置網絡本身。

默認情況下,Ganache加快了區塊鏈的速度;自動挖掘塊並立即處理事務。只需單擊即可訪問私鑰,並且可以通過GUI提供的列表瀏覽塊和事務。

Ganache還有一個CLI,可以使用 npm install -g ganache-cli安裝,允許直接從終端進行交互。

這裡查看更多Ganache文檔。

Truffle Develop

Truffle Develop 區塊鏈可以通過在終端中運行 truffle develop開發來實例化,並且可以在 truffle-config.js 中配置:

module.exports = {
networks: {
...
develop: {
accounts: 5,
defaultEtherBalance: 500,
blockTime: 3
}
}
};

請記住,Truffle Develop區塊鍊是在9545. 端口生成的。但是像Ganache一樣,10個帳戶產生了10個私鑰,以及助記符( mnemonic),所有這些都顯示在終端中。

Image for post
Image for post

從閱讀官方文檔開始使用Truffle Develop。

此時熟悉一些Truffle命令很有用。 Truffle文檔有一個專用頁面,列出了完整的命令集。不要讓“全套”恐嚇你;有一個相對容易理解的適度命令範圍。到目前為止,至少他們的目的和用法應該大部分都與以上內容有關。

在結束本介紹之前,讓我們簡要介紹一下Drizzle — Truffle套件的最新版本,它解決了應用程序中的區塊鏈狀態管理問題。 Drizzle仍然是一個早期階段的產品,但它是任何的dapp是非常有用的。

讓我們看看Drizzle提供的產品,並安裝React Drizzle Box。

Drizzle

為什麼Drizzle加入了Truffle Suite?它自動將鏈數據同步到Redux存儲,因此開發人員在開發前端dapp時不必擔心這樣做。

Drizzle可以配置為在每個塊上同步鏈數據,或者僅在您的應用正在偵聽的合同數據發生更改時。它涵蓋合同狀態,事件和交易。

Drizzle提供了一個Truffle Box,它將Create React App設置與Drizzle和Drizzle React Components軟件包相結合。有關box的安裝說明和更多信息可以在 Truffle boxes 上找到。如果您想立即下載該盒子,只需運行 truffle unbox drizzle.

由於這是一篇介紹性文章,我不會深入研究Drizzle的技術集成.

下一步

Truffle套件的工具聽起來像您可以用於dapp開發的東西嗎?答案現在應該清楚 — 如果沒有,麻煩分享給我。如果你還不熟悉 Truffle ,可以依照我另一篇文章使用看看

Truffle是迄今為止用於以太坊開發的最廣泛採用的工具集,現在是版本5,帶來了在 /contracts文件夾中編譯Vyper contract 等功能。這是一個好兆頭。對於快速發展的生態系統,好的工具必須不斷增加對新興標準的支持

我這樣做是因為我愛它,但如果你想我喝杯咖啡,我不會拒絕。 :O ) Thanks ^^

donation :

XEM : NCWZSUF4FPXJY3L3Y7657QNVBIUZ5D54F4TNJ64S

Ether : 0xf2d15dEAf62b8c4AFC0343006579E8E662c120D9

Bitcoin : 332UiyAfSXyvhqCYgDgBkNLFSf25ccNV9i

Connect:

Written by

撰寫任何事情,O型水瓶混魔羯,咖啡愛好者,Full stack/blockchain developer,Founder of Blockchain&Dapps meetup and DeFi-Decentralized-Finance-SG meetup,Udemy teacher。

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store