BT

如何利用碎片时间提升技术认知与能力? 点击获取答案

这里有25个React Native免费教程,请您查收

| 作者 CodeBurst 关注 0 他的粉丝 ,译者 Martin 关注 0 他的粉丝 发布于 2018年3月15日. 估计阅读时间: 13 分钟 | ArchSummit北京2018 共同探讨机器学习、信息安全、微服务治理的关键点

CodeBurst.io为React Native开发者提供了25个教程,不管是刚入门的新手,还是有经验的老手,都能从这些教程中找到适合自己的。

一般性的教程

  1. React Native——究竟有多原生?

由Vishal Dubey提供的教程,对Android和iOS平台的React Native进行了对比。

教程地址:https://codeburst.io/react-native-how-native-have-you-been-9ebb08383474

2. React Native与真实原生App的对比

由Weblab科技提供的教程,对比了React与Swift二者之间的不同点,包括对CPU、GPU和内存的使用方式。

教程地址:https://codeburst.io/react-native-vs-real-native-apps-ad890986f1f

3. 解密React Native开发

由John Tucker提供的教程,作者在比较了三种React Native开发方式之后,认为Expo是最好的。

教程地址:https://codeburst.io/untangling-react-native-development-7285ed0b6525

4. React Native开发奇事

由Martin Adamko提供的教程,在开始React Native开发之前应该知道的那些事。

教程地址:https://codeburst.io/react-native-quirks-2fb1ae0bbf80

5. React Native调试工具

由Vince Yuan提供的教程,介绍了如何调试React Native应用和用于调试的GUI工具。

教程地址:https://codeburst.io/react-native-debugging-tools-3a24e4e40e4

6. 使用React Native、GraphQL和Relay Modern开发App

由Luiz Fernando提供的教程,介绍如何使用GraphQL和Realy Modern搭建React Native开发环境。

教程地址:https://codeburst.io/how-to-setup-a-react-native-graphql-relay-modern-a6a5f6c18353

性能相关的教程

7. 给React Native应用程序提速的六种方式

由Atinder Singh提供的教程,介绍了六种提升React Native应用程序FPS的方法。

教程地址:https://codeburst.io/6-simple-ways-to-speed-up-your-react-native-app-d5b775ab3f16

8. React Native内联样式与样式组件的性能比较

由JM Myers提供的教程,对React Native内联样式与样式组件的性能进行了对比。

教程地址:https://codeburst.io/a-quick-performance-comparison-of-styled-components-vs-inline-styles-in-react-native-e07adffd14cb

9. 通过可视化的方式发现和解决React Native性能问题

由Purvak Pathak提供的教程,他运行了20多个React Native应用程序,通过可视化的方式找出了它们共同存在的性能问题。

教程地址:https://codeburst.io/a-visual-guide-to-react-native-performance-issues-and-resolving-insights-ccb0fc3fbcda

动画相关的教程

10. 在React Native中使用自定义动画开发地图程序

由Jason Brown提供的教程,深入介绍如何在React Native中使用自定义动画开发地图程序。

教程地址:https://codeburst.io/build-a-map-with-custom-animated-markers-and-region-focus-when-content-is-scrolled-in-react-native-efb3522d9445

11. React Native中的水平滚动动画

由Bi Yoo提供的教程,介绍如何在React Native中结合使用动画和ScrollView创建好看的页面切换效果。

教程地址:https://codeburst.io/horizontal-scroll-animations-in-react-native-18dac6e9c720

12. 使用CSS和样式组件让React组件动起来

由Kyle Truong提供的教程,介绍如何结合使用CSS和样式组件来给React组件添加样式和动画效果。

教程地址:https://codeburst.io/animating-react-components-with-css-and-styled-components-cc5a0585f105

13. 在React Native中开发多选项滑动开关

由Victor K Varghese提供的教程,介绍了如何基于60帧动画设计和开发功能性组件。

教程地址:https://codeburst.io/developing-multi-slider-switch-in-react-native-a15b83b29828

其他教程

14. 通过Netflix Clone示例来学习Expo React Native和样式组件

