如何使用Meteor开发以太坊Dapp

本教程将向你展现如何设置Meteor应用程序以用做Ðapp，并可能回答几个关于为何应该使用Meteor的问题。

常问问题

Meteor不是一个完整的堆栈框架，它是如何适应Ðapp开发的

是的，Meteor是一个完整的堆栈框架，它的主要改进是实时Web应用程序，但Meteor也是第一个框架（我知道），它彻底支持了单页app（SPA）开发并提供了全部必要的工具。

Meteor很是适合的5个理由：

• 它纯粹用JS编写，具备SPA所需的全部工具（模板引擎，模型，动态编译，绑定等）。
• 你将得到一个开发环境，它具备实时从新加载，CSS注入和支持许多预编译器（LESS，Coffeescript等）即插即用。
• 你可使用meteor-build-client将全部前端代码做为单个index.html，使用一个js和css文件加载你的资源。而后，你能够在任何地方托管它或简单地运行index.html自己或稍后在swarm上分发它。
• 它包含完整的响应性，这使得构建一致的界面更容易（相似于angular.js $scope或binding）
• 它有一个名为Minimongo的优秀模型，它为你提供了一个相似mongoDB的接口，用于一个被动的内存数据库，它也能够自动持久化到localstorage或indexedDB

我是否须要在服务器上托管个人Ðapp？

不，使用meteor-build-client，你能够在没有服务器的状况下运行Ðapp的全部静态资源，可是若是你使用像iron或flow-router这样的路由器 ，则须要使用hash（index.html#!/mypath）路由而不是干净的HTML5 pushstate路由。

建立你的Ðapp

若是尚未安装Meteor：

$ curl https://install.meteor.com/ |  SH

而后建立一个app：

$ meteor create myDapp
$ cd myDapp

接下来添加web3包：

$ meteor add ethereum:web3

我还建议添加如下包：

• ethereum:dapp-styles：LESS/CSS框架，它为你的dapp提供了一个很好的Mist-consistent外观。
• ethereum:tools：这个包为EthTools对象提供了一组格式转换函数和ether的模板助手。
• ethereum:elements：一组专门为以太坊制做的界面元素。
• ethereum:accounts： 为你提供全部当前可用的以太坊账户的响应式EthAccounts集合，其中余额将自动更新。
• ethereum:blocks：为你提供最新50个块的响应式EthBlocks集合。要得到最新的块，请使用EthBlocks.latest（它还将具备最新的默认gasPrice）
• frozeman:template-var：为你提供TemplateVar对象，容许你设置特定于模板实例的反应变量。
• frozeman:persistent-minimongo2：容许你在本地存储中自动保留minimongo集合。

启动你的Ðapp

游览Meteors文件夹结构

Meteor不会强制你拥有特定的文件夹结构，尽管某些文件夹具备特定含义，而且在绑定/运行你的应用程序时将被区别对待。

具备特定处理的文件夹

• client：名为client的文件夹中的文件只会由应用程序的客户端部分加载，由于咱们正在构建一个Ðapp，这就是咱们大多数文件所在的位置。
• lib：名为lib文件夹中的文件将在同一文件夹中的其余文件以前加载。这是你的init文件，库或以太坊特定文件的理想位置。
• public：一个名为public的文件夹包含meteor资源将在你的网络服务器的根目录上提供（或之后绑定的Ðapp）。
• 还有一些更具体的文件夹，如server，tests，packages等。若是你想了解它们，请查看Meteor

所以，为了构建Ðapp，咱们理想情况下是在myDapp文件夹中建立如下文件夹结构：

- myDapp
   - client
      - lib
      - myDapp.html
      - myDapp.js
      - myDapp.css
   - public

注意社区还提供了像Nick Dodson这样的Meteor Ðapp Boilerplates：https://github.com/SilentCicero/meteor-dapp-boilerplate

链接你的Ðapp

要链接咱们的dapp，咱们须要在另外一个终端中使用正确的CORS头开始geth：

$ geth --rpc --rpccorsdomain "http://localhost:3000"

咱们还须要设置provider。理想状况下，咱们在lib文件夹中建立一个名为init.js的文件，并添加如下行：

if(typeof web3 === 'undefined')
    web3 = new Web3(new Web3.providers.HttpProvider('http://localhost:8545'));

运行你的Ðapp

如今咱们能够经过简单运行来运行咱们的Ðapp：

$ meteor

若是咱们转到http://localhost:3000，咱们应该看到一个网站出现，若是咱们打开浏览器控制台，咱们可使用web3对象来查询geth节点：

> web3.eth.accounts
['0xfff2b43a7433ddf50bb82227ed519cd6b142d382']

添加Ðapp样式

若是你但愿你的Ðapp很好地适应Mist而且遵循官方的外观，请使用dapp-styles css css/less框架。

请注意，它们正在大量开发中，类名称和元素可能会发生变化。

要添加它，请将如下包添加到Ðapp：

$ meteor add less
$ meteor add ethereum:dapp-styles

如今将myDapp.css重命名为myDapp.less并在其中添加如下行：

// libs
@import '{ethereum:dapp-styles}/dapp-styles.less';

