NAS星雲鏈 入門之從零開發第一個DAPP

應該有不少小夥伴和我同樣，一直想去入手學習區塊鏈，可是總無從下手，有些概念感受理解了，有感受沒理解。其實這都是「沒實踐」的鍋。

所謂看十遍不如想一遍，想一遍不如作一遍。這不最近星雲鏈nebulas正有開發者激勵計劃，每提交一個應用均可以得到獎勵，因此正好藉此機會，開發第一個DAPP，而且理解所謂的DAPP究竟是一個什麼樣的東西。

這篇文章幾乎是DAPP開發零基礎的踩坑經歷，記錄下來，勉強對零基礎的同窗能夠成爲教程~

若是你看了本篇教程而且開發了你本身的DAPP，能夠點擊這裏註冊NAS 
用個人推廣連接提交，這樣你提交的時候我會獲得另一部分獎勵，做爲對我寫做的激勵~

在開始開發以前，須要進行一系列的準備操做。包括錢包的製備，環境的搭建等等。這裏對各類概念，我儘可能以通俗易懂的話來描述，由於我也是小白，可能會所以描述的不夠準確，因此歡迎你們拍磚討論。

註冊錢包

做爲開發的第一步，首先確定是須要申請一個錢包。

這裏的錢包你能夠想象成你顯示世界的錢包。裏面存放着你的大洋。現實生活中，你的錢包在你手裏，因此別人拿不走，再數字生活中，你須要有一個密碼來解鎖你的錢包，當你的密碼丟失的時候，就等於你的錢包丟失，沒法找回，而且形成財產丟失。

首先在GitHub上面，把官方web錢包clone下來：https://github.com/nebulasio/web-wallet

其次打開index.html文件

這樣你就打開了web版的錢包，輸入你想要的密碼(必定不能忘記的)，點擊新建錢包，其次點擊下載密碼庫文件，將錢包文件保存在本地(必定不能丟失),此時生成了一個以n1開頭的文件：

這個文件的名稱就是你的錢包地址。 任何人有了你的錢包地址，就能夠與你發生 交易，意思就是別人能夠向你的錢包裏面轉帳。

此時點擊錢包信息，上傳你的錢包而且解鎖，能夠看到你的帳戶的當前信息。期中包括你的餘額等資料。

此時你已經註冊了你的一個錢包，完成了第一部準備。

接下來進行下一步準備，那就是領取測試網的測試幣。在https://testnet.nebulas.io/claim/天天能夠領取1NAS的測試幣，注意這個幣領取是在測試網，與主網沒有任何關係。 主網和測試網的意思你能夠理解爲兩個不一樣的鏈，事實上區塊鏈自己就是數據庫，其實就是主網和測試網是兩個不一樣的數據庫的數據，測試網的數據只用來測試不產生實際價值。

領取完畢以後，再打開錢包，在錢包右上角能夠切換主網和測試網，這時切換到測試網。 
 
查詢錢包餘額，發現已經領取完畢(若是沒有顯示成功，請耐心等待，區塊確認有延遲，意思是把數據寫入區塊鏈裏，須要等待各個區塊確認該數據有效安全，才能夠將數據寫入區塊鏈，因此會有延遲)

你已經成功領取了第一個NAS，接下來你將會用測試的NAS來部署測試你的智能合約。

編寫部署智能合約

在開始這部分以前，先來解釋一些如何理解智能合約，或者說如何理解一個DAPP的運做原理。

智能合約簡單的白話來說，就是一段存儲在區塊鏈上，運行在區塊鏈代碼執行引擎的一個代碼片。這部分的代碼，提供給DAPP前端一些必要的接口，用來存儲或者查詢數據。你能夠理解爲：智能合約就是後端，提供接口的。他所用的數據庫就是區塊鏈自己。

智能合約貌似理解了，那麼區塊鏈自己是數據庫如何理解呢？

區塊鏈(block-chain)，顧名思義，是以區塊造成的鏈表，全部數據保存在稱爲「區塊」的東西上，每一個區塊的大小有限，全部用鏈表把他們串聯起來，如圖：

這樣就應該很好理解了，那麼說完了後端和數據庫，是否是就差前端了？

一個DAPP的前端，能夠是任何形式的，好比WEB版，好比Android版，好比iOS版，可是由於市面上大多數區塊鏈開發都屬於前期，官方只提供了WEB版的sdk來接入區塊鏈，因此目前通常的DAPP是以WEB版爲主，畢竟跨平臺。

那麼接下來，咱們來開始編輯咱們的智能合約，也就是所謂的後臺。此部分參考官方dictionary的demo進行修改。

這裏假設咱們要作一個名爲「小小公開信」的DAPP，主要的功能是任何區塊鏈上的用戶均可以發表一篇標題不重複的公開信，若是標題被佔用，就只能查看這篇公開信。

