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/