安装相关工具参考(视频):http://ninghao.net/course/3001?a=26

学习参考:http://reactnative.cn/

学习参考:http://www.ruanyifeng.com/blog/2015/03/react.html
 

今天是让我非常兴奋的一天,发现了一个非常好的一些网站

最近非常流行一个叫React Native。“Learn once, write anywhere(Android,IOS,WEB)”

React Native项目成员Tom Occhino发表的React Native: Bringing modern web techniques to mobile详细描述了React Native的设计理念。

可以通过不同的渲染引擎生成不同平台下的UI,JS和Native之间通过Bridge通信。

其实这东西从Native开发来说,相当于重新发明了一个浏览器渲染引擎并且套一个React的壳,从Web开发角度来说,就是把原来React的后端换成了Native code来实现,就跟Flipboard最近搞的React Canvas 一样

 

为什么需要 React Native?

  What we really want is the user experience of the native mobile platforms, combined with the developer experience we have when building with React on the web.

  Native能实现更丰富细腻的动画效果,归根结底是现阶段Native具有更好的人机交互体验。
 

根据ProgVille的文章,React Native的原理是,在JavaScript中用React抽象操作系统原生的UI组件,代替DOM元素来渲染,比如以<View>取代<div>,以<Image>替代<img>等。

在幕后,React Native在主线程之外,在另一个背景线程里运行JavaScript引擎,两个线程之间通过一批量化的async消息协议来通信(有一个专门的React插件)。

UI方面React Native提供跨平台的类似Flexbox的布局系统,还支持CSS子集。可以用JSX或者普通JavaScript语言,还有CoffeeScript和TypeScript来开发。有评论说,React的UI层模型要比UIKit好很多。

注意:无需编译,我在第一次编译了ipa装好以后,就再也不用更新app,只要更新云端的js代码,reload一下,整个界面就全变了。对于前端开发是非常好的体验。
React 很有可能成为一个跨平台的统一 UI 解决方案,可以理解为 UI 开发的虚拟机?没有学习的同学赶紧抓紧了解一下吧。
 
 

React Native相关的更多相关文章

  1. React (native) 相关知识

    container component provider组件 react里的redux进阶玩法 react组件的生命周期 conductor / componentWillMount / render ...

  2. iOS原生项目中集成React Native

    1.本文的前提条件是,电脑上已经安装了CocoaPods,React Native相关环境. 2.使用Xcode新建一个工程.EmbedRNMeituan [图1] 3.使用CocoaPods安装Re ...

  3. 移动端跨平台方案对比:React Native、weex、Flutter

    跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架百花齐放,颇有一股推倒原生开发者的势头. 为什么我们需 ...

  4. 最火移动端跨平台方案盘点:React Native、weex、Flutter

    1.前言 跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架的百花齐放,颇有一股推倒原生开发者的势头. ...

  5. React Native 在 Airbnb 的起起落落

    写在前面 Airbnb 早在 2016 年就上了 React Native 大船,是很具代表性的先驱布道者: In 2016, we took a big bet on React Native. T ...

  6. 记一次 React Native 大版本升级过程——从0.40到0.59

    去年把公司几个react native 相关的项目升级了下,已经过去一段时间了,这里系统整理下之前的整个过程. 背景 之前到公司的时候发现公司用的还是0.40的版本,据了解,当时项目做的比较早,导航用 ...

  7. Windows版本搭建安装React Native环境配置及相关问题

    此文档整理参考地址: http://www.lcode.org/%E5%8F%B2%E4%B8%8A%E6%9C%80%E8%AF%A6%E7%BB%86windows%E7%89%88%E6%9C% ...

  8. React native 之设置IOS的图标,名称和启动图(下篇文章会讲到RN的android的相关设置)

    1.首先,app的名称: 如图所示:我的工程名叫BOOk 在BOOk下面的info.plist的文件里设置app的相关信息:比如Bundle name就是设置APP的名称 2.App的图标:(这里注意 ...

  9. window环境下搭建react native及相关插件

    可以先浏览一下中文翻译的开发文档具体了解一下关于React Native,想要查看官方文档可以点http://facebook.github.io/react-native/docs/getting- ...

随机推荐

  1. 计数排序(Count Sort )与插入排序(Insert Sort)

    计数排序法:计数数组适用于当前数组密集的情况.例如(2,3,5,4,2,3,3,2,5,4) 方法:先找出最大值最小值,之后统计每个数出现的次数,根据次数从小到大往数组里添加 计数排序法是一种不需要比 ...

  2. 学习练习 java 不重复的三位偶数

    编写一个Java程序,计算一下1,2,…,9这9个数字可以组成多少个互不相同的.无重复数字的三位偶数. package com.hanqi; //编写一个Java程序,计算一下1,2,…,9 //这9 ...

  3. UTC格式转换 & 十六进制换算为十进制

    UTC格式转换成北京时间格式: /// <summary> /// UTC格式与datatime的转换 /// </summary> /// <param name=&q ...

  4. a different object with the same identifier value was already associat

    问题:这个著名的托管态update更新异常 org.hibernate.NonUniqueObjectException: a different object with the same ident ...

  5. 【MySQL】MySQL无基础学习和入门之二:MySQL的安装

    安装MySQL安装一般分为源码包编译安装.分发包.rpm包安装和yum安装,四种安装方式有一些区别,对应的适用场景也不一样. 源码包:源码包就是程序源代码包,其中包含程序代码文件,这些代码文件是文本型 ...

  6. angular service讲解

    controller是相对独立的,也就是说,两个controller之间,内存是不共享的,这个controller是无法访问其他其他controller的属性或者方法的; 以前,我都是通过localS ...

  7. Android IOS WebRTC 音视频开发总结(五三)-- 国内IM & RTC SDK列表

    本文主要总结国内提供RTC SDK的产品,转载必须说明出处,文章来自博客园RTC.Blacker,欢迎关注微信公众号blacker,更多详见www.rtc.help 自从开通邮件和微信公众号以来,很多 ...

  8. javaSE第十六天

    第十六天    140 1:List的子类(掌握)    140 (1)List的子类特点    140 (2)ArrayList    141 A:没有特有功能需要学习    141 B:案例    ...

  9. 基于s5pv210嵌入式linux系统sqlite3数据库移植

    基于s5pv210嵌入式linux系统sqlite3数据库移植 1.下载源码 http://www.sqlite.org/download.html 最新源码为3080100 2.解压 tar xvf ...

  10. Linux 常用ps命令

    (1)查看系统所有进程: 标准格式:           ps -e           ps -ef           ps -eF           ps -ely   BSD格式:     ...