如今，你可使用全部dapp-styles类，也能够覆盖框架的全部变量。你能够在回调中找到它们。经过将它们复制到myDapp.less文件并设置不一样的值来覆盖它们。

使用以太坊包

为了让你的Ðapp开发人员更轻松，咱们提供了一些帮助你更快地构建Ðapp的软件包。

若是你添加上面推荐的软件包，你应该使用以太坊：ethereum:tools，ethereum:accounts和ethereum:blocks。

这3个包为你提供了EthTools，EthAccounts和Ethblocks对象，它们为你提供格式化程序功能，包含来自web3.eth.accounts（具备自动更新余额）的账户的集合以及最近50个块的集合。

大多数这些功能都是响应式的，所以它们应该使构建界面变得垂手可得。

用法示例

若是你看看myDapp.html你会发现hello模板。只需在<template name="hello">..</template>标签之间添加一个名为{{currentBlock}}的helper。

如今打开myDapp.js并在counter() {..}以后添加currentBlock helper：

Template.elements.helpers({
    counter() {
      ...
    },
    currentBlock() {
        return EthBlocks.latest.number;
    }
  });

而后经过添加EthBlocks.init()；初始化EthBlocks EthBlocks.init()；在this.counter = new ReactiveVar(0)；

若是你如今在浏览器中检查Ðapp，你应该会看到最新的块号，一旦你开采，它将会增长。

有关更多示例，请查看软件包的readme文件和演示 （源代码）以获取更多信息。

Ðapp代码结构

本教程不会用Meteor构建应用程序。有关这方面的信息，请参阅Meteor的教程，优秀资源列表 或使用Meteor或Discover Meteor构建单页Web应用程序等书籍。

TODO：

• 把以太坊相关的东西放到client/lib/ethereum/somefile.js。
• 使用myCollection.observe({added: func, changed: func, removed: func})与ethereum进行通讯，尽量地保持ethereum逻辑不在你的应用中。这样你只须要编写和读取你的响应集合，观察函数将处理其他的（例如sendTransactions）
• 过滤器等会将日志等添加到你的集合。所以，你能够将全部回调信息从应用逻辑中删除。

有关示例，请参阅以太坊钱包。

绑定你的Ðapp

要将Ðapp绑定到本地独立文件，请使用meteor-build-client：

$ npm install -g meteor-build-client
$ cd myDapp
$ meteor-build-client ../build --path ""

这会将你的Ðapps静态文件放入myDapp文件夹上方的build文件夹中。

最后一个选项--path将使全部文件相对连接，容许你经过单击build/index.html启动应用程序。

请注意，在file://协议上运行应用程序时，因为Web安全性，你将没法使用客户端路由。稍后你将可以使用客户端路由，由于dapps是经过eth://协议提供的。

未来你能够简单地在swarm上传你的Ðapp。

提交你的Ðapp

要得到Ðapp的早期流量，你能够将Ðapp提交给Dapp Insight。 这是一个最受欢迎的Dapp分析工具，它列出了世界上全部正在运行的Dapps。

======================================================================

分享一些以太坊、EOS、比特币等区块链相关的交互式在线编程实战教程：

• java以太坊开发教程，主要是针对java和android程序员进行区块链以太坊开发的web3j详解。
• python以太坊，主要是针对python工程师使用web3.py进行区块链以太坊开发的详解。
• php以太坊，主要是介绍使用php进行智能合约开发交互，进行帐号建立、交易、转帐、代币开发以及过滤器和交易等内容。
• 以太坊入门教程，主要介绍智能合约与dapp应用开发，适合入门。
• 以太坊开发进阶教程，主要是介绍使用node.js、mongodb、区块链、ipfs实现去中心化电商DApp实战，适合进阶。
• C#以太坊，主要讲解如何使用C#开发基于.Net的以太坊应用，包括帐户管理、状态与交易、智能合约开发与交互、过滤器和交易等。
• EOS教程，本课程帮助你快速入门EOS区块链去中心化应用的开发，内容涵盖EOS工具链、帐户与钱包、发行代币、智能合约开发与部署、使用代码与智能合约交互等核心知识点，最后综合运用各知识点完成一个便签DApp的开发。
• java比特币开发教程，本课程面向初学者，内容即涵盖比特币的核心概念，例如区块链存储、去中心化共识机制、密钥与脚本、交易与UTXO等，同时也详细讲解如何在Java代码中集成比特币支持功能，例如建立地址、管理钱包、构造裸交易等，是Java工程师不可多得的比特币开发学习课程。
• php比特币开发教程，本课程面向初学者，内容即涵盖比特币的核心概念，例如区块链存储、去中心化共识机制、密钥与脚本、交易与UTXO等，同时也详细讲解如何在Php代码中集成比特币支持功能，例如建立地址、管理钱包、构造裸交易等，是Php工程师不可多得的比特币开发学习课程。
• tendermint区块链开发详解，本课程适合但愿使用tendermint进行区块链开发的工程师，课程内容即包括tendermint应用开发模型中的核心概念，例如ABCI接口、默克尔树、多版本状态库等，也包括代币发行等丰富的实操代码，是go语言工程师快速入门区块链开发的最佳选择。

汇智网原创翻译，转载请标明出处。这里是原文如何使用Meteor开发以太坊Dapp