{"id":246173,"date":"2023-12-23T12:11:36","date_gmt":"2023-12-23T04:11:36","guid":{"rendered":"https:\/\/www.idc.net\/help\/246173\/"},"modified":"2023-12-23T12:11:36","modified_gmt":"2023-12-23T04:11:36","slug":"%e4%bb%8e%e5%85%a8%e6%a0%88%e5%bc%80%e5%8f%91%e8%80%85%e8%bf%88%e5%90%91web3%e5%bc%84%e6%bd%ae%e5%84%bf","status":"publish","type":"post","link":"https:\/\/idc.net\/help\/246173\/","title":{"rendered":"\u4ece\u5168\u6808\u5f00\u53d1\u8005\u8fc8\u5411Web3\u5f04\u6f6e\u513f"},"content":{"rendered":"<p style=\"text-align: center\">\n<p>\u8fd1\u5e74\u6765\u5927\u70ed\u7684\u7f8e\u5267\u300a\u521b\u4e1a\u516c\u53f8(StartUp)\u300b\u865a\u6784\u4e86\u4e00\u79cd\u88ab\u79f0\u4e3a GenCoin \u7684\u6570\u5b57\u8d27\u5e01\uff0c\u53ef\u7528\u4e8e\u5404\u79cd\u521b\u65b0\u5f0f\u7684\u91d1\u878d\u4ea4\u6613\u573a\u666f\u4e2d\u3002\u800c\u5728\u6211\u770b\u6765\uff0c\u5b83\u53ef\u4ee5\u88ab\u7406\u89e3\u4e3a\u4e00\u79cd\u5177\u6709 Web3 \u6838\u5fc3\u5c5e\u6027\u7684\u533a\u5757\u94fe\u5206\u5e03\u5f0f\u8bbe\u8ba1\u4ea7\u54c1\u3002\u5982\u679c\u60a8\u5bf9 Web3 \u8fd8\u4e0d\u751a\u4e86\u89e3\u7684\u8bdd\uff0c\u8ba9\u6211\u4eec\u5148\u56de\u987e\u4e00\u4e0b Web \u7684\u4e09\u4e2a\u4e3b\u8981\u65f6\u4ee3\uff1a<\/p>\n<ul>\n<li>Web1 - \u9759\u6001\u7f51\u9875(1991 \u5e74\u20132004 \u5e74)\uff0c\u8bf7\u53c2\u89c1 --https:\/\/en.wikipedia.org\/wiki\/Web_2.0#Web_1.0<\/li>\n<li>Web2 - Web \u4f5c\u4e3a\u4e00\u4e2a\u5e73\u53f0(\u81ea 2004 \u5e74\u8d77)\uff0c\u8bf7\u53c2\u89c1 --https:\/\/en.wikipedia.org\/wiki\/Web_2.0#Web_2.0<\/li>\n<li>Web3- \u53bb\u4e2d\u5fc3\u5316\u7684\u8bbe\u8ba1\uff0c\u5305\u542b\u4e86\u533a\u5757\u94fe\u6280\u672f(\u81ea 2009 \u5e74\u8d77\uff0c\u4e14\u8fd1\u5e74\u6765\u53d1\u5c55\u52bf\u5934\u8fc5\u731b\u3001\u524d\u666f\u5e7f\u9614)\uff0c\u8bf7\u53c2\u89c1 --https:\/\/en.wikipedia.org\/wiki\/Web3<\/li>\n<\/ul>\n<p style=\"text-align: center\">\n<p>\u5728 Web2 \u65f6\u4ee3\uff0cWeb \u670d\u52a1\u4e3b\u8981\u96c6\u4e2d\u548c\u88ab\u63a7\u5236\u5728\u8bf8\u5982\uff1a\u8c37\u6b4c\u3001\u82f9\u679c\u548c\u4e9a\u9a6c\u900a\u7b49\u5c11\u6570\u6280\u672f\u63d0\u4f9b\u5546\u7684\u624b\u91cc\u3002\u800c\u4f5c\u4e3a Web2 \u7684\u66ff\u4ee3\u65b9\u6848(https:\/\/consensys.net\/blog\/blockchain-explained\/what-is-web3-here-are-some-ways-to-explain-it-to-a-friend\/)\uff0cWeb3 \u521b\u5efa\u4e86\u4e00\u4e2a\u65e0\u9700\u51c6\u5165\u7684\u6570\u636e\u5b58\u50a8\u65b9\u5f0f\u3002\u5176\u4e2d\u4e0d\u5b58\u5728\u4efb\u4f55\u4e2a\u4eba\u6216\u516c\u53f8\u63a7\u5236\u6216\u62e5\u6709\u7740\u6570\u636e\uff0c\u800c\u4e14\u6570\u636e\u7684\u771f\u5b9e\u6027\u4e5f\u5f97\u5230\u4e86\u5145\u5206\u4fdd\u8bc1\u3002\u8fd9\u4e9b\u6570\u636e\u4f1a\u88ab\u5b58\u50a8\u5728\u533a\u5757\u94fe\u7f51\u7edc\u4e2d\u7684\u516c\u5171\u5206\u7c7b\u8d26\u672c(public ledger)\u4e0a\u3002\u56e0\u6b64\uff0c\u4e0d\u518d\u662f\u7531\u4e00\u4e2a\u5b9e\u4f53\u62e5\u6709\u6570\u636e\uff0c\u800c\u662f\u7531\u591a\u4e2a\u8282\u70b9(\u5373\uff1a\u8fd0\u884c\u7740\u533a\u5757\u94fe\u7684\u8ba1\u7b97\u673a)\u5b58\u50a8\u7740\u6570\u636e\uff0c\u5e76\u5c31\u6570\u636e\u662f\u5426\u6709\u6548\u8fbe\u6210\u4e86\u5171\u8bc6\u3002<\/p>\n<p>\u4ece\u6bd4\u7279\u5e01(https:\/\/bitcoin.org\/en\/)\u5230\u4ee5\u592a\u574a\u7b49\u534f\u8bae\u7684\u5e94\u7528\uff0cWeb3 \u4ee5\u6b64\u7c7b\u6570\u636e\u5b58\u50a8\u534f\u8bae\u4e3a\u57fa\u7840\uff0c\u5f00\u542f\u4e86\u5404\u79cd\u5168\u65b0\u7684\u7528\u4f8b\u3002\u4f8b\u5982\uff1a<\/p>\n<ul>\n<li>\u7531\u7528\u6237\u800c\u975e\u516c\u53f8\u63a7\u5236\u7740\u4e2a\u4eba\u8eab\u4efd<\/li>\n<li>\u672a\u7ecf\u8bb8\u53ef\u7684\u91d1\u878d\u7cfb\u7edf(\u5982\uff1a\u6bd4\u7279\u5e01)\u53ef\u5f00\u5c55\u8d37\u6b3e\u3001\u8d27\u5e01\u3001\u6295\u8d44\u7b49\u7684\u6570\u5b57\u5316\u8d27\u5e01\u4e1a\u52a1<\/li>\n<li>\u7531 NFT(https:\/\/en.wikipedia.org\/wiki\/Non-fungible_token)\u53bb\u8bc1\u660e\u8bf8\u5982\u97f3\u4e50(https:\/\/royal.io\/)\u3001\u827a\u672f(https:\/\/www.artblocks.io\/)\u7b49\u6570\u5b57\u9879\u76ee\u7684\u6570\u5b57\u6240\u6709\u6743<\/li>\n<li>\u901a\u8fc7\u53bb\u4e2d\u5fc3\u5316\u7684\u81ea\u6cbb\u7ec4\u7ec7(decentralized autonomous organizations\uff0cDAO)\u4e34\u65f6\u7ec4\u5efa\u5177\u6709\u76f8\u540c\u76ee\u7684\u7684\u56e2\u4f53\uff0c\u4f8b\u5982\uff1aConstitution DAO(https:\/\/www.constitutiondao.com\/)\u548c social DAO(https:\/\/www.fwb.help\/)<\/li>\n<li>\u901a\u8fc7\u8fb9\u73a9\u8fb9\u8d5a(Play-to-earn\uff0cp2e)\u7684\u6e38\u620f\uff0c\u7528\u6237\u53ef\u4ee5\u5728\u73a9\u6e38\u620f\u7684\u540c\u65f6\uff0c\u7528\u6765\u8c0b\u751f(\u4f8b\u5982 Axie Infinity\uff0chttps:\/\/axieinfinity.com\/)<\/li>\n<\/ul>\n<p>\u5f53\u7136\uff0c\u4e0a\u8ff0\u5e94\u7528\u7684\u5173\u952e\u5728\u4e8e\uff0c\u6570\u5b57\u8d27\u5e01\u7684\u6240\u6709\u6743(\u5982\uff1aDAO \u4f1a\u5458\u8d44\u683c\u3001\u6216\u97f3\u4e50\u7248\u6743\u7b49)\u90fd\u88ab\u638c\u63a7\u5728\u7528\u6237\u7684\u624b\u4e2d\u3002\u5728\u4e16\u754c\u4e0a\u4efb\u4f55\u5730\u65b9\uff0c\u53ea\u8981\u6709\u4e92\u8054\u7f51\u8fde\u63a5\uff0c\u4efb\u4f55\u4eba\u90fd\u53ef\u4ee5\u81ea\u7531\u5730\u4ea4\u6613\u3001\u9500\u552e\u548c\u6784\u5efa\u8fd9\u4e9b\u7269\u54c1\uff0c\u800c\u5b8c\u5168\u8131\u79bb\u4e86\u67d0\u4e2a\u516c\u53f8\u6216\u653f\u5e9c\u7684\u89c4\u5219\u63a7\u5236\u3002\u5bf9\u4e8e\u8fd9\u6837\u7684 Web3 \u7406\u60f3\u4e3b\u4e49\uff0c\u6211\u5728\u6b64\u4e0d\u505a\u8bc4\u5224\uff0c\u53ea\u662f\u5355\u7eaf\u4ece\u5f00\u53d1\u8005\u7684\u89d2\u5ea6\u548c\u60a8\u63a2\u8ba8\uff0c\u4e00\u4e2a\u5168\u6808\u5f00\u53d1\u8005\u5c06\u5982\u4f55\u5177\u5907 Web3 \u7684\u6280\u672f\u80fd\u529b\u3002<\/p>\n<h2>\u4ece\u5168\u6808\u8bf4\u8d77<\/h2>\n<p>\u6e90\u4e8e 2015 \u5e74\u7684\u201c\u5168\u6808\u5f00\u53d1\u8005\u201d\u4e00\u8bcd\u662f\u6307\uff1a\u4e00\u4e2a\u8f6f\u4ef6\u5de5\u7a0b\u5e08\u53ef\u4ee5\u4e3a\u4efb\u4f55\u7ea7\u522b\u7684\u8f6f\u4ef6\u6280\u672f\u6808\u505a\u51fa\u8d21\u732e\u3002\u4f8b\u5982\uff0c\u9762\u5bf9\u67d0\u4e2a\u4e0e\u670d\u52a1\u5c42\u76f8\u5173\u7684\u529f\u80fd\u6027\u7f3a\u9677\uff0c\u521a\u521a\u5b8c\u6210\u4e86\u5ba2\u6237\u7aef\u76f8\u5173\u4efb\u52a1\u7684\u540c\u4e00\u5f00\u53d1\u8005\uff0c\u53ef\u4ee5\u65e0\u7f1d\u201c\u63a5\u5355\u201d\uff0c\u53bb\u9ad8\u6548\u5730\u6293 bug\u3002\u60a8\u53ef\u4ee5\u901a\u8fc7\u94fe\u63a5 --https:\/\/dzone.com\/articles\/do-not-publishfull-stack-development-truly-possibl\uff0c\u4e86\u89e3\u66f4\u591a\u6709\u5173\u5168\u6808\u5f00\u53d1\u7684\u6982\u5ff5\u3002<\/p>\n<h2>Web3 \u57fa\u7840<\/h2>\n<p>\u4e3a\u4e86\u6df1\u5165\u7814\u7a76 Web3\uff0c\u6211\u4f9d\u6b21\u521b\u5efa\u4e86\u4e00\u4e2a\u667a\u80fd\u5408\u7ea6\uff0c\u4ee5\u53ca\u4e00\u4e2a Dapp \u4e0e\u4e4b\u8fdb\u884c\u4ea4\u4e92\u3002\u5176\u4e2d\uff0c<\/p>\n<ul>\n<li>\u667a\u80fd\u5408\u7ea6(https:\/\/www.coinbase.com\/learn\/crypto-basics\/what-is-a-smart-contract)\u662f\u90e8\u7f72\u5728\u533a\u5757\u94fe\u4e0a\u7684\u4e00\u6bb5\u4ee3\u7801(\u6211\u4e0b\u9762\u4f1a\u4ee5\u4ee5\u592a\u574a(https:\/\/ethereum.org\/en\/what-is-ethereum\/)\u4e3a\u4f8b)\u3002\u8be5\u5408\u7ea6\u4e00\u65e6\u88ab\u90e8\u7f72\u5230\u533a\u5757\u94fe\u4e0a\uff0c\u5c31\u4e0d\u53ef\u6539\u53d8\u3001\u4e5f\u65e0\u9700\u8bb8\u53ef(permissionless)\uff0c\u4f46\u662f\u4efb\u4f55\u4eba\u90fd\u53ef\u4ee5\u68c0\u7d22\u5230\u5b83\u3002<\/li>\n<li>Dapp(decentralized application\uff0c\u53bb\u4e2d\u5fc3\u5316\u5e94\u7528)\u662f\u6211\u4eec\u901a\u8fc7 UI(\u901a\u5e38\u6765\u81ea\u7f51\u9875\u6216\u5e94\u7528)\u4e0e\u667a\u80fd\u5408\u7ea6\u4ea4\u4e92\u7684\u65b9\u5f0f\u3002Dapp \u4f1a\u5728\u540e\u7aef\u5229\u7528\u667a\u80fd\u5408\u7ea6\u7684\u5f00\u653e\u6027\uff0c\u91c7\u7528\u8bf8\u5982 IPFS(InterPlanetary File Storage\uff0c\u661f\u9645\u6587\u4ef6\u5b58\u50a8)\u7684\u65b9\u5f0f\uff0c\u5b9e\u73b0\u6587\u4ef6\u7684\u5206\u6563\u5b58\u50a8\uff0c\u4e14\u4e0d\u4f1a\u51fa\u73b0\u505c\u673a\u3002\u6bd5\u7adf DDoS \u653b\u51fb\u65e0\u6cd5\u653b\u51fb\u8d1f\u8d23\u5b58\u50a8\u7684\u6bcf\u4e2a\u8282\u70b9\u3002\u5f53\u7136\uff0c\u5728\u8003\u8651\u90e8\u7f72\u4e4b\u524d\uff0c\u6211\u4eec\u9700\u8981\u9488\u5bf9\u5176\u5b89\u5168\u6027\uff0c\u5f00\u5c55\u5168\u9762\u6d4b\u8bd5\uff0c\u5e76\u5904\u7f6e\u597d\u4ee3\u7801\u4e2d\u7684\u6f5c\u5728\u7f3a\u9677\u4e0e\u6f0f\u6d1e\u3002<\/li>\n<\/ul>\n<h2>Web3 \u6280\u672f\u6808<\/h2>\n<p>\u76ee\u524d\uff0c\u9488\u5bf9 Web3 \u7684\u6210\u719f\u6280\u672f\u6808\u7ec4\u5408\uff0c\u901a\u5e38\u5305\u62ec\u4ee5\u4e0b\u7ec4\u4ef6\uff1a<\/p>\n<ul>\n<li>NPM - \u5907\u53d7 Web2 \u5f00\u53d1\u4eba\u5458\u6b22\u8fce\u7684\u8282\u70b9\u5305\u7ba1\u7406\u5668\uff0c\u8bf7\u53c2\u89c1 --https:\/\/nodejs.org\/en\/<\/li>\n<li>Truffle \u6846\u67b6 - \u4e13\u6ce8\u4e8e Web3 \u7684\u5f00\u53d1\u5de5\u5177\uff0c\u8bf7\u53c2\u89c1 --https:\/\/www.trufflesuite.com\/<\/li>\n<li>Ganache \u2013 \u53ef\u4ee5\u5728\u672c\u5730\u4e3b\u673a\u4e0a\u542f\u52a8\u79c1\u6709\u533a\u5757\u94fe\uff0c\u8bf7\u53c2\u89c1 --https:\/\/www.trufflesuite.com\/ganache<\/li>\n<li>MetaMask - \u4ee5\u592a\u574a\u7684\u533a\u5757\u94fe\u7528\u6237\u754c\u9762\u4e0e\u7f51\u5173\uff0c\u5c5e\u4e8e\u5f00\u6e90\u4e14\u53bb\u4e2d\u5fc3\u5316\u7684\u533a\u5757\u94fe\u7c7b\u578b\uff0c\u8bf7\u53c2\u89c1 --https:\/\/metamask.io\/<\/li>\n<li>Solidity \u2013 \u5148\u8fdb\u7684\u667a\u80fd\u5408\u7ea6\u7f16\u7a0b\u8bed\u8a00\uff0c\u8bf7\u53c2\u89c1 --https:\/\/solidity.readthedocs.io\/en\/v0.7.1\/<\/li>\n<li>HTML\/CSS\/JavaScript - \u5ba2\u6237\u7aef\u7684\u5c42\u9762\uff0c\u8bf7\u53c2\u89c1 --https:\/\/www.w3.org\/standards\/webdesign\/htmlcss<\/li>\n<li>Web3.js \u2013 \u901a\u8fc7\u4ee5\u592a\u574a\u7f51\u7edc\u4ea4\u4e92\u7684\u4ee5\u592a\u574a API \u5e93\uff0c\u8bf7\u53c2\u89c1 --https:\/\/web3js.readthedocs.io\/en\/v1.3.0\/<\/li>\n<li>Infura - \u6388\u4e88\u4ee5\u592a\u574a\u7f51\u7edc\u8bbf\u95ee\u6743\u9650\u7684\u4ee5\u592a\u574a API \u670d\u52a1\uff0c\u8bf7\u53c2\u89c1 --https:\/\/infura.io\/<\/li>\n<\/ul>\n<h2>\u4ee5\u592a\u574a Dapp \u7684\u9700\u6c42<\/h2>\n<p>\u5047\u8bbe\u6709\u4e00\u4e2a\u5c45\u59d4\u4f1a\u5373\u5c06\u4e3e\u529e\u5b9a\u671f\u9009\u4e3e\uff0c\u9644\u8fd1\u7684\u5c45\u6c11\u5c06\u5bf9\u4e00\u7cfb\u5217\u7684\u51b3\u8bae\u8fdb\u884c\u6295\u7968\u3002\u90a3\u4e48\uff0c\u6211\u4eec\u5c31\u53ef\u4ee5\u5c06\u8be5\u9009\u4e3e\u6784\u5efa\u6210\u4e3a\u4e00\u4e2a\u4ee5\u592a\u574a Dapp\u3002\u7531\u4e8e\u6570\u636e\u88ab\u5b58\u50a8\u5728\u516c\u5f00\u7684\u533a\u5757\u94fe\u4e0a\uff0c\u800c\u4e0d\u662f\u5355\u4e2a\u516c\u53f8\u7684\u79c1\u6709\u670d\u52a1\u5668\u4e0a\uff0c\u56e0\u6b64\u4efb\u4f55\u4eba\u90fd\u53ef\u4ee5\u901a\u8fc7\u4e0e\u667a\u80fd\u5408\u7ea6\u7684\u4ea4\u4e92\uff0c\u4ee5\u65e0\u9700\u8bb8\u53ef\u7684\u65b9\u5f0f\uff0c\u68c0\u7d22\u6295\u7968\u7ed3\u679c\u3002\u636e\u6b64\uff0c\u6295\u7968\u7ed3\u679c\u5c31\u4e0d\u5b58\u5728\u88ab\u7be1\u6539\u6216\u4f2a\u9020\u7684\u60c5\u51b5\uff0c\u8fdb\u800c\u907f\u514d\u4e86\u4e89\u8bae\u7684\u53d1\u751f\u3002<\/p>\n<h2>\u521b\u5efa\u667a\u80fd\u5408\u7ea6<\/h2>\n<p>\u9996\u5148\uff0c\u6211\u4eec\u9700\u8981\u5229\u7528\u524d\u6587\u63d0\u5230\u7684\uff1aInfura\u3001NPM\u3001Truffle \u6846\u67b6\u3001Ganache\u3001\u4ee5\u53ca Solidity \u7b49 Web3 \u6280\u672f\u6808\u7ec4\u4ef6\uff0c\u6765\u521b\u5efa\u4e00\u4e2a\u80fd\u4e0e\u5e94\u7528\u534f\u540c\u7684\u667a\u80fd\u5408\u7ea6\u3002\u5176\u521b\u5efa\u7684\u6d41\u7a0b\u5982\u4e0b\u56fe\u6240\u793a\uff1a<\/p>\n<p style=\"text-align: center\">\n<p>\u6211\u4eec\u53ef\u4ee5\u6839\u636e\u8be5\u6d41\u7a0b\uff0c\u53bb\u62db\u52df\u4ee5\u592a\u574a\u7684\u5f00\u53d1\u8005\uff0c\u5177\u4f53\u5185\u5bb9\u8bf7\u53c2\u89c1\u94fe\u63a5 --https:\/\/consensys.net\/developers\/onboarding-step-2\/\u3002<\/p>\n<h2>\u4f7f\u7528 React \u521b\u5efa Dapp<\/h2>\n<p>\u6709\u4e86\u667a\u80fd\u5408\u7ea6\uff0cWeb3 \u5de5\u7a0b\u5e08\u4fbf\u53ef\u4ee5\u4f7f\u7528 NPM\u3001MetaMask\u3001HTML\/CSS\/JavaScript\/React\u3001\u4ee5\u53ca Web3.js \u7b49 Web3 \u6280\u672f\u6808\u7ec4\u4ef6\uff0c\u6784\u5efa\u5c45\u59d4\u4f1a\u9009\u4e3e\u7684\u5e94\u7528\u3002\u5728\u672c\u4f8b\u4e2d\uff0c\u6211\u4eec\u5c06\u91c7\u7528 React(https:\/\/reactjs.org\/) \u6846\u67b6\u548c\u5982\u4e0b\u6d41\u7a0b\uff1a<\/p>\n<p style=\"text-align: center\">\n<h2>\u9996\u4e2a\u4ee5\u592a\u574a Dapp<\/h2>\n<p>\u6211\u4f1a\u901a\u8fc7 Infura \u7684\u6ce8\u518c\u9875\u9762(https:\/\/infura.io\/register)\u521b\u5efa\u4e00\u4e2a\u514d\u8d39\u5e10\u6237\uff0c\u5e76\u521b\u5efa\u4e00\u4e2a\u540d\u4e3a jvc-homeowners-ballot \u7684\u9879\u76ee\uff1a<\/p>\n<p style=\"text-align: center\">\n<p>\u4e0b\u56fe\u4e2d\u6709\u5173\u8be5\u9879\u76ee\u7684\u7ec6\u8282\uff0c\u6211\u4f1a\u5728\u4e0b\u6587\u4e2d\u8be6\u7ec6\u8ba8\u8bba\uff1a<\/p>\n<p style=\"text-align: center\">\n<p>Truffle \u5165\u95e8\u5728\u672c\u5730\u4e3b\u673a\u4e0a\uff0c\u6211\u521b\u5efa\u4e86\u4e00\u4e2a\u540d\u4e3a jvc-homeowners-ballot \u7684\u6587\u4ef6\u5939\uff0c\u5e76\u4f7f\u7528 CLI \u547d\u4ee4 --truffle init\uff0c\u6765\u521d\u59cb\u5316 Truffle\u3002\u521d\u59cb\u5316\u5b8c\u6210\u540e\u7684\u76ee\u5f55\u7ed3\u6784\u4e3a\uff1a<\/p>\n<pre>\u251c\u2500\u2500 contracts<br>\u2502   \u2514\u2500\u2500 Migrations<span style=\"margin: 0px;padding: 0px\">.sol<\/span><br>\u251c\u2500\u2500 migrations<br>\u2502   \u2514\u2500\u2500 <span style=\"margin: 0px;padding: 0px\">1<\/span>_initial_migration<span style=\"margin: 0px;padding: 0px\">.js<\/span><br>\u251c\u2500\u2500 test<br>\u2514\u2500\u2500 truffle<span style=\"margin: 0px;padding: 0px\">-<\/span>config<span style=\"margin: 0px;padding: 0px\">.js<\/span><\/pre>\n<p>\u63a5\u7740\uff0c\u6211\u7528\u5982\u4e0b\u547d\u4ee4\u4e3a\u57fa\u4e8e Truffle \u7684\u94b1\u5305 provider\uff0c\u6dfb\u52a0\u4e86\u5bf9\u5e94\u7684\u4f9d\u8d56\u9879\uff1a<\/p>\n<pre>npm install <span style=\"margin: 0px;padding: 0px\">--save @truffle\/hdwallet-provider<\/span><\/pre>\n<p>\u4e3a\u4e86\u521b\u5efa\u672c\u5730\u5f00\u53d1\u7f51\u7edc\uff0c\u6211\u901a\u8fc7\u547d\u4ee4 ganache \u542f\u52a8 Ganache CLI\u3002<\/p>\n<p>\u6839\u636e CLI \u7684\u5982\u4e0b\u54cd\u5e94\u4fe1\u606f\uff0c\u6211\u4eec\u53ef\u4ee5\u770b\u5230 Ganache \u5df2\u5728\u672c\u5730\u4e3b\u673a\u7684 8545 \u7aef\u53e3\u4e0a\u8fd0\u884c\uff1a<\/p>\n<pre>ganache v7<span style=\"margin: 0px;padding: 0px\">.0<\/span><span style=\"margin: 0px;padding: 0px\">.1<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>@ganache<span style=\"margin: 0px;padding: 0px\">\/<\/span>cli<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0.1<\/span><span style=\"margin: 0px;padding: 0px\">.2<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span> @ganache<span style=\"margin: 0px;padding: 0px\">\/<\/span>core<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0.1<\/span><span style=\"margin: 0px;padding: 0px\">.2<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>Starting RPC server<br>Available Accounts<br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x2B475e4fd7F600fF1eBC7B9457a5b58469b9EDDb<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x5D4BB40f6fAc40371eF1C9B90E78F82F6df33977<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">2<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xFaab2689Dbf8b7354DaA7A4239bF7dE2D97e3A22<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">3<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x8940fcaa55D5580Ac82b790F08500741326836e0<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">4<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x4c7a1b7EB717F98Fb0c430eB763c3BB9212F49ad<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">5<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x22dFCd5df8d4B19a42cB14E87219fea7bcA7C92D<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x56882f79ecBc2D68947C6936D4571f547890D07c<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">7<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xD257AFd8958c6616bf1e61f99B2c65dfd9fEE95A<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">8<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x4Bb2EE0866578465E3a2d3eCCC41Ea2313372B20<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">9<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xdf267AeFeAfE4b7053ca10c3d661a8CB24E98236<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1000<\/span> ETH<span style=\"margin: 0px;padding: 0px\">)<\/span><br>Private Keys<br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x5d58d27b0f294e3222bbd99a3a1f07a441ea4873de6c3a2b7c40b73186eb616d<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xb9e52d6cfb2c074fa6a6578b946e3d00ea2a332bb356d0b3198ccf909a97fdc8<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">2<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xc52292ce17633fe2724771e81b3b4015374d2a2ea478891dab74f2028184edeb<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">3<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xbc7b0b4581592e48ffb4f6420228fd6b3f954ac8cfef778c2a81188415274275<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">4<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xc63310ccdd9b8c2da6d80c886bef4077359bb97e435fb4fe83fcbec529a536fc<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">5<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x90bc16b1520b66a02835530020e43048198195239ac9880b940d7b2a48b0b32c<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x4fb227297dafb879e148d44cf4872611819412cdd1620ad028ec7c189a53e973<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">7<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0xf0d4dbe2f9970991ccc94a137cfa7cf284c09d0838db0ce25e76c9ab9f4316d9<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">8<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x495fbc6a16ade5647d82c6ad12821667f95d8b3c376dc290ef86c0d926f50fea<\/span><br><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">9<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">0x434f5618a3343c5e3b0b4dbeaf3f41c62777d91c3314b83f74e194be6c09416b<\/span><br>HD Wallet<br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br>Mnemonic<span style=\"margin: 0px;padding: 0px\">:<\/span>      immense salmon nominee toy jungle main lion universe seminar output oppose hungry<br>Base HD Path<span style=\"margin: 0px;padding: 0px\">:<\/span>  m<span style=\"margin: 0px;padding: 0px\">\/<\/span><span style=\"margin: 0px;padding: 0px\">44<\/span><span style=\"margin: 0px;padding: 0px\">'\/60'<\/span><span style=\"margin: 0px;padding: 0px\">\/<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">'\/0\/{account_index}<\/span><br><span style=\"margin: 0px;padding: 0px\">Default Gas Price<\/span><br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br><span style=\"margin: 0px;padding: 0px\">2000000000<\/span><br><span style=\"margin: 0px;padding: 0px\">BlockGas Limit<\/span><br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br><span style=\"margin: 0px;padding: 0px\">30000000<\/span><br><span style=\"margin: 0px;padding: 0px\">Call Gas Limit<\/span><br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br><span style=\"margin: 0px;padding: 0px\">50000000<\/span><br><span style=\"margin: 0px;padding: 0px\">Chain Id<\/span><br><span style=\"margin: 0px;padding: 0px\">==================<\/span><br><span style=\"margin: 0px;padding: 0px\">1337<\/span><br><span style=\"margin: 0px;padding: 0px\">RPC Listening on 127.0.0.1:8545<\/span><\/pre>\n<p>\u9879\u76ee\u6587\u4ef6\u5939\u4e2d\u7684 truffle-config.js \u6587\u4ef6\uff0c\u4f1a\u88ab\u6fc0\u6d3b\u5e76\u66f4\u65b0\u5982\u4e0b\u4ee3\u7801\u884c\uff1a<\/p>\n<pre>JSON<br>    development<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>      host<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"127.0.0.1\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span>     <span style=\"margin: 0px;padding: 0px\">\/\/<\/span> Localhost <span style=\"margin: 0px;padding: 0px\">(<\/span>default<span style=\"margin: 0px;padding: 0px\">:<\/span> none<span style=\"margin: 0px;padding: 0px\">)<\/span><br>      port<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">8545<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span>            <span style=\"margin: 0px;padding: 0px\">\/\/<\/span> Standard Ethereum port <span style=\"margin: 0px;padding: 0px\">(<\/span>default<span style=\"margin: 0px;padding: 0px\">:<\/span> none<span style=\"margin: 0px;padding: 0px\">)<\/span><br>      network_id<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"*\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span>       <span style=\"margin: 0px;padding: 0px\">\/\/<\/span> Any network <span style=\"margin: 0px;padding: 0px\">(<\/span>default<span style=\"margin: 0px;padding: 0px\">:<\/span> none<span style=\"margin: 0px;padding: 0px\">)<\/span><br>    <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><\/pre>\n<p>\u73b0\u5728\uff0c\u6211\u4eec\u53ef\u4ee5\u5728\u65b0\u7684\u7ec8\u7aef\u4e2d\u901a\u8fc7\u547d\u4ee4 --truffle console\uff0c\u6765\u542f\u52a8 Truffle \u63a7\u5236\u53f0\uff0c\u80fd\u663e\u793a\u5982\u4e0b\u63d0\u793a\uff1a<\/p>\n<pre>truffle<span style=\"margin: 0px;padding: 0px\">(<\/span>development<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> <\/pre>\n<p>\u6211\u4eec\u53ef\u4ee5\u5728\u63a7\u5236\u53f0\u4e2d\uff0c\u901a\u8fc7\u547d\u4ee4 --const HDWalletProvider = require('@truffle\/hdwallet-provider'); \u6765\u521b\u5efa\u94b1\u5305\u3002\u5f53\u7136\uff0c\u5b83\u53ef\u80fd\u4f1a\u5bfc\u81f4\u672a\u5b9a\u4e49\u7684\u54cd\u5e94\u3002<\/p>\n<p>\u63a5\u4e0b\u6765\uff0c\u6211\u9700\u8981\u901a\u8fc7 Mnemonic Code Converter(https:\/\/iancoleman.io\/bip39\/)\u7f51\u7ad9\uff0c\u751f\u6210\u4e00\u4e2a 12 \u5b57\u7684\u52a9\u8bb0\u8bcd(12-word mnemonic phrase\uff0c\u7c7b\u4f3c\u79c1\u94a5)\uff0c\u5e76\u5c06\u5176\u901a\u8fc7\u5982\u4e0b\u547d\u4ee4\uff0c\u66f4\u65b0\u5230 Truffle \u63a7\u5236\u53f0\u5904\uff1a<\/p>\n<pre>const mnemonic <span style=\"margin: 0px;padding: 0px\">=<\/span> <span style=\"margin: 0px;padding: 0px\">'12 words here'<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>const wallet <span style=\"margin: 0px;padding: 0px\">=<\/span> new HDWalletProvider<span style=\"margin: 0px;padding: 0px\">(<\/span>mnemonic<span style=\"margin: 0px;padding: 0px\">,<\/span> <span style=\"margin: 0px;padding: 0px\">\"http:\/\/localhost:8545\"<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><\/pre>\n<p>\u4e0a\u8ff0\u4e24\u6761\u547d\u4ee4\u867d\u7136\u4e5f\u4f1a\u5bfc\u81f4\u672a\u5b9a\u4e49\u7684\u54cd\u5e94\uff0c\u4f46\u662f\u94b1\u5305\u7684\u63a7\u5236\u53f0\u6700\u7ec8\u4f1a\u663e\u793a\u5982\u4e0b\u8fd0\u884c\u7ed3\u679c\uff1a<\/p>\n<pre>truffle<span style=\"margin: 0px;padding: 0px\">(<\/span>development<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> wallet<br>HDWalletProvider <span style=\"margin: 0px;padding: 0px\">{<\/span><br>  walletHdpath<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"m\/44'\/60'\/0'\/0\/\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>  wallets<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>...<br> <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>  addresses<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0xa54b012b406c01dd99a6b18ef8b55a15681449af'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x6d507a70924ea3393ae1667fa88801650b9964ad'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x1237e0a8522a17e29044cde69b7b10b112544b0b'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x80b4adb18698cd47257be881684fff1e14836b4b'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x09867536371e43317081bed18203df4ca5f0490d'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x89f1eeb95b7a659d4748621c8bdbabc33ac47bbb'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x54ceb6f0d722dcb33152c953d5758a08045f254d'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x25d2a8716792b98bf9cce5781b712f00cf33227e'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0x37b6364fb97028830bfeb0cb8d2b14e95e2efa05'<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">'0xe9f56031cb6208ddefcd3cdd5a1a41f7f3400af5'<\/span><br>  <span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>...<\/pre>\n<h2>\u6dfb\u52a0\u4ee5\u592a\u574a\u8d44\u91d1\u8fdb\u884c\u6d4b\u8bd5<\/h2>\n<p>\u73b0\u5728\u6211\u4eec\u9700\u8981\u4e3a Dapp \u83b7\u53d6\u4e00\u4e9b\u6d4b\u8bd5\u8d44\u91d1\uff0c\u5e76\u4f7f\u7528 Ropsten Ethereum Faucet(https:\/\/faucet.ropsten.be\/)\u5c06\u8d44\u91d1\u6dfb\u52a0\u5230\u73b0\u6709\u7684\u3001\u7531ConsenSys(https:\/\/consensys.net\/)\u521b\u5efa\u7684MetaMask(https:\/\/metamask.io\/index.html)\u94b1\u5305\u4e2d\u3002\u5f53\u7136\uff0c\u4e3a\u4e86\u964d\u4f4e\u610f\u5916\u60c5\u51b5\u6240\u5bfc\u81f4\u7684\u771f\u5b9e\u8d44\u91d1\u635f\u5931\u7684\u98ce\u9669\uff0c\u60a8\u53ef\u4ee5\u5728 MetaMask \u4e2d\u521b\u5efa\u591a\u4e2a\u5e10\u6237\uff0c\u5176\u4e2d\u81f3\u5c11\u6709\u4e00\u4e2a\u5e10\u6237\u53ef\u4e13\u7528\u4e8e\u5f00\u53d1\u548c\u6d4b\u8bd5\u3002\u8bf7\u8bb0\u4f4f\uff1a\u6c38\u8fdc\u4e0d\u8981\u4e0e\u4efb\u4f55\u4eba\u5206\u4eab\u60a8\u7684\u52a9\u8bb0\u8bcd\uff0c\u4e5f\u4e0d\u8981\u5728\u4efb\u4f55\u5730\u65b9\u4e0a\u4f20\u60a8\u7684\u79c1\u94a5!<\/p>\n<p>\u5982\u4e0b\u56fe\u6240\u793a\uff0c\u4e3a\u4e86\u6dfb\u52a0\u6d4b\u8bd5\u8d44\u91d1\uff0c\u6211\u9700\u8981\u8f93\u5165\u81ea\u5df1\u7684\u5e10\u6237\u5730\u5740\uff1a<\/p>\n<p style=\"text-align: center\">\n<p>\u5982\u4e0b\u56fe\u6240\u793a\uff0c\u901a\u8fc7 Ropsten Etherscan \u7ad9\u70b9\uff0c\u6211\u4eec\u53ef\u4ee5\u9a8c\u8bc1\u4ea4\u6613\u662f\u5426\u80fd\u591f\u6210\u529f\u5b8c\u6210\uff1a<\/p>\n<p style=\"text-align: center\">\n<h2>\u6700\u7ec8\u51c6\u5907\u6b65\u9aa4<\/h2>\n<p>\u8bf7\u4f7f\u7528\u5982\u4e0b\u547d\u4ee4\u5c06 dotenv \u4f9d\u8d56\u9879\u6dfb\u52a0\u5230\u8be5\u9879\u76ee\u4e2d\uff1a<\/p>\n<pre>npm install <span style=\"margin: 0px;padding: 0px\">--save dotenv<\/span><\/pre>\n<p>\u63a5\u7740\uff0c\u8bf7\u5728\u9879\u76ee\u7684\u6839\u76ee\u5f55\u4e0b\u521b\u5efa\u4e00\u4e2a.env \u7684\u65b0\u6587\u4ef6\uff0c\u5e76\u5728\u5176\u4e2d\u5305\u542b\u5982\u4e0b\u4e24\u884c\uff1a<\/p>\n<pre>INFURA_API_KEY<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">INSERT<\/span> YOUR API KEY HERE <span style=\"margin: 0px;padding: 0px\">(<\/span>no quotations<span style=\"margin: 0px;padding: 0px\">)<\/span><br>MNEMONIC<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"12 words here\"<\/span><\/pre>\n<p>\u5176\u4e2d\uff0cINFURA_API_KEY \u662f\u5728\u521b\u5efa jvc-homeowners-ballot \u9879\u76ee\u65f6\u7ed9\u5b9a\u7684\u9879\u76ee ID\u3002\u6ce8\u610f\uff1a\u8bf7\u786e\u4fdd.env \u6587\u4ef6\u88ab\u5305\u542b\u5728.gitignore \u6587\u4ef6\u4e2d\uff0c\u4ee5\u907f\u514d\u5176\u4ed6\u6709\u6743\u8bbf\u95ee\u8be5\u5b58\u50a8\u5e93\u7684\u4eba\uff0c\u64c5\u81ea\u4f7f\u7528\u6b64\u673a\u5bc6\u4fe1\u606f\u3002<\/p>\n<p>\u6700\u540e\u4e00\u9879\u51c6\u5907\u6b65\u9aa4\u662f\u66f4\u65b0 truffle-config.js \u6587\u4ef6\u3002\u6211\u4eec\u9996\u5148\u9700\u8981\u5728\u6587\u4ef6\u7684\u9876\u90e8\u6dfb\u52a0\u5982\u4e0b\u4e09\u884c\uff1a<\/p>\n<pre>JavaScript<br>require<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">\"dotenv\"<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.config<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>const HDWalletProvider <span style=\"margin: 0px;padding: 0px\">=<\/span> require<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">\"@truffle\/hdwallet-provider\"<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><\/pre>\n<p>\u63a5\u7740\uff0c\u6211\u4eec\u5229\u7528 dotenv \u5c06\u5982\u4e0b\u7f51\u7edc\u4fe1\u606f\uff0c\u6dfb\u52a0\u81f3\u4e0a\u8ff0\u4f9d\u8d56\u9879\uff1a<\/p>\n<pre>JavaScript<br>   ropsten<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>     provider<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">=&gt;<\/span><br>       new HDWalletProvider<span style=\"margin: 0px;padding: 0px\">(<\/span><br>         process<span style=\"margin: 0px;padding: 0px\">.env<\/span><span style=\"margin: 0px;padding: 0px\">.MNEMONIC<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>         `https<span style=\"margin: 0px;padding: 0px\">:<\/span><span style=\"margin: 0px;padding: 0px\">\/\/<\/span>ropsten<span style=\"margin: 0px;padding: 0px\">.infura<\/span><span style=\"margin: 0px;padding: 0px\">.io<\/span><span style=\"margin: 0px;padding: 0px\">\/<\/span>v3<span style=\"margin: 0px;padding: 0px\">\/<\/span>$<span style=\"margin: 0px;padding: 0px\">{<\/span>process<span style=\"margin: 0px;padding: 0px\">.env<\/span><span style=\"margin: 0px;padding: 0px\">.INFURA_API_KEY<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span>`<br>       <span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>     network_id<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">3<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span> <span style=\"margin: 0px;padding: 0px\">\/\/<\/span> Ropsten<span style=\"margin: 0px;padding: 0px\">'s id<\/span><br><span style=\"margin: 0px;padding: 0px\">     gas: 5500000, \/\/ Ropsten has a lower block limit than mainnet<\/span><br><span style=\"margin: 0px;padding: 0px\">     confirmations: 2, \/\/ # of confs to wait between deployments. (default: 0)<\/span><br><span style=\"margin: 0px;padding: 0px\">     timeoutBlocks: 200, \/\/ # of blocks before a deployment times out  (minimum\/default: 50)<\/span><br><span style=\"margin: 0px;padding: 0px\">     skipDryRun: true \/\/ Skip dry run before migrations? (default: false for public nets )<\/span><br><span style=\"margin: 0px;padding: 0px\">    },<\/span><\/pre>\n<h2>\u8bbe\u7f6e\u667a\u80fd\u5408\u7ea6<\/h2>\n<p>\u51c6\u5907\u597d\u4e86 Infura\u3001Truffle\u3001\u4ee5\u53ca\u6d4b\u8bd5\u8d44\u91d1\u540e\uff0c\u8ba9\u6211\u4eec\u5f00\u59cb\u8bbe\u7f6e\u667a\u80fd\u5408\u7ea6\u3002\u9488\u5bf9\u524d\u9762\u7684\u5c45\u59d4\u4f1a\u9009\u4e3e\u793a\u4f8b\uff0c\u6211\u4eec\u5c06\u4f7f\u7528\u4f4d\u4e8e\u672c\u9879\u76ee contracts \u6587\u4ef6\u5939\u4e2d\u7684 JvcHomeownerBallot.sol \u5408\u7ea6\uff1a<\/p>\n<pre>JavaScript<br><span style=\"margin: 0px;padding: 0px\">\/\/<\/span> SPDX<span style=\"margin: 0px;padding: 0px\">-<\/span>License<span style=\"margin: 0px;padding: 0px\">-<\/span>Identifier<span style=\"margin: 0px;padding: 0px\">:<\/span> UNLICENSED  <span style=\"margin: 0px;padding: 0px\">(<\/span>it <span style=\"margin: 0px;padding: 0px\">is<\/span> common practice to include an open source license <span style=\"margin: 0px;padding: 0px\">or<\/span> declare it unlicensed<span style=\"margin: 0px;padding: 0px\">)<\/span><br>pragma solidity <span style=\"margin: 0px;padding: 0px\">^<\/span><span style=\"margin: 0px;padding: 0px\">0.8<\/span><span style=\"margin: 0px;padding: 0px\">.7<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span>  <span style=\"margin: 0px;padding: 0px\">\/\/<\/span> tells the compiler which version to use<br><br>contract Homeowners <span style=\"margin: 0px;padding: 0px\">{<\/span><br><br>    <span style=\"margin: 0px;padding: 0px\">\/\/<\/span> store the addresses of voters <span style=\"margin: 0px;padding: 0px\">on<\/span> the blockchain <span style=\"margin: 0px;padding: 0px\">in<\/span> these <span style=\"margin: 0px;padding: 0px\">2<\/span> arrays<br>    address<span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span> votedYes<span style=\"margin: 0px;padding: 0px\">;<\/span><br>    address<span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span> votedNo<span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>    function voteYes<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> public <span style=\"margin: 0px;padding: 0px\">{<\/span><br>        votedYes<span style=\"margin: 0px;padding: 0px\">.push<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>msg<span style=\"margin: 0px;padding: 0px\">.sender<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>    <span style=\"margin: 0px;padding: 0px\">}<\/span><br><br>    function voteNo<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> public <span style=\"margin: 0px;padding: 0px\">{<\/span><br>        votedNo<span style=\"margin: 0px;padding: 0px\">.push<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>msg<span style=\"margin: 0px;padding: 0px\">.sender<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>    <span style=\"margin: 0px;padding: 0px\">}<\/span><br><br>    function getYesVotes<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> public view returns <span style=\"margin: 0px;padding: 0px\">(<\/span>uint<span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>        return votedYes<span style=\"margin: 0px;padding: 0px\">.length<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>    <span style=\"margin: 0px;padding: 0px\">}<\/span><br><br>    function getNoVotes<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> public view returns <span style=\"margin: 0px;padding: 0px\">(<\/span>uint<span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>        return votedNo<span style=\"margin: 0px;padding: 0px\">.length<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>    <span style=\"margin: 0px;padding: 0px\">}<\/span><br><span style=\"margin: 0px;padding: 0px\">}<\/span><\/pre>\n<p>\u6b63\u5982\u4e0a\u9762\u7684\u4ee3\u7801\u6240\u793a\uff0c\u8be5\u5408\u540c\u5c06\u975e\u5e38\u7b80\u5355\uff0c\u53c2\u9009\u5c45\u6c11\u53ea\u9700\u9009\u62e9\u662f\u6216\u5426\u5373\u53ef\u3002\u5176\u5bf9\u5e94\u7684 contracts \u6587\u4ef6\u5939\u7ed3\u6784\u5982\u4e0b\u56fe\u6240\u793a\uff1a<\/p>\n<pre>.<br>\u251c\u2500\u2500 JvcHomeownersBallot<span style=\"margin: 0px;padding: 0px\">.sol<\/span><br>\u2514\u2500\u2500 Migrations<span style=\"margin: 0px;padding: 0px\">.sol<\/span><\/pre>\n<p>\u6709\u4e86\u5408\u7ea6\uff0c\u6211\u4eec\u5c31\u9700\u8981\u5efa\u7acb\u90e8\u7f72\u5408\u7ea6\u7684\u65b9\u6cd5\u3002\u4e0b\u9762\u8ba9\u6211\u4eec\u8f6c\u79fb\u5230 migrations \u6587\u4ef6\u5939\uff0c\u5c06\u5982\u4e0b\u5185\u5bb9\u6dfb\u52a0\u5230\u8be5\u6587\u4ef6\u5939\u4e0b\u7684 2_deploy_contracts.js \u6587\u4ef6\u4e2d\uff1a<\/p>\n<pre>JavaScript<br>const JvcHomeownersBallot <span style=\"margin: 0px;padding: 0px\">=<\/span> artifacts<span style=\"margin: 0px;padding: 0px\">.require<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">\"JvcHomeownersBallot.sol\"<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>module<span style=\"margin: 0px;padding: 0px\">.exports<\/span> <span style=\"margin: 0px;padding: 0px\">=<\/span> function<span style=\"margin: 0px;padding: 0px\">(<\/span>deployer<span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br> deployer<span style=\"margin: 0px;padding: 0px\">.deploy<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>JvcHomeownersBallot<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><\/pre>\n<p>\u7136\u540e\uff0c\u6211\u4eec\u53ef\u4ee5\u4f7f\u7528\u5982\u4e0b\u547d\u4ee4\u6267\u884c\u5408\u7ea6\u7684\u8fc1\u79fb\uff1a<\/p>\n<pre>truffle migrate <span style=\"margin: 0px;padding: 0px\">--network ropsten <\/span><\/pre>\n<p>\u8fc1\u79fb\u7684\u54cd\u5e94\u7ed3\u679c\u4e3a\uff1a<\/p>\n<pre>Compiling your contracts...<br><span style=\"margin: 0px;padding: 0px\">===========================<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Compiling .<span style=\"margin: 0px;padding: 0px\">\/<\/span>contracts<span style=\"margin: 0px;padding: 0px\">\/<\/span>JvcHomeownersBallot<span style=\"margin: 0px;padding: 0px\">.sol<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Artifacts written to <span style=\"margin: 0px;padding: 0px\">\/<\/span>Users<span style=\"margin: 0px;padding: 0px\">\/<\/span>john<span style=\"margin: 0px;padding: 0px\">.vester<\/span><span style=\"margin: 0px;padding: 0px\">\/<\/span>projects<span style=\"margin: 0px;padding: 0px\">\/<\/span>jvc<span style=\"margin: 0px;padding: 0px\">\/<\/span>consensys<span style=\"margin: 0px;padding: 0px\">\/<\/span>jvc<span style=\"margin: 0px;padding: 0px\">-<\/span>homeowners<span style=\"margin: 0px;padding: 0px\">-<\/span>ballot<span style=\"margin: 0px;padding: 0px\">\/<\/span>build<span style=\"margin: 0px;padding: 0px\">\/<\/span>contracts<br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Compiled successfully using<span style=\"margin: 0px;padding: 0px\">:<\/span><br>   <span style=\"margin: 0px;padding: 0px\">-<\/span> solc<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0.8<\/span><span style=\"margin: 0px;padding: 0px\">.11<\/span><span style=\"margin: 0px;padding: 0px\">+<\/span>commit<span style=\"margin: 0px;padding: 0px\">.d7f03943<\/span><span style=\"margin: 0px;padding: 0px\">.Emscripten<\/span><span style=\"margin: 0px;padding: 0px\">.clang<\/span><br>Network up to <span style=\"margin: 0px;padding: 0px\">date<\/span>.<br>truffle<span style=\"margin: 0px;padding: 0px\">(<\/span>development<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> truffle migrate <span style=\"margin: 0px;padding: 0px\">--network ropsten<\/span><br>Compiling your contracts...<br><span style=\"margin: 0px;padding: 0px\">===========================<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Compiling .<span style=\"margin: 0px;padding: 0px\">\/<\/span>contracts<span style=\"margin: 0px;padding: 0px\">\/<\/span>JvcHomeownersBallot<span style=\"margin: 0px;padding: 0px\">.sol<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Compiling .<span style=\"margin: 0px;padding: 0px\">\/<\/span>contracts<span style=\"margin: 0px;padding: 0px\">\/<\/span>Migrations<span style=\"margin: 0px;padding: 0px\">.sol<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Artifacts written to <span style=\"margin: 0px;padding: 0px\">\/<\/span>Users<span style=\"margin: 0px;padding: 0px\">\/<\/span>john<span style=\"margin: 0px;padding: 0px\">.vester<\/span><span style=\"margin: 0px;padding: 0px\">\/<\/span>projects<span style=\"margin: 0px;padding: 0px\">\/<\/span>jvc<span style=\"margin: 0px;padding: 0px\">\/<\/span>consensys<span style=\"margin: 0px;padding: 0px\">\/<\/span>jvc<span style=\"margin: 0px;padding: 0px\">-<\/span>homeowners<span style=\"margin: 0px;padding: 0px\">-<\/span>ballot<span style=\"margin: 0px;padding: 0px\">\/<\/span>build<span style=\"margin: 0px;padding: 0px\">\/<\/span>contracts<br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Compiled successfully using<span style=\"margin: 0px;padding: 0px\">:<\/span><br>   <span style=\"margin: 0px;padding: 0px\">-<\/span> solc<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0.8<\/span><span style=\"margin: 0px;padding: 0px\">.11<\/span><span style=\"margin: 0px;padding: 0px\">+<\/span>commit<span style=\"margin: 0px;padding: 0px\">.d7f03943<\/span><span style=\"margin: 0px;padding: 0px\">.Emscripten<\/span><span style=\"margin: 0px;padding: 0px\">.clang<\/span><br><br>Starting migrations...<br><span style=\"margin: 0px;padding: 0px\">======================<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Network name<span style=\"margin: 0px;padding: 0px\">:<\/span>    <span style=\"margin: 0px;padding: 0px\">'ropsten'<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Network id<span style=\"margin: 0px;padding: 0px\">:<\/span>      <span style=\"margin: 0px;padding: 0px\">3<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Block gas <span style=\"margin: 0px;padding: 0px\">limit<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">8000000<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0x7a1200<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br><br><span style=\"margin: 0px;padding: 0px\">1<\/span>_initial_migration<span style=\"margin: 0px;padding: 0px\">.js<\/span><br><span style=\"margin: 0px;padding: 0px\">======================<\/span><br>   Deploying <span style=\"margin: 0px;padding: 0px\">'Migrations'<\/span><br>   <span style=\"margin: 0px;padding: 0px\">----------------------<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> transaction hash<span style=\"margin: 0px;padding: 0px\">:<\/span>    <span style=\"margin: 0px;padding: 0px\">0x5f227f26a31a3667a689be2d7fa6121a21153eb219873f6fc9aecede221b3b82<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Blocks<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">5<\/span>            Seconds<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">168<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> contract address<span style=\"margin: 0px;padding: 0px\">:<\/span>    <span style=\"margin: 0px;padding: 0px\">0x9e6008B354ba4b9f91ce7b8D95DBC6130324024f<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> block number<span style=\"margin: 0px;padding: 0px\">:<\/span>        <span style=\"margin: 0px;padding: 0px\">11879583<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> block <span style=\"margin: 0px;padding: 0px\">timestamp<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span>     <span style=\"margin: 0px;padding: 0px\">1643257600<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> account<span style=\"margin: 0px;padding: 0px\">:<\/span>             <span style=\"margin: 0px;padding: 0px\">0xa54b012B406C01dd99A6B18eF8b55A15681449Af<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> balance<span style=\"margin: 0px;padding: 0px\">:<\/span>             <span style=\"margin: 0px;padding: 0px\">1.573649230299520359<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> gas used<span style=\"margin: 0px;padding: 0px\">:<\/span>            <span style=\"margin: 0px;padding: 0px\">250142<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0x3d11e<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> gas price<span style=\"margin: 0px;padding: 0px\">:<\/span>           <span style=\"margin: 0px;padding: 0px\">2.506517682<\/span> gwei<br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> value sent<span style=\"margin: 0px;padding: 0px\">:<\/span>          <span style=\"margin: 0px;padding: 0px\">0<\/span> ETH<br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> total cost<span style=\"margin: 0px;padding: 0px\">:<\/span>          <span style=\"margin: 0px;padding: 0px\">0.000626985346010844<\/span> ETH<br>   Pausing for <span style=\"margin: 0px;padding: 0px\">2<\/span> confirmations...<br>   <span style=\"margin: 0px;padding: 0px\">------------------------------<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> confirmation number<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">1<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>block<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">11879584<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> confirmation number<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">2<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>block<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">11879585<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Saving migration to chain.<br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Saving artifacts<br>   <span style=\"margin: 0px;padding: 0px\">-------------------------------------<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Total cost<span style=\"margin: 0px;padding: 0px\">:<\/span>     <span style=\"margin: 0px;padding: 0px\">0.000626985346010844<\/span> ETH<br><br><span style=\"margin: 0px;padding: 0px\">2<\/span>_deploy_contracts<span style=\"margin: 0px;padding: 0px\">.js<\/span><br><span style=\"margin: 0px;padding: 0px\">=====================<\/span><br>   Deploying <span style=\"margin: 0px;padding: 0px\">'JvcHomeownersBallot'<\/span><br>   <span style=\"margin: 0px;padding: 0px\">-------------------------------<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> transaction hash<span style=\"margin: 0px;padding: 0px\">:<\/span>    <span style=\"margin: 0px;padding: 0px\">0x1bf86b0eddf625366f65a996e633db589cfcef1a4d6a4d6c92a5c1f4e63c767f<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Blocks<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span>            Seconds<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">16<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> contract address<span style=\"margin: 0px;padding: 0px\">:<\/span>    <span style=\"margin: 0px;padding: 0px\">0xdeCef6474c95E5ef3EFD313f617Ccb126236910e<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> block number<span style=\"margin: 0px;padding: 0px\">:<\/span>        <span style=\"margin: 0px;padding: 0px\">11879590<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> block <span style=\"margin: 0px;padding: 0px\">timestamp<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span>     <span style=\"margin: 0px;padding: 0px\">1643257803<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> account<span style=\"margin: 0px;padding: 0px\">:<\/span>             <span style=\"margin: 0px;padding: 0px\">0xa54b012B406C01dd99A6B18eF8b55A15681449Af<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> balance<span style=\"margin: 0px;padding: 0px\">:<\/span>             <span style=\"margin: 0px;padding: 0px\">1.573133154908720216<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> gas used<span style=\"margin: 0px;padding: 0px\">:<\/span>            <span style=\"margin: 0px;padding: 0px\">159895<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0x27097<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> gas price<span style=\"margin: 0px;padding: 0px\">:<\/span>           <span style=\"margin: 0px;padding: 0px\">2.507502486<\/span> gwei<br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> value sent<span style=\"margin: 0px;padding: 0px\">:<\/span>          <span style=\"margin: 0px;padding: 0px\">0<\/span> ETH<br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> total cost<span style=\"margin: 0px;padding: 0px\">:<\/span>          <span style=\"margin: 0px;padding: 0px\">0.00040093710999897<\/span> ETH<br>   Pausing for <span style=\"margin: 0px;padding: 0px\">2<\/span> confirmations...<br>   <span style=\"margin: 0px;padding: 0px\">------------------------------<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> confirmation number<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">1<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>block<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">11879591<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> confirmation number<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">2<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>block<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">11879592<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Saving migration to chain.<br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Saving artifacts<br>   <span style=\"margin: 0px;padding: 0px\">-------------------------------------<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Total cost<span style=\"margin: 0px;padding: 0px\">:<\/span>     <span style=\"margin: 0px;padding: 0px\">0.00040093710999897<\/span> ETH<br><br>Summary<br><span style=\"margin: 0px;padding: 0px\">=======<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Total deployments<span style=\"margin: 0px;padding: 0px\">:<\/span>   <span style=\"margin: 0px;padding: 0px\">2<\/span><br><span style=\"margin: 0px;padding: 0px\">&gt;<\/span> Final cost<span style=\"margin: 0px;padding: 0px\">:<\/span>          <span style=\"margin: 0px;padding: 0px\">0.001027922456009814<\/span> ETH<br><br><span style=\"margin: 0px;padding: 0px\">-<\/span> Blocks<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span>            Seconds<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span><br><span style=\"margin: 0px;padding: 0px\">-<\/span> Saving migration to chain.<br><span style=\"margin: 0px;padding: 0px\">-<\/span> Blocks<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span>            Seconds<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span><br><span style=\"margin: 0px;padding: 0px\">-<\/span> Saving migration to chain.<\/pre>\n<p>\u81f3\u6b64\uff0c\u6211\u4eec\u5df2\u5c06 JvcHomeownersBallot \u667a\u80fd\u5408\u7ea6\u90e8\u7f72\u5230\u4e86 Ropsten \u7f51\u7edc\u4e2d\u3002\u6211\u4eec\u53ef\u4ee5\u8fdb\u4e00\u6b65\u4f7f\u7528\u5982\u4e0b URL\uff0c\u6765\u9a8c\u8bc1\u667a\u80fd\u5408\u7ea6\uff0c\u5e76\u5728\u201cDeploying JvcHomeownersBallot\u201d\u65e5\u5fd7\u4e2d\u63d0\u4f9b\u5408\u7ea6\u7684\u5730\u5740\uff1a<\/p>\n<pre>https<span style=\"margin: 0px;padding: 0px\">:<\/span><span style=\"margin: 0px;padding: 0px\">\/\/<\/span>ropsten<span style=\"margin: 0px;padding: 0px\">.etherscan<\/span><span style=\"margin: 0px;padding: 0px\">.io<\/span><span style=\"margin: 0px;padding: 0px\">\/<\/span><\/pre>\n<p>\u6216\u662f\uff1a<\/p>\n<pre>https<span style=\"margin: 0px;padding: 0px\">:<\/span><span style=\"margin: 0px;padding: 0px\">\/\/<\/span>ropsten<span style=\"margin: 0px;padding: 0px\">.etherscan<\/span><span style=\"margin: 0px;padding: 0px\">.io<\/span><span style=\"margin: 0px;padding: 0px\">\/<\/span>address<span style=\"margin: 0px;padding: 0px\">\/<\/span><span style=\"margin: 0px;padding: 0px\">0xdeCef6474c95E5ef3EFD313f617Ccb126236910e<\/span><\/pre>\n<p style=\"text-align: center\">\n<h2>\u4f7f\u7528 React \u521b\u5efa Dapp<\/h2>\n<p>\u5728\u4e0a\u8ff0\u63d0\u5230\u7684 jvc-homeowners-ballot \u6587\u4ef6\u5939\u7684\u540c\u7ea7\u76ee\u5f55\uff0c\u6211\u5c06\u521b\u5efa\u4e00\u4e2a\u540d\u4e3a jvc-homeowners-ballot-client \u7684\u76ee\u5f55\uff0c\u901a\u8fc7\u8c03\u7528 React CLI \u548c\u5982\u4e0b\u547d\u4ee4\uff0c\u6765\u521b\u5efa\u540c\u540d\u7684 React \u5e94\u7528\uff1a<\/p>\n<pre>npx <span style=\"margin: 0px;padding: 0px\">create<\/span><span style=\"margin: 0px;padding: 0px\">-<\/span>react<span style=\"margin: 0px;padding: 0px\">-<\/span>app jvc<span style=\"margin: 0px;padding: 0px\">-<\/span>homeowners<span style=\"margin: 0px;padding: 0px\">-<\/span>ballot<span style=\"margin: 0px;padding: 0px\">-<\/span>client<\/pre>\n<p>\u63a5\u7740\uff0c\u6211\u901a\u8fc7\u5982\u4e0b\u547d\u4ee4\uff0c\u5c06 Web3 \u7684\u4f9d\u8d56\u9879\u5b89\u88c5\u5230 React \u5e94\u7528\u4e2d\uff1a<\/p>\n<pre>cd jvc<span style=\"margin: 0px;padding: 0px\">-<\/span>homeowners<span style=\"margin: 0px;padding: 0px\">-<\/span>ballot<span style=\"margin: 0px;padding: 0px\">-<\/span>client<br>npm installWeb3<\/pre>\n<p>\u6838\u5fc3\u7684 React \u5e94\u7528\u4e00\u65e6\u5c31\u7eea\uff0c\u6211\u4eec\u5c31\u9700\u8981\u5efa\u7acb\u5408\u7ea6\u5e94\u7528\u7684\u4e8c\u8fdb\u5236\u63a5\u53e3(application binary interface\uff0cABI)\uff0c\u4ee5\u4fbf Dapp \u4e0e\u4ee5\u592a\u574a\u751f\u6001\u7cfb\u7edf\u4e0a\u7684\u5404\u79cd\u5408\u7ea6\u8fdb\u884c\u901a\u4fe1\u3002<\/p>\n<p>\u6839\u636e JvcHomeownerBallot.sol \u667a\u80fd\u5408\u7ea6\u6587\u4ef6\u7684\u5185\u5bb9\uff0c\u6211\u4eec\u5728 build\/contracts \u6587\u4ef6\u5939\u4e0b\u6253\u5f00 JvcHomeownersBallet.json \u6587\u4ef6\uff0c\u5e76\u4f7f\u7528 abi.js \u6587\u4ef6\u7684 jvcHomeOwnersBallot \u5e38\u91cf\u7684\u201cabi\u201d\u5c5e\u6027\u503c\u3002\u5177\u4f53\u5185\u5bb9\u5982\u4e0b\uff1a<\/p>\n<pre>JavaScript<br>export const jvcHomeownersBallot <span style=\"margin: 0px;padding: 0px\">=<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><br>  <span style=\"margin: 0px;padding: 0px\">{<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"inputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"name\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"voteYes\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"outputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"stateMutability\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"nonpayable\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"type\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"function\"<\/span><br>  <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>  <span style=\"margin: 0px;padding: 0px\">{<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"inputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"name\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"voteNo\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"outputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"stateMutability\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"nonpayable\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"type\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"function\"<\/span><br>  <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>  <span style=\"margin: 0px;padding: 0px\">{<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"inputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"name\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"getYesVotes\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"outputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><br>      <span style=\"margin: 0px;padding: 0px\">{<\/span><br>        <span style=\"margin: 0px;padding: 0px\">\"internalType\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"uint256\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>        <span style=\"margin: 0px;padding: 0px\">\"name\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>        <span style=\"margin: 0px;padding: 0px\">\"type\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"uint256\"<\/span><br>      <span style=\"margin: 0px;padding: 0px\">}<\/span><br>    <span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"stateMutability\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"view\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"type\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"function\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"constant\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">true<\/span><br>  <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>  <span style=\"margin: 0px;padding: 0px\">{<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"inputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"name\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"getNoVotes\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"outputs\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">[<\/span><br>      <span style=\"margin: 0px;padding: 0px\">{<\/span><br>        <span style=\"margin: 0px;padding: 0px\">\"internalType\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"uint256\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>        <span style=\"margin: 0px;padding: 0px\">\"name\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>        <span style=\"margin: 0px;padding: 0px\">\"type\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"uint256\"<\/span><br>      <span style=\"margin: 0px;padding: 0px\">}<\/span><br>    <span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"stateMutability\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"view\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"type\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">\"function\"<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>    <span style=\"margin: 0px;padding: 0px\">\"constant\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">true<\/span><br>  <span style=\"margin: 0px;padding: 0px\">}<\/span><br><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><\/pre>\n<p>\u8be5\u6587\u4ef6\u5e94\u5f53\u88ab\u653e\u7f6e\u5728 React \u5e94\u7528\u76ee\u5f55 src \u7684\u65b0\u5efa\u5b50\u6587\u4ef6\u5939 abi \u5185\u3002<\/p>\n<p>\u4e0b\u9762\uff0c\u6211\u4eec\u6839\u636e\u5982\u4e0b\u914d\u7f6e\uff0c\u4ece\u5934\u5f00\u59cb\u66f4\u65b0 Apps.js\uff1a<\/p>\n<pre>JavaScript<br>import React<span style=\"margin: 0px;padding: 0px\">,<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span> useState <span style=\"margin: 0px;padding: 0px\">}<\/span> <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\"react\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import <span style=\"margin: 0px;padding: 0px\">{<\/span> jvcHomeownersBallot <span style=\"margin: 0px;padding: 0px\">}<\/span> <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\".\/abi\/abi\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>importWeb3from <span style=\"margin: 0px;padding: 0px\">\"web3\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import <span style=\"margin: 0px;padding: 0px\">\".\/App.css\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>constWeb3<span style=\"margin: 0px;padding: 0px\">=<\/span> newWeb3<span style=\"margin: 0px;padding: 0px\">(<\/span>Web3<span style=\"margin: 0px;padding: 0px\">.givenProvider<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>const contractAddress <span style=\"margin: 0px;padding: 0px\">=<\/span> <span style=\"margin: 0px;padding: 0px\">\"0xdeCef6474c95E5ef3EFD313f617Ccb126236910e\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>const storageContract <span style=\"margin: 0px;padding: 0px\">=<\/span> newWeb3<span style=\"margin: 0px;padding: 0px\">.eth<\/span><span style=\"margin: 0px;padding: 0px\">.Contract<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>jvcHomeownersBallot<span style=\"margin: 0px;padding: 0px\">,<\/span> contractAddress<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><\/pre>\n<p>\u6211\u4eec\u53ef\u4ee5\u901a\u8fc7\u591a\u79cd\u65b9\u5f0f\u627e\u5230\u4e0a\u9762\u63d0\u5230\u7684 contactAddress\u3002\u9664\u4e86\u6211\u5728\u6b64\u4f7f\u7528\u7684 truffle \u7684 migrate CLI \u547d\u4ee4\u4e4b\u5916\uff0c\u60a8\u8fd8\u53ef\u4ee5\u4f7f\u7528 Etherscan \u7ad9\u70b9(https:\/\/ropsten.etherscan.io\/)\u3002<\/p>\n<h2>\u6807\u51c6\u7684 React \u5f00\u53d1<\/h2>\n<p>\u5728\u5f00\u59cb\u6807\u51c6\u7684 React \u5f00\u53d1\u4e4b\u524d\uff0c\u8ba9\u6211\u4eec\u5148\u6765\u770b\u770b\u5b8c\u6574\u7684 App.js \u6587\u4ef6 (\u5982\u4e0b\u6240\u793a)\uff1a<\/p>\n<pre>JavaScript<br>import React<span style=\"margin: 0px;padding: 0px\">,<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span> useState <span style=\"margin: 0px;padding: 0px\">}<\/span> <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\"react\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import <span style=\"margin: 0px;padding: 0px\">{<\/span> jvcHomeownersBallot <span style=\"margin: 0px;padding: 0px\">}<\/span> <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\".\/abi\/abi\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>importWeb3from <span style=\"margin: 0px;padding: 0px\">\"web3\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import Nav <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\".\/components\/Nav.js\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import <span style=\"margin: 0px;padding: 0px\">\".\/App.css\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import <span style=\"margin: 0px;padding: 0px\">{<\/span> makeStyles <span style=\"margin: 0px;padding: 0px\">}<\/span> <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\"@material-ui\/core\/styles\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import Button <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\"@material-ui\/core\/Button\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>import <span style=\"margin: 0px;padding: 0px\">{<\/span>CircularProgress<span style=\"margin: 0px;padding: 0px\">,<\/span> Grid<span style=\"margin: 0px;padding: 0px\">,<\/span> Typography<span style=\"margin: 0px;padding: 0px\">}<\/span> <span style=\"margin: 0px;padding: 0px\">from<\/span> <span style=\"margin: 0px;padding: 0px\">\"@material-ui\/core\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>const useStyles <span style=\"margin: 0px;padding: 0px\">=<\/span> makeStyles<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>theme<span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">=&gt;<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><br> root<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>   <span style=\"margin: 0px;padding: 0px\">\"&amp; &gt; *\"<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>     margin<span style=\"margin: 0px;padding: 0px\">:<\/span> theme<span style=\"margin: 0px;padding: 0px\">.spacing<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">1<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br>   <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br> <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">,<\/span><br><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>constWeb3<span style=\"margin: 0px;padding: 0px\">=<\/span> newWeb3<span style=\"margin: 0px;padding: 0px\">(<\/span>Web3<span style=\"margin: 0px;padding: 0px\">.givenProvider<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>const contractAddress <span style=\"margin: 0px;padding: 0px\">=<\/span> <span style=\"margin: 0px;padding: 0px\">\"0xdeCef6474c95E5ef3EFD313f617Ccb126236910e\"<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>const storageContract <span style=\"margin: 0px;padding: 0px\">=<\/span> newWeb3<span style=\"margin: 0px;padding: 0px\">.eth<\/span><span style=\"margin: 0px;padding: 0px\">.Contract<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>jvcHomeownersBallot<span style=\"margin: 0px;padding: 0px\">,<\/span> contractAddress<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>function App<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br> const classes <span style=\"margin: 0px;padding: 0px\">=<\/span> useStyles<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> const <span style=\"margin: 0px;padding: 0px\">[<\/span>voteSubmitted<span style=\"margin: 0px;padding: 0px\">,<\/span> setVoteSubmitted<span style=\"margin: 0px;padding: 0px\">]<\/span> <span style=\"margin: 0px;padding: 0px\">=<\/span> useState<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">\"\"<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> const <span style=\"margin: 0px;padding: 0px\">[<\/span>yesVotes<span style=\"margin: 0px;padding: 0px\">,<\/span> setYesVotes<span style=\"margin: 0px;padding: 0px\">]<\/span> <span style=\"margin: 0px;padding: 0px\">=<\/span> useState<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> const <span style=\"margin: 0px;padding: 0px\">[<\/span>noVotes<span style=\"margin: 0px;padding: 0px\">,<\/span> setNoVotes<span style=\"margin: 0px;padding: 0px\">]<\/span> <span style=\"margin: 0px;padding: 0px\">=<\/span> useState<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> const <span style=\"margin: 0px;padding: 0px\">[<\/span>waiting<span style=\"margin: 0px;padding: 0px\">,<\/span> setWaiting<span style=\"margin: 0px;padding: 0px\">]<\/span> <span style=\"margin: 0px;padding: 0px\">=<\/span> useState<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">false<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br> const getVotes <span style=\"margin: 0px;padding: 0px\">=<\/span> async <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">=&gt;<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>     const postYes <span style=\"margin: 0px;padding: 0px\">=<\/span> await storageContract<span style=\"margin: 0px;padding: 0px\">.methods<\/span><span style=\"margin: 0px;padding: 0px\">.getYesVotes<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.call<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     setYesVotes<span style=\"margin: 0px;padding: 0px\">(<\/span>postYes<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>     const postNo <span style=\"margin: 0px;padding: 0px\">=<\/span> await storageContract<span style=\"margin: 0px;padding: 0px\">.methods<\/span><span style=\"margin: 0px;padding: 0px\">.getNoVotes<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.call<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     setNoVotes<span style=\"margin: 0px;padding: 0px\">(<\/span>postNo<span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br> const voteYes <span style=\"margin: 0px;padding: 0px\">=<\/span> async <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">=&gt;<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>     setWaiting<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">true<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>     const accounts <span style=\"margin: 0px;padding: 0px\">=<\/span> await window<span style=\"margin: 0px;padding: 0px\">.ethereum<\/span><span style=\"margin: 0px;padding: 0px\">.enable<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     const account <span style=\"margin: 0px;padding: 0px\">=<\/span> accounts<span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     const gas <span style=\"margin: 0px;padding: 0px\">=<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>await storageContract<span style=\"margin: 0px;padding: 0px\">.methods<\/span><span style=\"margin: 0px;padding: 0px\">.voteYes<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.estimateGas<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">*<\/span> <span style=\"margin: 0px;padding: 0px\">1.5<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     const post <span style=\"margin: 0px;padding: 0px\">=<\/span> await storageContract<span style=\"margin: 0px;padding: 0px\">.methods<\/span><span style=\"margin: 0px;padding: 0px\">.voteYes<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.send<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><br>         <span style=\"margin: 0px;padding: 0px\">from<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> account<span style=\"margin: 0px;padding: 0px\">,<\/span><br>         gas<span style=\"margin: 0px;padding: 0px\">,<\/span><br>     <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>     setVoteSubmitted<span style=\"margin: 0px;padding: 0px\">(<\/span>post<span style=\"margin: 0px;padding: 0px\">.from<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     setWaiting<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">false<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br> const voteNo <span style=\"margin: 0px;padding: 0px\">=<\/span> async <span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">=&gt;<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span><br>     setWaiting<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">true<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>     const accounts <span style=\"margin: 0px;padding: 0px\">=<\/span> await window<span style=\"margin: 0px;padding: 0px\">.ethereum<\/span><span style=\"margin: 0px;padding: 0px\">.enable<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     const account <span style=\"margin: 0px;padding: 0px\">=<\/span> accounts<span style=\"margin: 0px;padding: 0px\">[<\/span><span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">]<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     const gas <span style=\"margin: 0px;padding: 0px\">=<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span>await storageContract<span style=\"margin: 0px;padding: 0px\">.methods<\/span><span style=\"margin: 0px;padding: 0px\">.voteNo<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.estimateGas<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">*<\/span> <span style=\"margin: 0px;padding: 0px\">1.5<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     const post <span style=\"margin: 0px;padding: 0px\">=<\/span> await storageContract<span style=\"margin: 0px;padding: 0px\">.methods<\/span><span style=\"margin: 0px;padding: 0px\">.voteNo<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">.send<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><br>         <span style=\"margin: 0px;padding: 0px\">from<\/span><span style=\"margin: 0px;padding: 0px\">:<\/span> account<span style=\"margin: 0px;padding: 0px\">,<\/span><br>         gas<span style=\"margin: 0px;padding: 0px\">,<\/span><br>     <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br>     setVoteSubmitted<span style=\"margin: 0px;padding: 0px\">(<\/span>post<span style=\"margin: 0px;padding: 0px\">.from<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br>     setWaiting<span style=\"margin: 0px;padding: 0px\">(<\/span><span style=\"margin: 0px;padding: 0px\">false<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br> <span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><br> return <span style=\"margin: 0px;padding: 0px\">(<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span>classes<span style=\"margin: 0px;padding: 0px\">.root<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>     <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Nav <span style=\"margin: 0px;padding: 0px\">\/&gt;<\/span><br>     <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"main\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>       <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"card\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>         <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Typography variant<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"h3\"<\/span> gutterBottom<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>             JVC Homeowners Ballot<br>         <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Typography<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br><br>         <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Typography gutterBottom<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>             How do you wish to vote<span style=\"margin: 0px;padding: 0px\">?<\/span><br>         <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Typography<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br><br>         <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>span className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"buttonSpan\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Button<br>             id<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"yesButton\"<\/span><br>             className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"button\"<\/span><br>             variant<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"contained\"<\/span><br>             color<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"primary\"<\/span><br>             type<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"button\"<\/span><br>             onClick<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span>voteYes<span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span>Vote Yes<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Button<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"divider\"<\/span><span style=\"margin: 0px;padding: 0px\">\/&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Button<br>             id<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"noButton\"<\/span><br>             className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"button\"<\/span><br>             color<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"secondary\"<\/span><br>             variant<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"contained\"<\/span><br>             type<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"button\"<\/span><br>             onClick<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span>voteNo<span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span>Vote No<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Button<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"divider\"<\/span><span style=\"margin: 0px;padding: 0px\">\/&gt;<\/span><br>         <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>span<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br><br>         <span style=\"margin: 0px;padding: 0px\">{<\/span>waiting <span style=\"margin: 0px;padding: 0px\">&amp;&amp;<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>CircularProgress <span style=\"margin: 0px;padding: 0px\">\/&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Typography gutterBottom<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   Submitting Vote ... please wait<br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Typography<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>         <span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><br><br>         <span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">!<\/span>waiting <span style=\"margin: 0px;padding: 0px\">&amp;&amp;<\/span> voteSubmitted <span style=\"margin: 0px;padding: 0px\">&amp;&amp;<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Typography gutterBottom<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               Vote Submitted<span style=\"margin: 0px;padding: 0px\">:<\/span> <span style=\"margin: 0px;padding: 0px\">{<\/span>voteSubmitted<span style=\"margin: 0px;padding: 0px\">}<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Typography<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>         <span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><br><br>         <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>span className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"buttonSpan\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>            <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Button<br>                id<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"getVotesButton\"<\/span><br>                className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"button\"<\/span><br>                color<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"default\"<\/span><br>                variant<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"contained\"<\/span><br>                type<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"button\"<\/span><br>                onClick<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span>getVotes<span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span>Get Votes<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Button<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>         <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>span<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br><br>         <span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">(<\/span>yesVotes <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span> <span style=\"margin: 0px;padding: 0px\">||<\/span> noVotes <span style=\"margin: 0px;padding: 0px\">&gt;<\/span> <span style=\"margin: 0px;padding: 0px\">0<\/span><span style=\"margin: 0px;padding: 0px\">)<\/span> <span style=\"margin: 0px;padding: 0px\">&amp;&amp;<\/span> <span style=\"margin: 0px;padding: 0px\">(<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Typography variant<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"h5\"<\/span> gutterBottom<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               Current Results<br>           <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Typography<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br><br>           <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid container spacing<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">1<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid item xs<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"resultsAnswer resultsHeader\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span>Vote<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid item xs<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"resultsValue resultsHeader\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span># of Votes<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid item xs<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"resultsAnswer\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span>Yes<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid item xs<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"resultsValue\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span>yesVotes<span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid item xs<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"resultsAnswer\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span>No<span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>Grid item xs<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span><span style=\"margin: 0px;padding: 0px\">6<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>                   <span style=\"margin: 0px;padding: 0px\">&lt;<\/span>div className<span style=\"margin: 0px;padding: 0px\">=<\/span><span style=\"margin: 0px;padding: 0px\">\"resultsValue\"<\/span><span style=\"margin: 0px;padding: 0px\">&gt;<\/span><span style=\"margin: 0px;padding: 0px\">{<\/span>noVotes<span style=\"margin: 0px;padding: 0px\">}<\/span><span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>               <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>             <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>Grid<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>           <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>         <span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">}<\/span><br>       <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>     <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br>   <span style=\"margin: 0px;padding: 0px\">&lt;\/<\/span>div<span style=\"margin: 0px;padding: 0px\">&gt;<\/span><br> <span style=\"margin: 0px;padding: 0px\">)<\/span><span style=\"margin: 0px;padding: 0px\">;<\/span><br><span style=\"margin: 0px;padding: 0px\">}<\/span><br><br>export default App<span style=\"margin: 0px;padding: 0px\">;<\/span><\/pre>\n<h2>\u8fd0\u884c Dapp<\/h2>\n<p>\u6211\u4eec\u53ef\u4ee5\u4f7f\u7528 Yarn CLI \u7684\u5982\u4e0b\u547d\u4ee4\uff0c\u6765\u542f\u52a8\u57fa\u4e8e React \u7684 Dapp\uff1a<\/p>\n<pre>yarn start<\/pre>\n<p>\u5728\u5b8c\u6210\u7f16\u8bd1\u548c\u9a8c\u8bc1\u4e4b\u540e\uff0c\u60a8\u4f1a\u770b\u5230\u5982\u4e0b\u5e94\u7528\u754c\u9762\uff1a<\/p>\n<p style=\"text-align: center\">\n<p>\u5b83\u62e5\u6709\u4e09\u4e2a\u9009\u9879\uff1a<\/p>\n<ul>\n<li>VOTE YES - \u63d0\u4ea4\u8d5e\u6210\u7968<\/li>\n<li>VOTE NO - \u63d0\u4ea4\u53cd\u5bf9\u7968<\/li>\n<li>GET VOTES \u2013 \u5728 Dapp \u7684\u4e0b\u90e8\u663e\u793a\u6295\u8d5e\u6210\u4e0e\u53cd\u5bf9\u7968\u7684\u603b\u6570<\/li>\n<\/ul>\n<h2>\u5c0f\u7ed3<\/h2>\n<p>\u7efc\u4e0a\u6240\u8ff0\uff0c\u4e00\u65e6\u5efa\u7acb\u4e86\u667a\u80fd\u5408\u7ea6\uff0c\u4ece\u5ba2\u6237\u7aef\u7684\u89d2\u5ea6\u6765\u770b\uff0c\u6211\u4eec\u5c06\u80fd\u591f\u6cbf\u7528 Web2 \u7684\u5982\u4e0b\u65b9\u9762\u5230 Web3 \u4e0a\uff1a<\/p>\n<ul>\n<li>\u76ee\u524d\u5728 Web2 \u9879\u76ee\u4e2d\u5e38\u7528\u7684 JavaScript \u5ba2\u6237\u7aef\u6846\u67b6\uff0c\u53ef\u4ee5\u88ab\u7ee7\u7eed\u4f7f\u7528\u3002<\/li>\n<li>NPM \u53ef\u4ee5\u88ab\u7528\u6765\u5305\u542b\u4f9d\u8d56\u9879\uff0c\u4ee5\u4fc3\u8fdb Web3 \u7684\u5f00\u53d1\u3002<\/li>\n<li>\u7c7b\u4f3c\u4e8e Web2 \u5e94\u7528\u7a0b\u5e8f\u4e0e\u4f20\u7edf\u6570\u636e\u5b58\u50a8\u7684\u4ea4\u4e92\u65b9\u5f0f\uff0cWeb3 \u7684 Truffle \u548c MetaMask \u5e93\u4e5f\u5141\u8bb8\u5e94\u7528\u7a0b\u5e8f\u4e0e\u6570\u636e\u8fdb\u884c\u4ea4\u4e92\u3002<\/li>\n<li>\u73b0\u6709\u7684\u4e1a\u52a1\u89c4\u5219\u548c UI\/UX \u8bbe\u8ba1\uff0c\u5c06\u7ee7\u7eed\u6ee1\u8db3\u4ea7\u54c1\u6240\u6709\u8005\u5bf9\u4e8e Web3 \u7279\u6027\u548c\u529f\u80fd\u4e0a\u7684\u8981\u6c42\u3002<\/li>\n<\/ul>\n<p>\u800c Web3 \u7684\u72ec\u7279\u4e4b\u5904\u4e3b\u8981\u4f53\u73b0\u5728\uff1a<\/p>\n<ul>\n<li>\u5728\u533a\u5757\u94fe\u4e0a\u6784\u5efa\u7684 Dapps\uff0c\u90fd\u91c7\u7528\u540c\u4e00\u4e2a\u4e8b\u5b9e\u6e90\u5411\u5404\u4e2a\u4fe1\u606f\u6d88\u8d39\u8005\u7684\u8bf7\u6c42\uff0c\u63d0\u4f9b\u53ef\u9760\u7684\u6570\u636e\u3002<\/li>\n<li>\u6211\u4eec\u4e0d\u518d\u9700\u8981\u77e5\u9053\u201c\u8c01\u201d\u53c2\u4e0e\u4e86\u4ea4\u6613\u3001\u6216\u67e5\u8be2\u5b58\u50a8\u5728\u533a\u5757\u94fe\u667a\u80fd\u5408\u7ea6\u4e2d\u7684\u4fe1\u606f(\u54ea\u6015\u662f\u522b\u7684 Dapp \u53bb\u8bbf\u95ee\u5b58\u50a8\u7684\u6570\u636e)\u3002\u7531\u4e8e\u7ed3\u679c\u603b\u662f\u56fa\u5b9a\u4e0d\u53d8\u7684\uff0c\u56e0\u6b64 Dapp \u53ea\u9700\u5173\u6ce8\u5e94\u7528\u7a0b\u5e8f\u7684\u4e1a\u52a1\u89c4\u5219\u3002\u6b63\u5982\u4e0a\u8ff0\u5c45\u59d4\u4f1a\u9009\u4e3e\u7684\u7b80\u5355\u793a\u4f8b\u90a3\u6837\uff0c\u65e0\u8bba\u9009\u7968\u88ab\u67e5\u8be2\u591a\u5c11\u6b21\uff0c\u5373\u4fbf\u662f\u6709\u53e6\u4e00\u4e2a Dapp\uff0c\u5176\u7ed3\u679c\u603b\u662f\u5b8c\u5168\u76f8\u540c\u7684\u3002<\/li>\n<li>\u7531\u4e8e\u5176\u5206\u5e03\u5f0f\u7684\u7279\u6027\uff0c\u56e0\u6b64\u63a7\u5236\u6743\u88ab\u8fd4\u56de\u7ed9\u4e86\u6d88\u8d39\u8005\uff0c\u800c\u975e\u505c\u7559\u5728\u5c11\u6570\u4eba\u7684\u624b\u4e2d\u3002<\/li>\n<\/ul>\n<p>\u53ef\u89c1\uff0c\u4ece\u5168\u6808\u5f00\u53d1\u8005\u8fc8\u5411 Web3 \u7684\u5b66\u4e60\u66f2\u7ebf\u5e76\u4e0d\u9661\u5ced\uff0c\u800c\u4e14\u6211\u4eec\u53ef\u4ee5\u5bfb\u6c42\u5404\u79cd\u5de5\u5177\u3001\u6846\u67b6\u548c\u5e93\u7684\u5e2e\u52a9\u3002\u5982\u679c\u60a8\u5bf9\u4e0a\u8ff0\u9879\u76ee\u6240\u6d89\u53ca\u5230\u7684\u6e90\u4ee3\u7801\u611f\u5174\u8da3\u7684\u8bdd\uff0c\u53ef\u4ee5\u901a\u8fc7\u5982\u4e0b\u94fe\u63a5\uff0c\u8bbf\u95ee\u5230\u5b83\u5728 GitLab \u4e0a\u4e24\u4e2a\u5b58\u50a8\u5e93\uff1a<\/p>\n<ul>\n<li>https:\/\/gitlab.com\/johnjvester\/jvc-homeowners-ballot<\/li>\n<li>https:\/\/gitlab.com\/johnjvester\/jvc-homeowners-ballot-client<\/li>\n<\/ul>\n<h2>\u8bd1\u8005\u4ecb\u7ecd<\/h2>\n<p>\u9648\u5cfb (Julian Chen)\uff0cIDC.NET \u793e\u533a\u7f16\u8f91\uff0c\u5177\u6709\u5341\u591a\u5e74\u7684 IT \u9879\u76ee\u5b9e\u65bd\u7ecf\u9a8c\uff0c\u5584\u4e8e\u5bf9\u5185\u5916\u90e8\u8d44\u6e90\u4e0e\u98ce\u9669\u5b9e\u65bd\u7ba1\u63a7\uff0c\u4e13\u6ce8\u4f20\u64ad\u7f51\u7edc\u4e0e\u4fe1\u606f\u5b89\u5168\u77e5\u8bc6\u4e0e\u7ecf\u9a8c;\u6301\u7eed\u4ee5\u535a\u6587\u3001\u4e13\u9898\u548c\u8bd1\u6587\u7b49\u5f62\u5f0f\uff0c\u5206\u4eab\u524d\u6cbf\u6280\u672f\u4e0e\u65b0\u77e5;\u7ecf\u5e38\u4ee5\u7ebf\u4e0a\u3001\u7ebf\u4e0b\u7b49\u65b9\u5f0f\uff0c\u5f00\u5c55\u4fe1\u606f\u5b89\u5168\u7c7b\u57f9\u8bad\u4e0e\u6388\u8bfe\u3002<\/p>\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u8fd1\u5e74\u6765\u5927\u70ed\u7684\u7f8e\u5267\u300a\u521b\u4e1a\u516c\u53f8(StartUp)\u300b\u865a\u6784\u4e86\u4e00\u79cd\u88ab\u79f0\u4e3a GenCoin \u7684\u6570\u5b57\u8d27\u5e01\uff0c\u53ef\u7528\u4e8e\u5404\u79cd\u521b\u65b0\u5f0f\u7684 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":246174,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[200988],"tags":[],"class_list":["post-246173","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-200988"],"_links":{"self":[{"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/posts\/246173","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/comments?post=246173"}],"version-history":[{"count":0,"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/posts\/246173\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/media\/246174"}],"wp:attachment":[{"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/media?parent=246173"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/categories?post=246173"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/idc.net\/help\/wp-json\/wp\/v2\/tags?post=246173"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}