说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

详解下一代开源混合应用框架Reapp

HTML文档下载 WORD文档下载 PDF文档下载
Reapp是一款使用React来开发混合应用的开源框架,为开发者提供了他们开发所需的一切,其中包括各式模块的集合、UI工具包等。事实上,Reapp很简单,你甚至可以只是用其中的UI工具包就能构建出一款应用。

Reapp是一款使用React来开发混合应用的开源框架,为开发者提供了他们开发所需的一切,其中包括各式模块的集合、UI工具包、引导应用的CLI,以及一个预配置的构建服务器,支持Android、iOS。起先,Reapp的构建并不是以成为一个框架为目的,相反,它是作为一个UI工具包开始的。Reapp很简单,你甚至可以只是用其中的UI工具包就能构建出一款应用。

首先,我们通过一张图表来看一下Reapp与其他几款框架的区别:


(点击图片查看大图)

接下来,我们详细了解一下Reapp的各个部分及功能。

CLI

CLI拥有两个主要功能:首先是构建新的应用;其次是可以运行你的应用。Reapp服务器是一个可以与默认应用结构工作默契的简单的express服务器。

CLI的使用:

Usage: reapp [options] [command]Commands:  new [name]  creates a directory with a new reapp-starter scaffold  run         runs a reapp application with express/webpack-dev-server  build       builds a reapp application to a bundle in ./build  debug       use this to for opening issues!  help [cmd]  display help for [cmd]

UI Kit

  • 动画:动态和完全交互式的JavaScript编写的动画。
  • 样式:JavaScript + Flexbox,可组合、动态、可声明接口。
  • 主题:混合匹配物理场数、风格样式和动画来制作自己的主题。
  • 视图:使用Views、ViewLists甚至是嵌套的ViewLists来构建视图。
  • 多态:所有的动画和样式都可以混合使用,让设计多样化。

具体模块

  • reapp-ui

reapp-ui是React组件的一个合集,用于构建应用的UI:

  • 能够很好的协同工作
  • 具有极少依赖性的轻量级代码
  • 主题化
  • 适应众多平台
  • reapp-pack

生成webpack配置的一个辅助,还带有其他一些小的辅助功能。包括能够简单使用webpack开发服务器的./webpackServer。

使用:

var config = require('./config/webpack.run.js');var webpackServer = require('reapp-pack/webpackServer');webpackServer(config, {  port: 3011,  debug: true,  hot: true});

  • reapp-routes

reapp-routes是一个生成表示路线树的小型库,同时映射到路径。它最主要的作用就是节省代码和执行的一致性。

使用前:

var App = require('./components/App');var Sub = require('./components/app/Sub');var OtherSub = require('./components/app/OtherSub');module.exports =  <Route handler={App} path="/">    <Route name="sub" handler={Sub} />    <Route name="otherSub" handler={OtherSub} />  </Route>
使用后:

module.exports = routes(require,  route('app',    route('sub'),    route('otherSub')  ))

更多模块具体细节可以点击查看。

Reapp提供了两个示例应用,并将代码托管至Github上。

  • Kitchen Sink


  • Hacker News Reader


传送门:Reapp官网、Github托管地址

(文/刘璐璐 责编/唐小引)