首先新建一個js文件，編寫咱們所須要的實體，好比一公開信，他應該有標題，內容，以及做者。

 
其次，咱們應該能夠有權限訪問咱們本身智能合約的存儲空間，因此根據官方的API來建立存儲空間：

這裏的數據是以kep-value形式存儲的。相信你們很容易理解。

接下來，只須要再編寫兩個函數，一個是存儲公開信，一個是查詢公開信，邏輯比較簡單，直接貼代碼：

這樣，咱們就完成了一個簡單的智能合約。

部署智能合約

還記得你剛纔領取的測試網的1枚NAS嗎，他開始派上用場了。要知道，把咱們的代碼部署到鏈上可不是免費的，要否則白白浪費資源誰都不肯意幹啊，因此咱們須要支付必定量的GAS，只要是交易，或者理解爲向區塊鏈這個數據庫寫入數據，就須要支付GAS，GAS是NAS的一個計量單位（固然獨創在ETH中）。爲何須要GAS呢，其中除了爲了保證運行的代碼不是無價值的，還有一個緣由是要防止有人惡意發佈代碼，好比寫一個死循環。

如今，打開你的錢包，點擊合約，再點擊部署，把你剛纔的智能合約代碼複製到合約代碼裏面，以後解鎖錢包,點擊測試，發現沒有返回錯誤，就能夠點擊提交部署：

部署成功以後，會告訴你交易的hash以及合約地址，必定要好好保存起來，不然目前會丟失（好像官方錢包還沒提供查詢歷史交易的功能）

這裏合約地址就是你剛纔部署代碼的地址，每一個智能合約都有一個合約地址，經過合約地址以及支付一些GAS，就能夠調用合約的代碼。

測試智能合約

點擊錢包的執行，此時咱們測試一下寫入一封公開信，這裏函數寫合約定義的

save() 
參數傳入： 
[「給初學者的一封公開信」,」你們鍥而不捨不斷努力，終會成功」] 
目的地址寫剛纔的合約地址如圖：

點擊測試，發現沒有錯誤，則提交。 
等待區塊確認以後，咱們再來查詢一下，剛纔的數據有沒有提交成功：

點擊測試，能夠看到結果：

成功把咱們的公開信返回了。至此合約部署完畢。

開發前端頁面

既然咱們的智能合約部署好了，就說明咱們擁有一個數據庫爲區塊鏈的後臺服務器了。如今只須要編寫一個前端，展現給用戶使用就能夠了。

官方提供了js版的api，可讓瀏覽器接入區塊鏈獲取數據，sdk地址以下： 
https://github.com/nebulasio/neb.js

首先把項目clone下來：

git clone https://github.com/nebulasio/neb.js.git 

• 1
• 2

而後，須要用到一個打包工具叫作gulp

因此使用npm安裝：

npm install -g gulp

• 1

安裝完畢後，運行glup打包

打包完畢後，會在項目文件夾下生成一個/dist的文件夾，把這個文件夾複製到咱們的工做目錄，做爲文件依賴使用。

由於筆者沒有接觸過前端開發，因此這裏前端選擇bootstrap+jQuery，由於他們對新手很友好，零基礎便可快速上手。

首先在html文件裏，引入須要的依賴文件：

<script type="text/javascript" src="./dist/nebulas.js"></script> <script type="text/javascript" src="./jquery-3.3.1.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> 

• 1
• 2
• 3
• 4
• 5

而後編寫前端樣式，這裏的前端比較簡單，提供一個搜索框，一個展現框，一個錄入框：

當用戶輸入信件名稱的時候，調用neb的接口，來獲取數據，根據回調來展現數據：

好比，此時我搜索一篇文章，名爲《給初學者的一封公開信》，反饋以下：

這樣表明，已經查詢到了內容。接下來來完成提交內容的部分。

此時根據nebpay的api，能夠調用起chrome錢包插件進行支付：

其中nebPay是根據官方示例拷貝下來的文件。

<script type="text/javascript" src="./dist/nebPay.js"></script>

• 1
• 2

這個時候，編輯一封公開信，點擊提交，便可彈出錢包頁面進行GAS支付：

等提交完畢，便可查詢到你寫的公開信的內容。

若是你點擊沒有反應，那麼說明你沒有安裝chrome插件的錢包，點擊這裏安裝https://github.com/ChengOrangeJu/WebExtensionWallet

如此一來遍大功告成！

由於是靜態網頁，因此直接部署到你的服務器上，讓其餘用戶訪問便可。

當你開發部署完畢，便可去官網提交DAPP獲取激勵大獎~~

若是本文對你有幫助，請點擊喜歡而且擴散~~

本文中DAPP已提交，而且部署以及開源

應用地址是：http://androidwing.net/nas-dapps/theletter/

項目地址是：https://github.com/githubwing/TheLetter

歡迎star，若是你想來交流區塊鏈技術，能夠加qq羣：615075629

參考文章： 
五一大禮包：手把手教你一小時開發DApp，千萬獎金等你拿

https://github.com/nebulasio/wiki