生态:React Native
生态:React Native
第一类:React Native 快速入门
-
React Native Tutorial for Beginners - Build a React Native App (2020)
尽管资料已有两年,但大部分内容至今仍然适用。视频形式适合新手,能带着一步步操作学习。 -
React Native Express
适合想快速了解 React Native 中各种概念的新手。 -
The Complete React Native + Hooks Course
这是优达学院最受欢迎的 React Native 视频课程,内容详细且完整,适合新手。
第二类:学习 JavaScript
-
MDN JavaScript 教程
MDN 是前端同学必备的网站,内容权威,适合有编程基础的人快速掌握 JavaScript。 -
ES6 入门教程
ES6 对 JavaScript 的发展有划时代意义,本书可以作为入门学习或手册查询使用。 -
Learn JavaScript
结合思维导图边学边练,涵盖 JavaScript 的 13 个主要部分,适合边学习边实践。
第三类:学习 TypeScript
如果你要写业务项目,我推荐使用 TypeScript 而非 JavaScript。TypeScript 的静态类型检查功能可以减少 Bug 并提高可维护性。
-
了不起的 TypeScript 入门教程
这是掘金最受欢迎的 TypeScript 入门课程,分为十四个知识点带你一步步学习。 -
Type Challenges
结合 TypeScript 官网在线编辑器练习,帮助掌握 TypeScript 的使用。 -
React + TypeScript Cheatsheets
帮助你掌握 React 和 TypeScript 的最佳实践。
第四类:学习 React
对于 React 的学习,我推荐 React 官方教程和文档。
-
React 官方教程
包含初学者到深入学习的内容,配有示例和练习材料,适合不同层次的学习者。 -
API Reference
这是 React 的 API 手册,但目前仅完成了 5%。需要查询 API 时,可以访问 React 老官网。
项目工程
第一部分:脚手架
React Native 项目可以选择以下脚手架:
-
react-native init
React Native 官方提供的基础脚手架。 -
Expo
集成了原生工具和能力,支持 Android、iOS 和 Web,适用于出海应用。 -
Ignite
由美国团队开发,包含包管理、状态管理、自动化测试等技术选型。
第二部分:包管理
常见的包管理工具:
-
Yarn
Meta 团队开发的包管理工具,安装速度和功能强大,推荐使用经典版。 -
npm
Node.js 自带的包管理工具,搭建 React Native 环境时自动安装。 -
pnpm
更快的包管理工具,适用于需要快速安装的场景。
第三部分:状态管理
常见的状态管理工具:
-
React 自带:
useState
useReducer
useContext
-
第三方库:
- Redux + Redux Toolkit
- Mobx
- Zustand
-
Hooks 工具:
react-query
SWR
react-hook-form
formik
-
GraphQL:
提供比 RESTful 更灵活的请求后端接口的方案。
第四部分:自动化测试
常见的自动化测试工具:
-
Jest
Meta 团队开发的 JavaScript 单元测试框架。 -
react-native-testing-library
专门用来测试 React Native 组件。 -
Detox
用于在真机/模拟器上运行测试代码,适合真实环境测试。
样式和组件
样式
-
React Native 自带的 StyleSheet
适合大多数样式需求,简洁高效。 -
Styled-Components
适合喜欢 CSS 语法的开发者。 -
Tailwind CSS
简拼 CSS,减少键盘敲击次数,但性能有所损耗。
组件库
-
Native Base
近两年最活跃的 React Native 组件库,功能强大。 -
React Native Elements
常用的组件库,风格简洁。 -
React Native Paper
Material Design 风格的组件库。 -
UI Kitten
另一种流行的组件库。
路由
-
React Navigation
React Native 最主流的路由库。 -
React Native Navigation
另一个路由库,但下载量远不如 React Navigation。
手势
- react-native-gesture-handler
社区开发的声明式手势处理库,替代了 React Native 自带的 PanResponder。
动画
-
Animated API
React Native 提供的基础动画 API,适合轻量级动画。 -
Reanimated
社区提供的高性能动画库,适用于大规模动画。 -
Lottie
适合 UI 设计师提供的静态动画。
国内常用组件
-
react-native-agora
声网官方维护的 React Native 组件库,适用于语音、视频和直播。 -
hms-react-native-plugin
华为为 React Native 提供的 HarmonyOS 插件。 -
jpush-react-native
极光推送的 React Native 插件。 -
react-native-baidu-map
基于百度地图 SDK 封装的 React Native 组件,适用于地图相关功能。
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.kler.cn/a/445153.html 如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!