React-Native 从入门到放弃

type

Post

status

Published

date

Jan 2, 2017

slug

summary

昨晚熬夜看了 ReactConf

一、前言

昨晚熬夜看了 ReactConf，今天还有点小激动，

不论是之前早有预告的 Fiber，还是千呼万唤使出来的 React VR，都让正在 React 技术栈中摸爬滚打的人们又平添了几分”优越感“。虽然 Vue 今年在中国很火，但纵观国际，引领前端技术潮流的还是我 Facebook Dady 啊。最能说明问题的当属在去年大热的美剧《西部世界》中的一个梗：

昨天 Facebook 也正式发布 React VR，我说不清楚这意味着什么，毕竟早有许多通过 WebGL 做的 VR，但是 React VR 是否可以推动 WebGL 进一步发展，继而再一次印证“万物基于 JavaScript” ，这倒未可知。我昨天看了下 React VR 的 tutorial，写法和 React-Native 很像，一下理解了该怎么用，忽然想起自己入坑 React 也大半年了，于是打算写一篇 React-Native 的入门(keng)教程。这不是一篇 tutorial，当然也不够 Best Practice，纯粹技术交流～本文章结构：

一、前言

二、React-Native Mac 下环境搭建与填坑

三、React 技术栈

四、React-Native 布局

伍、JS 解决不了的原生模块问题

二、React-Native Mac 下环境搭建与填坑

食用本教程请确保您已经阅读http://reactnative.cn/docs/0.42/getting-started.html 其实官网的环境搭建教程已经非常清楚，这里只是自己遇到的坑：

1.run-android 时：

你创建工程 gradle-2.4-all 包下载不完全或者没有下载所致。进行如下工作后再次 run-android:

还是不行，猜测是因为我上网的姿势不够科学，我才用科学的上网姿势后果然可以了，GTMDGFW!科学上网后如下:

三、React 技术栈

React 技术栈是由 React、React-Native、Redux、React-Router 等构成的技术栈。其中 React 和 React-Native 是两个不同的项目，但是它们的核心思想是相似的。React-Native 使开发者可以使用 JavaScript 和 React 的语法来构建 iOS 和 Android 原生应用程序。开发者可以直接在 React 中使用组件来构建 iOS 和 Android 应用，同时也可以使用原生的组件来构建复杂的 UI 界面。