react-ive-meteor, 演示应用使用社交提要进行反应和 Meteor

分享于 

10分钟阅读

GitHub

  繁體 雙語
Demo app of React and Meteor using a social feed
  • 源代码名称:react-ive-meteor
  • 源代码网址:http://www.github.com/AdamBrodzinski/react-ive-meteor
  • react-ive-meteor源代码文档
  • react-ive-meteor源代码下载
  • Git URL:
    git://www.github.com/AdamBrodzinski/react-ive-meteor.git
    Git Clone代码到本地:
    git clone http://www.github.com/AdamBrodzinski/react-ive-meteor
    Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/AdamBrodzinski/react-ive-meteor
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
    Meteor

    http://react-ive.meteor.com



    构建实时后端和客户端乐观用户界面是很困难的。 Meteor 使使用乐观UI更新应用程序和实时数据流变得很容易。

    磅;DR博士

    这个 repo 旨在成为一个沙箱,开发人员可以学习如何使用 Meteor 后端创建响应应用程序。 我们将有几个不同的分支来构建/使用应用程序( 如全通量规格)。

    具有通量或者继电器类型实验的Meteor 有点复杂,所以主分支将是初学者最简单的版本。

    Meteor 开发团队正在努力与 Meteor 进行更深入和更无缝的集成,并做出React。 在这里检查进度 主分支正在使用这里软件包的预览版本。


    #### 使用 Meteor的优势
    • 自动乐观用户界面更新( 延迟补偿)
    • 在客户机和服务器上共享通用 JS ( 同构)
    • 实时数据库更新( 如uber驱动程序位置的实时)
    • 热代码重新加载
    • 迷你mongo客户端数据存储( 简单客户端查询)
    • ,Babel,等等的编译系统。
    • 用光纤清除服务器端代码( 很快就会出现ES7异步/等待)
    • 基于查询的数据订阅而不是 REST ( 也支持 API REST )
    • 通过DDP轻松实现 microservice
    • 模块化,替换你希望的任何默认组件

    使用 Meteor的缺点

    • 没有对SQL的实时查询支持( 通过GraphQL支持非React性 SQL )
    • 还没有导入客户端文件导入系统( 1.3将更改这里系统)

    Meteor的谬误

    • 不安全- 这已经解决了很长一段时间。 尝试修改其他人的帖子 !
    • 不可伸缩- 许多公司使用 Meteor 和大型用户库
    • 只支持 Mongo - 使用GraphQL任何承诺的驱动程序将工作
    • Meteor 仅适用于实时流- 无需实时更新也能正常工作 !

    这些缺点位于核心路线图上,将在不久的将来解决。 但是有些可能是你的项目的障碍。



    用法

    • curl https://install.meteor.com/| sh更多信息。
    • make dev 或者 meter --settings '.config/devel/settings.json'

    ## 数据

    使用 Meteor 获取数据与传统的REST系统有很大的不同。 你可以订阅一个或者多个数据的发布,而不是向单个资源终结点发出请求。 如果数据库中的数据更改,你将收到mongo客户机(。使用Oplog时立即使用) 中的新数据。 使用 MeteorMixin,这个新数据与你的订阅/状态同步,它呈现你的视图。

    这个新数据被发送到一个叫迷你mongo的商店。 它就像一个内存Mongo数据库,它是一个访问存储数据的非常方便的方法。 因为这是在内存中,ops是非常快速的( 基本上是一个键/值查找)。 如果你使用PostgreSQL数据库,你将使用SQL来查询小型PostgreSQL存储。

    如果你喜欢一个流量架构,你可以使用跟踪来观察变化,然后发出改变的事件。

    整个数据循环如下所示:

    • 祖父组件呈现子组件
    • 孩子告诉祖父他们需要哪些数据/字段
    • 祖父在同一时间订阅数据
    • 如果授权,服务器将数据发布到客户端
    • 客户接受数据并插入迷你mongo客户端存储
    • 祖父接收到他们所关心的数据的信息
    • 祖父触发( 通过 Meteor mixin )
    • 从祖父到所有孩子的数据流

    新的Meteor 用户可以通过向客户端发送太多的数据来引发这里过程,从而导致减速。 这里项目使用 graphql/relay启发订阅来帮助防止发布数据。 每个组件指定他们需要什么字段,而他们的祖父负责实际的查询。 这位祖父通过他们的道具推下了新数据。 这使得测试非常容易,因为只在一个地方进行提取。 这里数据提取系统是第一个草稿,因此它可能会更改某些。

    视图

    这个 repo ( 还有生动的例子)的主分支使用了 Meteor ( 把手像语法一样) 模板和响应模板的混合。 Blaze是理想的内容,没有状态和非常小的助手。 这些大型页面( 比如 about ) 在JSX中使用起来很麻烦。

    在这个设置中,路由器呈现'页面'模板,它只负责处理 static 标记并呈现最上面的响应组件。 这些页面不订阅数据,负责最顶层的组件。 示例代码

    渲染路径类似于以下内容:

    • 路由/feed, routes.js 呈现 static client/pages/feed.html 模板
    • static feed 模板呈现FeedList和CreatePost响应组件
    • FeedList设置数据 pub/sub并呈现子对象
    • CreatePost呈现子级
    • 视图已经就绪

    但是,如果你的应用程序看起来非常 '应用' ( Spotify,Slack等等。) 和 not'页面像',使用 100% React视图是一种更好的方法。 查看 full-react 分支( 不久),了解如何使用响应路由器模块呈现React视图。


    ## Meteor 方法

    Meteor 提供了可以在客户端或者服务器( 连使用DDP适配器的非服务器) 上调用的RPC样式方法。 你只需在服务器上和你调用 Meteor.call('multiply', 2, 5);的客户端上编写一。 在服务器上调用将直接返回 10,因为我们有光纤。 在客户端,我们不能阻止最后一个参数是一个带参数 errorresponse的回调。 你还可以访问方法中的一些资源,如 this.userId。 如果被认证,它将包含调用者的userId。 Meteor 在 Authors.insert({name:'foo'}) 调用的幕后使用这些方法。 然而,我们使用我们自己的模型方法绕过困难的原因允许/拒绝规则。 Meteor 方法实际上很好的支持流量分配器。


    ## 模型

    在这个项目中使用的数据模型的实现只是许多方法中的一个。 Meteor 没有ORM或者模型层,所以你可以自己运行或者使用包。 有几个不错的模型包,但它们有很多魔术。 为了简单起见,我使用了一个 Pattern 我在几个生产应用中使用过。 但是,为了保持代码稍微小一点,继承使用了旧 IE 中不支持的__proto__。 你需要一个更详细的方法来使这个工作与不受支持的( 旧的) 浏览器一起使用。 这些模型还没有像Mongoose或者wsrr那样完全特色,但是为了简单起见,这些模型还是非常简单。


    ## 加载顺序

    Meteor 目前没有基于文件的MODULE 导入系统,如 Browserfy。web pack或者ES6模块( 虽然我们可以导入它们并在全局上公开像这样的示例。)。 但是我听说这将在不久的将来出现。 当前 Meteor 有一组用于加载的规则。 请阅读这里的完整摘要( )。 只向客户端发送 client/ 文件夹,并且 server 文件夹只发送到服务器。 both 文件夹将被发送到客户端和服务器。


    ## 代码生成器

    没有人喜欢打字。 如果这个项目结构的文件夹适合你,Meteor 会生成,可以节省很多时间。 我正处于转换旧MVC模式到组件结构React的中间阶段。 这应该在NPM上,但在平均时间,保持警惕的这个分支的工作。 它使用Sass样式创建模型。页面。路由。React组件以及更多的。


    ## 安全性

    简而言之,信任客户 nothing。 假定从客户端传递到服务器的所有内容都可能是恶意的。 Meteor 提供用于检查所有输入的实用程序,以确保它们是你预期的形状和类型。 这可以防止Mongo注入。如果它们不是你期望的形状/类型,请拒绝它并引发错误。 移除不安全的软件包 它自动允许对 insert/update/remove 方法的完全访问。 这对于扔掉Prototype或者学习最基本的东西是很好的,但它是一个安全风险。

    还应当删除 autopublish autopublish 软件包。 这将把你的整个服务器服务器端数据库发送到客户机,并将它的装载到迷你mongo存储库。 这不仅慢于大型数据集,而且是安全风险。
    只有向客户端发送授权数据 要验证是否允许用户订阅发布,由你来决定。 除非你把它发送给他们,否则他们不能在迷你mongo里访问它。 你只想发送数据,它们是允许的/应该使用。

    Meteor 安全会话请参阅代码注释


    react  DEMO  soc  Meteor  FEED  SOCI  
    相关文章