ReactNative入坑: ReactNative入门(一)

初识React Native

React Native (简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架，是Facebook早先开源的UI框架 React 在原生移动应用平台的衍生产物，目前支持iOS和安卓两大平台。RN使用Javascript语言，类似于HTML的JSX，以及CSS来开发移动应用，因此熟悉Web前端开发的技术人员只需很少的学习就可以进入移动应用开发领域。(百度百科)

作为一个iOS开发人员的一些小看法：

1. React Native的学习还是有点麻烦的，需要先学习JS、Html、ES6语法，然后可以接触React Native的开发了
   React Native的学习还是有点麻烦的，需要先学习JS、Html、ES6语法、React 然后可以接触React Native的开发了 (当然直接跳过也是可以的，反正最后还会回来查 )
2. 如果使用React Native，作为主力开发可以开发一些动画效果不多，列表展示不多的App。或者当做组件开发一些两端通用的界面
3. JS和原生的交互是异步的，一些交互通信比较麻烦，一些组件联动效果不好实现
4. React Native仍然不完善，文档还不全，虽然Facebook推的力度不大，但是国内对这块需求比较高，对前景看好

工欲善其事，必先利其器

开发环境搭建

RN的版本差异较大，下面的工具做好全部安装最新的，否则新旧版本之间的配合，可能出现始料不及的问题

安装Node

运行brew install node 使用Homebrew来安装Node.js , 安装最新的就好

安装完node后建议设置npm镜像以加速后面的过程（或使用科学上网工具）。注意：不要使用cnpm！cnpm安装的模块路径比较奇怪，packager不能正常识别！
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

Yarn、React Native的命令行工具

Yarn是Facebook提供的替代npm的工具，可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务（packager）等任务。
npm install -g yarn react-native-cli

安装完yarn后同理也要设置镜像源：
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

开发ReactNative自然需要编辑器

1. Sublime Text 3

初始的练习，推荐Sublime Text 3，多敲下代码，练练手
首先在Sublime Text 安装 Package Control 然后在Package Control 搜索安装插件
建议安装的插件:
Babel：提供JSX的ES6语法格式和提示
Emmet：提供CSS和HTML的提示
react-native-snippets：提供RN的代码片段

2. WebStorm

实际开发的时候可以使用WebStorm 代码编写运行都非常方便， 调试嘛，不如atom方便 WebStorm下载
这里有两篇blog，讲如何设置WebStorm 便于开发ReactNative
Developing mobile apps with React Native in WebStorm
Working with ReactJS in WebStorm: Coding Assistance

3. Atom

Atom是Facebook官方推荐的开发工具, 指导文章在这里, Atom可以直接调试RN的代码，打断点Debug，这一点上还是比使用Chrome调试方便了很多
我最近开发的话也是使用的Atom

其他文章

ReactNative入坑: ReactNative入门(一)
ReactNative入坑: iOS原生项目集成ReactNavite(二)
ReactNative入坑: react-navigation库(三)
ReactNative入坑: codepush热更新(四)
ReactNative入坑: 一些常用控件的使用(五)