本系列为 袁林 《React Native移动开发实战》2017年版的阅读记录

第一章 为什么要学习 React Native

React Native 与 React.js 的对比

• React.js
  React is a JavaScript library for building user interfaces.
  React 是一个用于前端UI开发的 JavaScript 库.其他类似的前端框架还有 Backbone、Angular、Vue.js. 最显著的区别 Virtual DOM的概念.

• React Native
  通过基于React的JavaScript语法和React设计理念来进行原生应用开发.

React Native的跨平台

• 架构分层
  • js代码层,包含 React Native应用和桥接层
  • 原生代码层,包含 原生平台APIs, 原生平台UI组件、自定义原生组件
• 跨平台
  • 使用不同的原生代码层就能实现一套ui层多个平台的复用,当然这是理想状态

React Native的特点

• Learn once, write anywhere
• 简单易学的开发语言
• 接近原生应用的性能和体验
• 完善的生态系统

搭建React Native开发环境

iOS平台

• 安装Node.js 8.3以上
• 安装 React Native CLI

npm install -g react-native-cli

• Xcode

• Command Line Tools

  
  image.png

• 其他辅助工具

  • Nuclide 开发工具
    一款基于 Atom 编辑器的扩展,不过 Facebook 已经停止维护了.
  • Chrome浏览器
    调试UI用
  • Watchman
    监视文件系统变更的工具,实现开发时的实时刷新

brew install watchman 

第一个 React Native 应用

react-native init AwesomeProject
cd AwesomeProject
react-native run-ios

• 技巧
  查看可用的 iOS 设备

xcrun simctl list devices

image.png

指定设备运行

react-native run-ios --simulator "iPhone Xs Max"

image.png