React Native学习资源汇总

时间  2020-08-02
标签 react native 学习 资源 汇总 栏目 React 繁體版
原文   原文链接

目前主流的移动跨平台技术方案大致能够分为三类，一类是使用原生内置浏览器加载HTML5的Hybrid技术方案，采用此种方案的主要有Cordova、Ionic和微信小程序；另外一类是使用JavaScript语言进行开发，而后使用原生组件进行渲染，采用此方案的主要有React Native、Weex和快应用；最后一类是使用自带的渲染引擎和自带的原生组件来实现跨平台，采用此种方案的主要是Flutter。css

对于其余的浏览器方案，基本能够抛弃了，如今咱们讨论移动跨平台开发主要说的是React Native和Flutter，React Native和Flutter在应用开发上，效率差很少，不过要强调性能的话，仍是Flutter为最佳选择。因为如今你们都开始使用Flutter来开发应用，致使React Native的学习资料愈来愈少。
在这里插入图片描述
做为跨平台的忠实粉丝，我在去年的下半年对《React Native移动开发实战》进行了升级，出版了《React Native移动开发实战》的第二版，书中对以前的知识作了从新的梳理，使之更加贴近项目实战，有须要的能够去京东，天猫支持下。html

做为目前比较流行的移动跨平台开发方案之一，React Native仍然还有不少的粉丝，特别是熟悉前端React开发的技术人员，国内大厂都在使用哪些移动跨平台框架罗列了目前在使用跨平台技术进行应用开发的一些厂商。前端

React Native 学习资源精选

目录

<!-- TOC -->node

<!-- /TOC -->git

资源网站

ES6&ES7

React.js

React.js相关教程

React Native

教程

布局相关

开发调试

发布部署

系列教程

项目实践&教程

开源APP

它山之石能够攻玉。

框架

React-Native开发的库/ SDK类型。
  • NativeBase：一款融合了ES6用于在React Native上建立建立高质量的Android&iOS APP的框架。
  • tcomb-form-native：强大的表单处理控件，支持 JSON 模式，可插拔的外观和感受。
  • BlankApp UI：React Native的高度可定制和主题组件。
  • Shoutem UI：一个完整React Native的UI工具包。
  • React Native Elements：React Native UI元素和组件的集合。
  • Panza：收集无状态，功能性，跨平台的ui组件，用于React Native。

库

  • react-native-launch-image：用在React Native上手动关闭iOS启动界面（Launch Screen）的工具。详细说明
  • RNShareSDK：一款基于原平生台ShareSDK的ReactNative插件,方便RN开发者集成各大社交平台的分享和受权功能。
  • react-native-social-kit：对第三方社交帐号SDK的封装，使开发者能在React Native App里使用受权、分享等功能。
  • react-native-agora: 基于声网音视频SDK封装的React Native模块，方便RN开发者能够轻松集成WebRTC功能，实现电话会议，视频会议，直播等功能。

组件

UI

Navigation

ViewPager

ListView&ScrollView

Text&Rich Content

弹框

  • react-native-easy-toast：一款用于React Native上消息提示弹框组件，使用方便，支持定义Toast，支持iOS,Android。
  • react-native-modal：模态框，做者已经将该组件添加到React Native，因此开发者能够直接使用Modal;
  • react-native-popover：一款相似Android popupwindow的弹出框组件。

音视频相机

图形动画

数据存储

Web相关

系统相关

Material Design

工具包

TabLayout

工具

IDE

  • Nuclide：Nuclide 是 Facebook 推出的一套基于 Atom 的开发工具集。用于开发基于 Hack 的 Web 应用。提供自动完成和 JavaScript 类型检查，内建 React 开发支持，并支持 Facebook 最新的 React Native 库，支持 Facebook 的 Flow JavaScript 类型检查器。
  • WebStorm：JetBrains公司出品的用于前端开发的IDE，WebStorm有着JetBrains公司IDE的优良血统，是前端工程师的一个开发神器。另外，AndroidStudio也是基于JetBrains的IDE，这对于习惯了AndroidStudio的开发者来讲，WebStorm无疑是一个最佳的选择。

其余

  • CodePush：CodePush 是微软提供的一套用于热更新 React Native 和 Cordova 应用的服务。
  • Redux：用于JavaScript apps上的一款可预见的状态管理框架。
  • MobX：与 Redux 相比，更轻便、自由的状态管理框架。
  • redux-react-native-i18n 具备复数形式的i18n解决方案支持Redux上的React Native应用程序
  • React Sight 用于React的可视化工具，支持Fiber，Router（v4）和Redux Chrome Plug github
  • React Developer Tools 一个扩展程序，容许检查Chrome和Firefox开发人员工具中的React组件层次结构。 Chrome Plug github
  • react-native-rename : Rename react-native app with just one command

视频

新闻&讨论

一次学习，随处可写

一块儿踩坑

<resources>
    <string name="app_name">Your_app_name_to_display</string>
</resources>
android{
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            def outputFile = output.outputFile
            if (outputFile != null && outputFile.name.endsWith('.apk')) {
                File outputDirectory = new File(outputFile.parent);
                def fileName
         // 你的apk打包名称
                if (variant.buildType.name == "release") {
                    fileName =  "app_v${defaultConfig.versionName}_${releaseTime()}_${variant.productFlavors[0].name}.apk"
                } else {
                    fileName = "app_v${defaultConfig.versionName}_${packageTime()}_debug.apk"
                }
                output.outputFile = new File(outputDirectory, fileName)
            }
        }
    }

}
相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程