1.實現效果
添加內容
修改內容（實際上是修改solidity的notes變量，鏈上是追加tx交易）
2.準備工具
MetaMask瀏覽器插件
Ganache 私鏈環境
Truffle 開發框架
1.安裝 node
2.安裝 truffle
npm install -g truffle
3.下載一套pet-shop的開發模板
truffle unbox pet-shop
3.合約部署
在 contracts 目錄下添加一個合約文件 NoteContract.sol:
NoteContract.sol
在 migrations 目錄添加一個部署文件 2_deploy_contractsjs:
2_deploy_contractsjs.sol
部署合約到Ganache私鏈上，默認配置在truffle-config.js
truffle migrate
4.前端代碼描述
主要修改app.js和index.html
app.js：
| 方法名 | 描述 |
|---|---|
| initWeb3 | 連接 MetaMask節點 或者 連接到Ganache私鏈 |
| initContract | 加載 NoteContract.json 合約文件並 實例化 |
| loadNote | 逐條獲取筆記(貌似沒法直接遍歷) |
| getNotes | 根據getNotesLen 調用 loadNote 獲取所有筆記 |
| addNotes | 調用合約方法addNote添加筆記 |
| updateNotes | 調用合約方法modifyNote修改筆記 |
| bindEvents | 添加綁定事件 |
5.運行Dapp
在note_on_chain項目目錄下
➜ note_on_chain git:(master) ： npm run dev
參考：https://learnblockchain.cn/2019/03/30/dapp_noteOnChain/