由JM Myers提供的教程,通过Netflix Clone示例学习如何使用React Navigation和Expo。

教程地址:https://codeburst.io/getting-started-with-expo-react-native-and-styled-components-using-a-netflix-clone-example-652c7cb2a794

15. 使用React Native开发ToDo应用程序

由Ahmed Mahmoud提供的教程,手把手教你如何开发一个最基本的React Native应用程序。

教程地址:https://codeburst.io/todo-app-with-react-native-f889e97e398e

16. 使用react-native-maps渲染谷歌地图

由Kirsten Swanson提供的教程,介绍如何使用react-native-maps来渲染谷歌地图。

教程地址:https://codeburst.io/react-native-google-map-with-react-native-maps-572e3d3eee14

17. 使用Firebase推送通知

由William Candillon提供的教程,介绍如何在React Native中实现通知推送。

教程地址:https://codeburst.io/react-native-push-notifications-with-firebase-1f23c4f0af65

18. 使用react-navigation和redux开发应用导航栏

由Dan Parker提供的教程,详细介绍了如何使用react-navigation,并使用redux来管理导航栏状态。

教程地址:https://codeburst.io/react-navigation-with-complete-redux-state-management-tab-bar-and-multiple-navigators-ed30a69d9a4d

19. 在React Native应用程序中使用Facebook SDK登录模块和Firebase

由Pop Robert提供的教程,介绍了如何集成Facebook SDK登录模块,并将注册用户的信息保存到Firebase数据库中。

教程地址:https://codeburst.io/react-native-app-with-facebook-sdk-login-and-firebase-storage-606744701207

20. 如何在两天内使用Clarifai开发一个具有视觉识别功能的React Native应用程序

由Leonardo Balland提供的教程,手把手教你如何在两天内开发出一个视觉识别应用程序。

教程地址:https://codeburst.io/how-to-build-a-visual-recognition-mobile-app-in-2-days-with-react-native-and-clarifai-3801f0901704

21. 使用Expo、React Native和Redux开发一款简单的游戏

由Ali Alaa提供的教程,介绍如何使用Expo、React Native和Redux开发一款简单的游戏。

教程地址:https://codeburst.io/how-i-created-a-simple-game-with-expo-react-native-redux-cf4f0580f7f3

22. 四个在React Native中使用谷歌地图的建议

由Ginny Fahs提供的教程,在使用谷歌地图时的四个建议。

教程地址:https://codeburst.io/4-tips-for-using-the-google-maps-api-with-react-native-46d8fa863eba

23. React Native的端到端测试

由Ahmed Mahmoud提供的教程,介绍如何在React Native进行端到端的测试。

教程地址:https://codeburst.io/react-native-end-to-end-testing-made-easy-b275ed00ce73

24. 使用React Native和Hasura开发登录功能

由Divyanshu Kumar提供的教程,使用本地状态代替Redux开发登录功能。

教程地址:https://codeburst.io/making-a-login-app-using-react-native-and-hasura-without-redux-bb31d102038d

25. 使用Expo、样式组件和Redux-Saga开发Reddit阅读器

由JM Myers提供的教程,介绍如何使用Expo、样式组件和Redux-Saga开发一款Reddit阅读器。

教程地址:https://codeburst.io/creating-a-reddit-reader-in-react-native-with-expo-styled-components-and-redux-saga-21e7fffba20e

感谢覃云对本文的审校。

评价本文

专业度
风格

您好,朋友!

您需要 注册一个InfoQ账号 或者 才能进行评论。在您完成注册后还需要进行一些设置。

获得来自InfoQ的更多体验。

告诉我们您的想法

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我
社区评论

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

允许的HTML标签: a,b,br,blockquote,i,li,pre,u,ul,p

当有人回复此评论时请E-mail通知我

讨论

登陆InfoQ,与你最关心的话题互动。


找回密码....

Follow

关注你最喜爱的话题和作者

快速浏览网站内你所感兴趣话题的精选内容。

Like

内容自由定制

选择想要阅读的主题和喜爱的作者定制自己的新闻源。

Notifications

获取更新

设置通知机制以获取内容更新对您而言是否重要

BT