React Native新手入门
前言
React Native是最近非常火的一个话题,想要学习如何使用它,首先就要知道它是什么。
好像面对一个新手全面介绍它的文章还不多,我就归纳一下所有的资料和刚入门的小伙伴一起来认识它~
将从以下几个方面来介绍它:
1、React Native的定义
2、React Native的优缺点
2、学习React Native需要掌握的知识
React Native的定义
一句话就是:一款专门用于App的JS框架。
React Native 结合了 Web App和 Native App的优势,使用 JavaScript 和 React 来开发 iOS 和 Android 原生应用即Mobile App。
注意:
使用React Native最后编译的还是一个原生应用。
这就是为什么 React Native 自称:
Learn once,Write anywhere!
React Native 希望前端开发者学习完 React 后,能够用同样的语法、工具等,分别开发安卓和 iOS 平台的应用并且不用一行原生代码。 总结:
React Nativ是利用脚本语言进行原生平台开发的一次成功尝试,降低了前端开发者入门移动端的门槛,一定业务场景下具有独特的优势,但是几乎不可能取代原生平台开发。 补充:
这里涉及到APP的开发模式,一共有三种,分别是Web App、Hybird App和 Native App。
具体的概念不细说了,简单的做一下对比,大家就会有简单的概念。
React Native的优缺点
优点
- 复用了 React 的思想,有利于前端开发者涉足移动端。
- 能够利用 JavaScript 动态更新的特性,快速迭代。
- 相比于原生平台,开发速度更快,相比于 Hybrid 框架,性能更好。
- 不用Webview,彻底摆脱了Webview让人不爽的交互和性能问题
- 有较强的扩展性,这是因为Native端提供的是基本控件,JS可以自由组合使用
- 可以直接使用Native原生的「牛逼」动画。
缺点
做不到
Write once, Run everywhere
,也就是说开发者依然需要为 iOS 和 Android 平台提供两套不同的代码,比如参考官方文档可以发现不少组件和API都区分了 Android 和 iOS 版本。即使是共用组件,也会有平台独享的函数。不能做到完全屏蔽 iOS 端或 Android 的细节,前端开发者必须对原生平台有所了解,加重了学习成本。而对于移动端开发者来说,完全不具备用 React Native 开发的能力。
由于 Objective-C 与 JavaScript 之间切换存在固定的时间开销,所以性能必定不及原生。
- 安卓环境运行卡,坑多。
学习React Native需要掌握的知识
1、es6的知识。知道JS新语法,不然看到=>()和.then等等,你会一脸懵逼。ES6也称ES2015,是JavaScipt语言的较新的一种标准,在React Native开发时,使用这种标准。
推荐网站:
2、因为React Native可以看作是 React.js 在移动上的应用,所以还需要掌握react,有助于你加深理解。
推荐网站:
React Native新手入门的更多相关文章
- React Native小白入门学习路径——二
万万没想到,RN组仅剩的一个学长也走了,刚进实验室没几天就被告知这样的事情,一下子还真的有点接受不了,现在RN组就成了为一个没有前辈带的组了,以后学习就更得靠自己了吧.唉,看来得再努力一点了. 这一周 ...
- React Native 从入门到原理一
React Native 从入门到原理一 React Native 是最近非常火的一个话题,介绍如何利用 React Native 进行开发的文章和书籍多如牛毛,但面向入门水平并介绍它工作原理的文章却 ...
- React Native基础&入门教程:初步使用Flexbox布局
在上篇中,笔者分享了部分安装并调试React Native应用过程里的一点经验,如果还没有看过的同学请点击<React Native基础&入门教程:调试React Native应用的一小 ...
- React Native小白入门学习路径——五
React Native小白入门学习路径--五 序 "哦天呐!" 这句话成了我在实验室的口头禅, 老师可能觉得我们都是大神吧,都还在看着基础就给布置了那么多任务:写一个RN的TDD ...
- React Native 从入门到原理
React Native 是最近非常火的一个话题,介绍如何利用 React Native 进行开发的文章和书籍多如牛毛,但面向入门水平并介绍它工作原理的文章却寥寥无几. 本文分为两个部分:上半部分用通 ...
- React Native开发入门
目录: 一.前言 二.什么是React Native 三.开发环境搭建 四.预备知识 五.最简单的React Native小程序 六.总结 七.参考资料 一.前言 虽然只是简单的了解了一下Reac ...
- React Native (一) 入门实践
上周末开始接触react native,版本为0.37,边学边看写了个demo,语法使用es6/7和jsx.准备分享一下这个过程.之前没有native开发和react的使用经验,不对之处烦请指出.笔者 ...
- React Native基础&入门教程:调试React Native应用的一小步
React Native(以下简称RN)为传统前端开发者打开了一扇新的大门.其中,使用浏览器的调试工具去Debug移动端的代码,无疑是最吸引开发人员的特性之一. 试想一下,当你在手机屏幕按下一个按钮, ...
- React Native小白入门学习路径——三
迷茫,真的迷茫. 或许是自己努力的还不够吧,在学习的过程中遇到了很多问题,自己尝试借助搜索引擎解决问题,无奈国内的教程写的还很基础,涉及到稍微具体一点的问题时讲解就比较少更新也比较慢,绝大多数还是很早 ...
随机推荐
- php将两张身份证图片合并到一张图
/** * @desc 合并身份证的正反面到同一张图片 * @author Jimmy * @date 2016-12-33 * @param $imageSrc0 身份证正面 * @param $i ...
- 深踩 AndroidStudio 缓存的坑
本文记录的是今天在群里提到的昨天所踩的一个坑,有关 AndroidStudio 缓存的. 先说一下背景. 我负责的一个项目,对一个图表库有外部依赖.这个图表库是我在维护的,由于新功能在开发中,所以我就 ...
- 51nod 1206 Picture 矩形周长求并 | 线段树 扫描线
51nod 1206 Picture 矩形周长求并 | 线段树 扫描线 #include <cstdio> #include <cmath> #include <cstr ...
- USACO Section 2.1 Ordered Fractions 解题报告
题目 题目描述 给定一个数N(1<=N<=160),需要产生所有的分数,这些分数的值必须要在0~1之间.而且每个分数的分母不能超过N.如下例所示: N = 5 产生所有的分数:0/1 1/ ...
- 【BZOJ1801】【Ahoi2009】chess 中国象棋
Time Limit: 10 Sec Memory Limit: 64 MB Description 在N行M列的棋盘上,放若干个炮可以是0个,使得没有任何一个炮可以攻击另一个炮. 请问有多少种放置方 ...
- CF 997E 解题报告
CF997E Good Subsegments 给你一个长度为\(n\)的排列 \(P\),定义一段子区间是好的,当且仅当这个子区间内的值构成了连续的一段.例如对于排列\(\{1,3,2\}\),\( ...
- 洛谷 P4292 [WC2010]重建计划 解题报告
P4292 [WC2010]重建计划 题目描述 \(X\)国遭受了地震的重创, 导致全国的交通近乎瘫痪,重建家园的计划迫在眉睫.\(X\)国由\(N\)个城市组成, 重建小组提出,仅需建立\(N-1\ ...
- 开源入侵检测系统SELKS系统搭建
一.系统环境配置 系统环境:centos7x64 ip地址:172.16.91.130 1.设置静态IP地址 [root@localhost backlion]#vi /etc/sys ...
- Java EE之JSP
1.使用JSP的原因 编写Servlet代码的时候,向响应中输出HTML文档是非常不方便的. PrintWriter writer = response.getWriter(); writer.app ...
- BZOJ 1010 [HNOI2008]toy 玩具装箱
2017.6.9:经过我的不懈努力,终于把此题A掉了,但上凸和下凸总是那么让人费解…… P教授要去看奥运,但是他舍不下他的玩具,于是他决定把所有的玩具运到北京.他使用自己的压缩器进行压缩,其可以将任意 ...