OneM
前言
本篇文章是对最近开源的纯ReactNative项目OneM的使用补充说明，由于OneM项目中大量使用到Redux、Router-flux等框架的知识，对于初学者来说可能看起来有些吃力，不知道从何看起。所以作者打算写一篇较详细的OneM学习手册。想查看OneM更详细的项目介绍请点击。欢迎大家
Star
OneM项目地址
https://github.com/guangqiang-liu/OneM
目录
- 课前准备
- 项目文件夹目录层级关系及作用
- react-native-router-flux路由框架详解
- Redux框架详解
- fetch网络请求工具类封装
- IconFont使用及如何自定义自己的font库
- 蚂蚁金服组件库ant-D如何接入使用
- iOS、Android平台UI错乱如何优雅的解决
- 如何自定义基类Component及导航栏
- 表单提交的数据如何更优雅的自动校验参数
- 仿网易音乐播放器如何设计的与封装
- 仿爱奇艺视频播放器如何设计的与封装
- 实现微信、QQ分享、登录功能
- ReactNative如何设计与实现AOP埋点
- 实现颜色渐变的导航栏效果
- 实现高斯模糊效果
课前准备
开发工具
- 现在市面上有很多开发工具可供选择：例如（ws、sublime、Atom、vscode等）。这个根据个人喜好选择不同的开发工具即可。
开发环境
- Node环境、react环境、nvm环境、javajdk环境
基础知识
-
js常用语法
- js常用语法请参照W3C
-
es5、es6常用语法
-
请参考作者对es5、es6常用语法的总结：常用es5与es6语法总结
-
更多详细的es6语法学习请参照：阮一峰老师ECMAScript 6 入门
-
-
flexbox盒子模型布局
- 请参照：阮一峰老师Flex布局详解
项目文件夹层级关系及作用
根目录文件夹示意图
root
下面主要介绍src目录
src
src目录下的每一个子模块在这里就不一一展开演示说明了，每一个文件夹都有其自己独立的功能和含义，希望同学们自己私下认真的学习体会每一个文件目录对应的功能特性。
react-native-router-flux路由框架详解
学习react-native-router-flux路由框架请点击
想直接运行Demo查看效果请点击
更多更详细的内容请查看官方Git
Redux框架详解
学习Redux框架请点击
想直接运行Demo查看效果请点击
更多更详细的内容请查看官方Git
fetch网络请求工具类封装
学习fetch请求工具类请点击
想直接运行Demo查看效果请点击
IconFont使用及如何自定义自己的font库
学习IconFont以及如何自定义font库请点击
想直接运行Demo查看效果请点击
查看官方IconFont使用指南请点击
蚂蚁金服组件库ant-D如何接入使用
学习如何接入使用ant-D组件库请点击
想直接运行Demo查看效果请点击
查看ant-D官方组件使用指南请点击
iOS\Android平台样式错乱如何优雅的解决
学习如何优雅的解决双平台样式错乱问题请点击
想直接运行Demo查看效果请点击
如何自定义基类Component及导航栏
学习自定义基类Component及导航栏请点击
想直接运行Demo查看效果请点击
表单提交的数据如何更优雅的自动校验
学习表单如何自动校验请点击
想直接运行Demo查看效果请点击
仿网易音乐播放器如何设计的与封装
学习网易音乐播放器如何实现请点击
想直接运行Demo查看效果请点击
仿爱奇艺视频播放器如何设计的与封装
学习爱奇艺视频播放器如何实现请点击
想直接运行Demo查看效果请点击
实现微信、QQ分享登录功能
学习如何实现微信、QQ分享登录功能请点击
想直接运行Demo查看效果请点击
实现颜色渐变的导航栏效果
学习如何实现颜色渐变的导航栏效果请点击
想直接运行Demo查看效果请点击
实现高斯模糊效果
学习如何实现高斯模糊效果请点击
想直接运行Demo查看效果请点击
福利时间
- 作者React Native开源项目OneM地址(按照企业开发标准搭建框架设计开发)：https://github.com/guangqiang-liu/OneM (欢迎小伙伴们 star)
- 作者简书主页：包含50多篇RN开发相关的技术文章http://www.jianshu.com/u/023338566ca5 (欢迎小伙伴们：多多关注，多多点赞)
- 作者React Native QQ技术交流群：620792950 欢迎小伙伴进群交流学习
- 友情提示：在开发中有遇到RN相关的技术问题，欢迎小伙伴加入交流群（620792950），在群里提问、互相交流学习。交流群也定期更新最新的RN学习资料给大家，谢谢支持！
网友评论