React Native入门——IDE及其他相关基础技术

关于React Native的开发，其中一个问题是缺少好用的IDE，有些人说不就是JS么，搞一个记事本也就写了，那样虽然牛逼，但其实还是很头大的，有一款好的IDE还是能提升开发效率的，这里对几个还算能用的IDE进行比较，大家可以选择自己喜欢的IDE用于RN应用的开发。

1.Facebook推荐IDE——基于Atom的nuclide

nuclide是Facebook在开源React Native框架时同时开源的所谓官网的IDE，实际上是基于Github发布的开源编辑器Atom开发的React开发插件，基本界面如下：

个人感觉Sublime、VS Code还有这个最近被炒的火热的Atom，界面都很像，而且基本都是靠插件插出来的，而Atom其实就是用Node.js和WebKit搞出来的基于浏览器的桌面应用，Atom安装后还会附带安装apm（类似npm的包管理器）。

atom的安装可以直接在：https://github.com/atom/atom/releases/latest选择适合自己系统的安装包下载安装，比较简单。

nuclide可以在：https://github.com/facebook/nuclide根据官方的Readme进行安装，比较慢，耐心等。

或者可以在atom安装完成之后，使用atom自带的apm进行安装，如：apm install nuclide

atom的优势在于轻量和Facebook的支持，以及各种各样Sublime没有的插件，由于有Facebook的支持，对React.js和React Native的支持比较好，无论是格式化还是高亮标记、代码提示，在完整安装nuclide及一些辅助插件后，都是比较友好的，喜欢这一风格的程序猿可以试试这款比较新的编辑器，但一个很严重的问题是，Atom基于浏览器，性能是很严重的问题。

2.永恒的经典——Sublime

做JS的FE必然都知道Sublime，这款已经有一定历史的编辑器经过一系列的插件改装，一样可以对React Native支持良好，加上Sublime众多的快捷键、命令支持，可以使开发效率大幅度提升。

代码提示功能：

性能和Atom比当然是没的说，推荐安装几个插件：JSX、React Teamplate、react-native-snippets、ReactJS Snippets、SublimeLinter-jsxhint、Babel、Babel Snippets、Emmet、React ES6-Snippets，这几个插件可以支持React的JSX语法，并进行高亮提示，同时也可进行排版，效果和装了nuclide的Atom不相上下，是非常给力一款编辑器了。

插件安装方法，Package Control -> Install Package，输入react，选中并安装

提示：需要科学上网

3.全能型选手——WebStorm 11

有人说Intelij系列IDE很重，很慢，界面还丑，其实还得看需求，我就挺喜欢。Android Studio、IDEA、WebStorm都是一样的键位和界面布局，学习成本很低，使用很顺手，而且WebStorm自带的插件也比较好用，提示非常智能，不用安装什么插件就能上手开发了，对于React Native开发不好的一点就是JS的格式化比较奇怪，和Sublime、nuclide都不一样，下图是WebStorm：

下面是nuclide、Sublime：

如果熟悉WebStorm和Intelij系列IDE的程序猿，选择WebStorm进行React Native开发也是不错的选择。

4.其他建议学习的技术

1.HTML+CSS3或Android的XML布局、WPF的XAML

由于React Native采用JSX的形式进行界面的设计，这种方式类似于HTML，但又比其更严格，所以有Android和WPF开发经验的程序猿，可能更容易将XML和XAML的思想引入JSX中，而且React Native的布局样式，类似CSS3，有很多从CSS3中发展而来的字段和属性，所以建议学习一下CSS3。

2.React.js

毕竟React Native是从React.js发展而来的，只是一个是面向Web一个面向客户端，学习React.js有助于了解这种开发思想的核心，尤其是组件生命周期，

getDefaultProps、getInitialState、componentWillMount、render、componentDidMount这几个过程非常重要，除此之外，事件处理、数据绑定等功能也是几乎一模一样，参考React.js的原理和流程，非常有助于理解React Native。

3.Node.js、ES6

React Native的代码结构来源于Node.js，其中require、exports的思想也是非常经典的，再说了，现在Node.js这么火，Win10 IoT都兼容了，你还有什么理由不学Node.js？

而React Native用了很多基于ES6的思想来构建API，比如fetch，所以，学习一下新发布的ES6，不光是React Native，对其他JS开发也是必须的。

4.Android、iOS的JavaScript Bridge技术

React Native内部实现了一套自己的JS通信技术，能够提供高效的通信，从而实现APP的动态改变、高效展示，所以，有必要了解React Native的底层通信技术，以便后期对APP进行优化

转载请注明出处： http://blog.csdn.net/yuanguozhengjust/article/details/50468561