《ReactNative入坑记录（一）ReactNative介绍及环境搭建》

《ReactNative入坑记录（一）ReactNative介绍及环境搭建》

1.写在前面

先介绍一下笔者目前的情况，大学毕业两年一直从事移动产品的开发，主要做Android和IOS原生开发，Android开发为主，期间掺杂着.net、Jave、php等其他语言的开发。
今年年初入职新公司，一直跟着产品经理进行公司互联网产品的设计工作，为缩短开发周期，技术团队决定采用ReactNative跨平台开发，由于之前没有接触过这项技术，
所以准备了一些资料进行充电。ReactNative入坑之旅，现在开始。

2.ReactNative简介

2015年3月26日，Facbook公司对外正式发布ReactNative——使用React框架跨平台开发原生移动应用的开源技术框架。
开发者可以使用ReactNative高效的开发运行在Android与iOS操作系统的应用程序。
该框架的设计理念是：即拥有Natvie良好的人机交互体验，又保留React框架的开发效率。

3.ReactNative开发特点

（1）Learn once,write anywhere.

在iOS和Android长期的开发实践过程中我们知道，一份代码支持两个系统是非常困难的。而RN可以为两个操作系统开发程序，但是需要根据平台做出一些代码调整。
作为一个有经验的开发人员，这样的调整是可以非常迅速的掌握的。这也就是RN提出Learn once,write anywhere而不是Learn once,run anywhere，而在UI方面RN差不多已经做到了。

（2）混合开发

第一种：UI界面使用RN开发，UI事件处理由原生代码执行。
第二种：将原来使用原生代码实现的UI组件，包装成RN的自定义组件。
第三种：应用界面在RN开的界面与原生代码开发界面间切换

（3）高效的UI开发

①独特的UI实现框架——（后面详细介绍）
②组件化开发——将UI上每一个功能相对独立的模块定义成组件，然后将小的组件通过组合嵌套的方式组成大的组件。
③跨平台代码移植迅速——通常只需要修改总代码量的5%就可以实现跨平台。
④自动匹配不同屏幕大小的手机——Android开发者的福音。

（4）高效的UI调试

告别传统的每次修改都要重新编译构建，等待响应的过程。使用RN开发，在你修改完成后，在代码界面进行保存操作，RN的热更新功能可以让我们直接在真机上查看修改效果。

（5）学习门槛低，开发难度底

RN使用ECMAScript2015进行编程，如果你不知道ECMAScript2015这是什么？你一定听说过JavaScript，而ECMAScript2015作为JS的新的开发规范也就是ES6。
那现在我们知道RN是采用JS进行编程的，JS难吗？这么说吧，笔者之前没有接触过JS，只是精通JAVA，学习JS的语法开发只是一个周末的事情而已（推荐用书《ES6标准入门》）。

（6）使用ReactNative的代价

讲真RN真的如此完美吗？当然不是。
①内存消耗比较原生应用略大
②运行速度比较原生应用略慢
③安装包比较原生代码安装包略大

4.ReactNative开发环境搭建

（1）Windows操作系统下ReactNative开发环境搭建

①安装Node.js（4.0以上的版本）————下载地址www.nodejs.org
②安装git————下载地址http://www.git-scm.com/downloads
③安装nrm————管理员身份运行命令行，输入npm install -g nrm
④安装npm2————管理员身份运行命令行，输入npm install -g npm@2。
⑤安装淘宝镜像（如果网络环境较好，且访问国外网站没有障碍可省略此步）————命令行输入npm install -g cnpm --registry=https://registry.npm.taobao.org。
⑥安装ReactNative————命令行输入npm install -g react-native-cli
至此Windows操作系统下ReactNative开发环境搭建完成

（2）Mac操作系统下ReactNative开发环境搭建

稍后在做介绍。

（3）代码编辑环境搭建

使用SublimeText3进行代码编辑————下载地址 https://www.sublimetext.com/3