Web应用在IE11里的实际使用性能 回顾2013年十个值得关注的WordPress设计主题 为什么Google眼镜注定会失败? 2013移动开发工具盘点:最火原型设计工具 2013年12月份浏览器份额:IE 11暴涨3倍 【PPT集萃】十位一线专家分享Spark现状与未来(二) 2014年,怎么做产品才能获得成功? 年末新游盘点:2014年移动游戏四大趋势 IDC:全球有1850万程序猿 4成爱好者在写代码 PHP开发框架流行度排名:Laravel居首 2013年度最强AngularJS资源合集 研发周报:回顾2013、技术栈的选择、开源成趋势 TIOBE 2014年1月编程语言排行榜:Transact-SQL力挫Objective-C 夺得桂冠 IBM:这五个智能技术的发展,将会改变我们生活 一周消息树: 微软的2013,Surface的2014 Amazon CTO Werner Vogels:云和SaaS正在快速风靡全球 “人类先知”Isaac Asimov 50年前的科技预测大多应验了 2014年10大Web设计趋势 Google野心:App Indexing改写应用搜索格局 Cocos2d-x,老牌引擎的新进化 Kingdom Rush创始人专访:游戏与电影元素混搭 超实用的JavaScript技巧及最佳实践(下) 盖茨和鲍尔默或成挑选微软新CEO的最大阻碍 移动开发进阶:触发式邮件深入分析 King.com传奇再续!Farm Heroes Saga强势登陆iOS、Android 2013综述稿:Clojure这一年及大事件 亚马逊AWS vs.谷歌GCE,彪的是价格? 2014,混合云被广泛采用的一年 传微软拉拢厂商推双启动系统手机 用户可选Windows Phone或Android 为什么游戏领域总是“抄抄抄”! 物竞天择、百家争鸣——评OpenStack生态圈 想让JLabel显示的字是从上到下的。该怎么办? 关于相同记录不能存在的问题 ?消息响应问题 好难的问题!!! 菜鸟有道数组问题请教!!!!!!help,help 关于CStringArray的使用问题???? !!!请问如何通过VB控制来将word文档中的1个图片替换为另1个图片!!!!! 好东东 !!!请问如何通过VB控制来将word文档中的1个图片替换为另1个图片!!!!! 请教高手,给高分!!!!!! 难呀,很多高手都说难!!!! 屏蔽右键??如何做。。。。。 有简单的访问StoredProcedure的方法吗? 简单问题:redhat linux7.2 支持中文输入吗? 谁有ASP上载组件的源代码下载 !!!请问如何通过VB控制来将word文档中的1个图片替换为另1个图片!!!!! Label控件拖放时,拖放结束(放开鼠标)触发哪个事件?急... 技术问题中的非技术问题》》》》》 请大侠看看这个怎么实现比较好!读取文件的一部分。。。 如何把c++builder开发的程序移植到 windows ce环境下???共有6870分送!!! 如何显示JPG文件? 再问审批流程中的多角色定义 屏蔽IE工具栏等的高难度问题?????路过的高手都都看看吧;-) 急问:在VC中怎样些中断服务程序? 关于时间字段的问题 怎样用ATL制作一个Dialog容器,里面可以放置别的窗口 请问VC中为什么需要动态创建(与序列化有关的)?求通俗的解释或举例说明。谢。 紧急求助!! 请问那里有tc++ 3.0的下载?小弟先行谢过啦! 怎样从句柄得到对象,附有具体代码? 关于CStringArray的使用问题???? 我的程序错了么?? 我的程序错了么? DHCP问题 关于IIS的使用 XML中华网(www.xmlchina.net)诚邀您的加盟,让我们共同讨论.NET!! 请问:DCOM连接成功,但是不执行客户微服务器代码是什么原因? 建议有CMM实施经验的同仁定期召开一个讨论会,交流一些方法和思想。 请问在哪儿可以下载c++编译期(在UNIX环境下运行) 听说新出的JB6是4张盘,是吗?都是什么内容?大家讨论一下好吗? 一个菜鸟的问题,请问 rs_user.open sql,conn,3,2 中的3,2 是什么意思 test 如何显示AUTOCAD 生成的DWG矢量文件?(来者有分) 我送分来了 名词解释........ 一个菜鸟的问题,请问 rs_user.open sql,conn,3,2 中的3,2 是什么意思 c#中的DataGrid问题 请教关于jdk库的文档的问题 机器一启动,IE就跳出来,转到指定的网站,怎么办? 有空来坐坐啊各位大虾们 微狗是什么東西﹐它的原理是什么. 谁知道用vb怎么编出来能读出PCI数据的程序啊。我有高分相送啊 有哪些我国原始农耕时期有代表性的主要文化遗址名称除了河姆渡居民和半坡居民, 现在市面多是醋精勾兑的食醋,本人想自己制作食醋,如何制作? 春秋战国时期,标志生产力水平有巨大进步的是什么?A.都江堰的兴修B.变法的实行C.铁农具和牛耕的使用和推广D.农作物产量的提高 碱性氧化物有哪些 春秋战国时期纵横家的代表人物是谁? 英语翻译Paused by customer翻译成中文是:客户已暂停.翻译成越南语是? 碱性氧化物能和什么反应? 冰乙酸勾兑15度醋精怎么勾兑 碱性氧化物与酸性氧化物的概念及区别无 碱性氧化物都包括哪些种类?碱性氧化物即能与酸反应生成盐和水的氧化物,我知道金属氧化物这一种,还有别的吗? 春秋战国时期百家争鸣的代表性思想及代表人物 碱性氧化物跟酸性氧化物的定义分别是什么 直接食用醋精会怎么样 春秋战国时期的诸子百家都有哪些代表人物 他们的代表思想是什么? 酸性氧化物碱性氧化物的确切定义 碱性氧化物是由什么构成的? 春秋战国时期儒家代表人物头有哪些 白糖晶体什么形状白糖重新结晶后的晶体形状还有味精 食用醋精哪里有卖我去了许多超市及市场,都没有醋精卖,哪个神知道呀,1 氯化钾 跟 硫化钾 肥料有赛区别 苹果树上多了有什么反应 历史概括春秋战国时期士人阶层的变迁并分析变迁的原因 急! 碱性氧化物定义是什么初中学的是溶于水生成相应的碱,就是碱性氧化物 高中学的是与酸反应生成盐和水的,就是碱性氧化物 那个对? 氯化钾适合做什么肥料 春秋战国历史春秋和战国时期都有那些国家?各国家又有怎样的兴衰及更替? 请结合私学的兴起,说说春秋时期,“士”阶层崛起的历史意义. 区分氯化铵,氯化钾,磷酸钙三种化肥说初三学生能听懂的. 酸性氧化物与碱性氧化物分别是怎么定义的? 士阶层崛起源于哪个朝代 翻译中文成越南语麻烦高手翻译这句话啦,谢谢,在线等啦夏天那里很热吧 麻烦帮越南语翻译下、就一个单词.在线等.1兴趣爱好.最好要有调调的.谢谢啦! 春秋战国时期随着政治经济的发展,文化学术领域出现了什么和士阶层崛起和私人讲学之风盛行的心变化 英语翻译tìm kiếm 怎样鉴别稀硫酸、稀盐酸、氢氧化钠溶液、氢氧化钙溶液?具体的实验过程 河姆渡的原始农耕与半坡的原始农耕文化有什么异同? 如何快速制作白糖晶体! 请把越南语翻译成中文chau doc 春秋战国 社会背景快呀 “士”大致相当于当今社会的那一阶层?在春秋战国时期,“士”有哪些职责?请分别说明,好的我会追加分的! 【化学作业】如何制作白糖晶体? 英语翻译她到底是在说什么啊?是不是说分手之类的啊?.niaiuwma.uawaini.hong men ni. 河姆渡的原始农耕文化与半坡的原始农耕文化有什么异同 古代文武官级别 英语翻译这些框上都写的神马,还有右边那个提示的是什么意思, 河姆渡、半坡原始居民的农耕生活有哪些相同和不同之处?大大们 春秋战国时期上下等级之间是如何称呼的例如大臣家中的仆人该如何称呼家中的主母?又如何称呼其子女?有没有朋友知道有关这方面的书籍,请介绍一本. 酸性氧化物 碱性氧化物 两性氧化物包括了所有的氧化物这句话是错的还是对的.求大神解答 通过河姆渡原始居民和半坡原始居民的农耕生活情况,简述我国原始农耕文化的主要特征是什么 英语翻译ái chà,cute nhá 什么叫酸性氧化物、碱性氧化物,两性氧化物. 河姆渡和半坡原始居民的农耕和住房为什么会有较大的差别 明朝武官官名及级别 列举我国原始农耕文化南方和北方代表各一例,并找出它们有哪些主要的不同点 醋精与食用醋有什么区别? 英语翻译“水果店”这个词怎么写?能不能用越南语写出来啊 中国南、北方原是农耕文化的典型代表分别是什么 比较氧化钙、氯化钙、氯化钾熔沸点高低为什么? 春秋战国时期为什么社会等级分类减少?个人认为社会大变革期,像是地主阶级产生,等级分类不是应该增多吗 填空:北方原始农耕文化的代表是-----流域 的-----遗址 ,他们居住的是-----式房屋 醋精是勾兑醋的主要成分吗,醋精是什么原料? 英语翻译
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