OSC 第 134 期高手问答 — React 全栈整合开发

局长 发布于 2016/11/21 14:46
阅读 5K+
收藏 31

OSCHINA 本期高手问答(2016 年 11 月 21 日 — 11 月27 日)我们请来了@vikingmute 张轩和@nighca  杨寒星为大家解答关于 React 方面的问题。

张轩,前端开发工程师。曾经在百度、携程就职,目前在苹果公司担任前端开发工程师。拥有丰富的 Web 开发经验,喜欢追寻新技术,在 GitHub 上关注各种有趣的项目,同时致力于前端工程化,并且有大型 SPA 项目的架构及开发经验。他同时是一名业余文学爱好者,在工作之余写一些短篇小说。

杨寒星,前端开发工程师。曾就职于爱奇艺、百度,目前在七牛云负责前端开发与架构设计。对编写优美的代码、构建影响深远的系统感兴趣;专注于现代前端工程化方案搭建及大规模 SPA 的架构设计,对基于 React 体系的前端开发有着丰富的实践经验。

对一个前端工程师来说,这是最坏的时代,也是最好的时代。

在这样的领域里,每一年都不会风平浪静。如果说 2014 年是属于 MVVM,属于 Angular 的,那么 2015 年称为 React 元年并不为过。开发团队的不断完善以及 React 社区井喷式的发展让这个诞生于 2013 年的框架及其生态趋于成熟(就在不久前,React 官方宣布将在版本号 0.14.7 后直接使用版本号 15.0.0),大量团队在生产环境中的实践经验也让引入 React 不再是一件需要瞻前顾后反复调研的事情,如果 React 适合你,那么现在就可以放心地使用了。

可是对于很多还没有深入实践过 React 开发的工程师来说,React 到底做了什么?React 适合什么样的场景?又应该如何投入使用?在具体业务逻辑的实现上,怎样才是最佳的实践?这些都是需要去了解与思考的问题。我们不妨带着这些问题来进入本期的高手问答,React 全栈整合开发。

为了鼓励踊跃提问,@博文视点会在问答结束后从提问者中抽取 5 名幸运会员赠予

《React 全栈:Redux+Flux+webpack+Babel 整合开发》一书。

购买链接:http://item.jd.com/12052766.html

OSChina 高手问答一贯的风格,不欢迎任何与主题无关的讨论和喷子。

下面欢迎大家就 React 方面问题向@vikingmute 张轩@nighca 杨寒星提问,请直接回帖提问。

加载中
5
dingdayu
dingdayu
那,2016是属于vuejs吗?
莫铭
莫铭
必须是vue
百世经纶之傲笑红尘
百世经纶之傲笑红尘
哈,肯定滴
Edik
Edik
必须的
vikingmute
vikingmute
vue.js 是一个非常有特色的框架,随着2.0版本的发布 提出了渐进式框架的想法 同时融合了很多其他框架的特长和优点 比如在2.0版本借鉴了 React 采用了 virtual dom 来进行界面的渲染。React目前拥有庞大的社区支持,非常多非官方的优秀想法在不断产出,前端开发就是在互相学习之间不断发展壮大。
nighca
nighca
哈哈 vue 今年确实很火,不过不难发现,它整体的影响力目前还是不如 React 的,未来风云变幻,这里就不做不负责任的预测啦。
2
web实习虫
web实习虫
react native中不能使用html dom中的window变量以及方法操作dom,那么全栈如何实现仅用一套代码 既满足web又满足native? 感觉像在说笑话,但是我很认真,
hmh
hmh
weex
0
blueskyred2006
blueskyred2006
React开发完整的生态连是咋样的,如何打造完整的一个react全栈工作环境包括测试。
nighca
nighca
React 相关的生态相当繁荣,不存在绝对最好,适合任何场景的全套方案。如何打造一个全栈的开发环境也不是三言两语能说清的,目前比较流行的方案是 react(-native) + redux + redux-saga,测试工具的话 enzyme 很受欢迎,其他方面跟一般的前端项目相似。
0
vikingmute
vikingmute

引用来自“blueskyred2006”的评论

React开发完整的生态连是咋样的,如何打造完整的一个react全栈工作环境包括测试。
在本书中我们采用的是 webpack 作为模块打包工具,Babel 作为JSX+ES6 编译器,ESlint用来检查代码,webpack-dev-server为本地开发环境,对于测试来说:使用的Airbnb 开发的 enzyme 作为 React 的测试工具,可以很容易的完成 components的一些 unit test,而 mocha 和 chai 是通用的测试平台和断言库。 如果想详细了解,那么这本书里面正是你想要的详细内容。
0
nighca
nighca

引用来自“web实习虫”的评论

react native中不能使用html dom中的window变量以及方法操作dom,那么全栈如何实现仅用一套代码 既满足web又满足native? 感觉像在说笑话,但是我很认真,

react 的口号是“learn once, write anywhere”,而不是“write once, run anywhere”,在典型的 web 与 native 通过 react(-native) 复用代码的场景中,往往是复用纯逻辑,如状态管理,这部分的代码。具体的 component,以及与浏览器 / native 环境打交道的部分,是不奢求能完全复用的。

虽然代码复用率不是百分之百的,但是两种开发环境下的开发方式与代码架构等都是相同的,因此熟悉了 React 开发 web 项目的人可以很方便地上手进行基于 React-native 的手机应用开发。这也是 React-native 所带来的重要价值。

0
tsysler
tsysler

刚好最近在做技术选型,看了很多资料,最后选择了vue.js

较为完整的 React.js / Vue.js 的性能比较 Part 1
http://gold.xitu.io/entry/577bacc92e958a00549106dc
较为完整的 React.js / Vue.js 的性能比较 Part 2
http://gold.xitu.io/entry/57691d5d6be3ff006a438e09

阿里宣布开源 Weex,用 Web 方式开发 Native 性能体验应用
https://www.oschina.net/news/72703/weex-web-native

国内有哪些公司在用Vue.js,有什么心得?
https://www.zhihu.com/question/38213423


小翔
小翔
weex感觉起不来
0
随机9380fa
随机9380fa
学什么技术我不感兴趣,我感兴趣的是平时要注意些什么,在职业上怎么做,才能具备楼主的能力和机会。
vikingmute
vikingmute
平时注意积累 保持好奇心 不断学习 不盲目跟风 凡事多问为什么这样做 另外英文能力要适当磨练
nighca
nighca
提高能力的话,大概就是多深入思考,多实践了。怎么获得机会,很难说呢。
0
炒股
炒股
@vikingmute :前端要怎么入门?很多人觉得前端就是切图,把图片变成HTML模板,您怎么看?
vikingmute
vikingmute
现在已经不是切图时代了 入门建议直接在网上找到正确合适的资源学习 我本人比较反对中国的各种前端培训学校 个人推荐https://www.codecademy.com/
ouven
ouven
https://github.com/ouvens/frontend-system-map 现代前端大概要学习了解这些玩意儿
0
ZhouLS
ZhouLS
@vikingmute :入门React需要哪些基础知识?
vikingmute
vikingmute
需要基础的 Javascript, HTML, CSS的知识,我本人比较反对中国的各种前端培训学校 个人推荐https://www.codecademy.com/
0
jamesmine
jamesmine

@vikingmute :redux是否要求组件完全没state。感觉没有state的话底层控件复用性实在太差

返回顶部
顶部