8000 修改升级说明 · duheng/Mozi@f7d8a0a · GitHub
[go: up one dir, main page]

Skip to content

Commit

Permalink
修改升级说明
Browse files Browse the repository at this point in the history
  • Loading branch information
shengyao authored and shengyao committed May 25, 2019
1 parent 6607eba commit f7d8a0a
Showing 1 changed file with 44 additions and 52 deletions.
96 changes: 44 additions & 52 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,19 @@
# Mozi 2.0-beta

[![npm](https://img.shields.io/npm/l/express.svg)](https://github.com/duheng/Mozi)
[![CircleCI](https://img.shields.io/circleci/project/github/RedSparr0w/node-csgo-parser.svg)](https://github.com/duheng/Mozi)
[![Codecov branch](https://img.shields.io/codecov/c/github/codecov/example-python/master.svg)](https://github.com/duheng/Mozi)

此项目致力于构建一套可最基础,最精简,可维护的 react-native 项目,适用于团队合作开发 React Native 项目,我们知道 react-native init 出来的项目只是一个最简单的 demo,距离开发企业级项目还差很远,所以这套框架是我在我们团队开发中总结优化而来的,会提供群里关注度高的问题的解决方案以及 demo,此项目虽然还不够完善,但是以此为基础足可以搭建一个大型项目:

##升级 2.1-beta 说明:

此项目致力于构建一套可最基础,最精简,可维护的react-native项目,适用于团队合作开发React Native项目,我们知道react-native init出来的项目只是一个最简单的demo,距离开发企业级项目还差很远,所以这套框架是我在我们团队开发中总结优化而来的,会提供群里关注度高的问题的解决方案以及demo,此项目虽然还不够完善,但是以此为基础足可以搭建一个大型项目:
```
1- 增加auth分枝,包含登录功能,个人中心
```

##升级 2.0-beta 说明:

##升级2.0-beta说明:
```
1- 升级react-native到0.55.4;升级了react-navigation到2.5.5;这快改动比较大,如果你自己的项目有不会升级react-navigation的可以参考一下config.js
2- 增加了消息推动和codepush,和jpush,目前安卓版本有效,ios因没有证书还没测试
Expand All @@ -16,9 +22,8 @@
5- 这个版本集成了codepush和jpush,因为我觉得这是每个成熟的产品都必须要有的功能,大家换成自己申请的key就可以了;如果觉得不需要某个我集成的功能可以直接 unlink就OK了;比如:react-native unlink react-native-code-push 这个模块
```



#### 涉及主要技术

```
1.项目主架构:
Expand All @@ -39,7 +44,6 @@

请完全按照以下步骤启动项目,请完全按照以下步骤启动项目,请完全按照以下步骤启动项目,重要的事情说三遍


```
git clone https://github.com/duheng/Mozi.git
Expand All @@ -49,19 +53,16 @@ yarn install
yarn start
yarn run ios (android)
yarn run ios (android)
windows用户请用 react-native run-android 命令启动
```

**特别注意** 目前npm5存在安装新库时会删除其他库的问题,导致项目无法正常运行。请尽量使用yarn代替npm操作
**特别注意** 目前 npm5 存在安装新库时会删除其他库的问题,导致项目无法正常运行。请尽量使用 yarn 代替 npm 操作

**项目演示**


------

---

<p align="center">

Expand All @@ -72,38 +73,33 @@ windows用户请用 react-native run-android 命令启动

</p>



------
---

#### 已经完善文档 & 已完善效果

一:
[添加启动屏API](http://www.jianshu.com/p/4540ac17dfd4)
一:
[添加启动屏 API](http://www.jianshu.com/p/4540ac17dfd4)

二:
[添加icons](http://www.jianshu.com/p/a25e4ecce60f)
二:
[添加 icons](http://www.jianshu.com/p/a25e4ecce60f)

三:
[React Native预设占位placeholder](http://www.jianshu.com/p/984ef99641f5)
三:
[React Native 预设占位 placeholder](http://www.jianshu.com/p/984ef99641f5)

四:SectionList Demo & 下拉刷新
四:SectionList Demo & 下拉刷新

五:FlatList Demo
五:FlatList Demo

六:react-navigation自定义可缩放头部
六:react-navigation 自定义可缩放头部

七:返回到指定页面(返回多级)
七:返回到指定页面(返回多级)

群号:397885169(有问题或者需求欢迎进群探讨 )

简书:http://www.jianshu.com/u/c971c7ffa27e

知乎:https://www.zhihu.com/people/duheng2011/activities




**项目结构**

```
Expand Down Expand Up @@ -140,35 +136,30 @@ windows用户请用 react-native run-android 命令启动
└── yarn.lock // 依赖的版本信息管理
```


**项目架构说明**

1. 在redux的集成方面采用了es7的Decorator的写法,这样写的优势是在不污染现有代码逻辑的前提下实现了链接store(非侵入式编程思想)
```
@connect(Selector筛选后符合渲染标准的数据, 当前页面需要的Actions)
export default class Zi extends Component {
}
```

2. 采用了redux-saga来做扁平(描述性语言)化的数据组织方式,(优势是用同步的方式写异步码方便自动化测试,随意组织多个action,代理mock数据,自由控制loading)
1. 在 redux 的集成方面采用了 es7 的 Decorator 的写法,这样写的优势是在不污染现有代码逻辑的前提下实现了链接 store(非侵入式编程思想)

3. 在导航(react-navigation)的配置方面我封装了config.js的通用配置,默认会用通用配置,当你在业务页面配置了相应的字段会用你自己配置的覆盖默认的。实现了自由耦合。比如下面demo是 墨规范 页面我配置了headerTitle会用当前配置的:

```
export default class Rule extends Component {
static navigationOptions = {
headerTitle: '墨规范',
};
}
```
@connect(Selector筛选后符合渲染标准的数据, 当前页面需要的Actions)
export default class Zi extends Component {
```
4. 待更新...
}
```

2. 采用了 redux-saga 来做扁平(描述性语言)化的数据组织方式,(优势是用同步的方式写异步码方便自动化测试,随意组织多个 action,代理 mock 数据,自由控制 loading)

3. 在导航(react-navigation)的配置方面我封装了 config.js 的通用配置,默认会用通用配置,当你在业务页面配置了相应的字段会用你自己配置的覆盖默认的。实现了自由耦合。比如下面 demo 是 墨规范 页面我配置了 headerTitle 会用当前配置的:

```
export default class Rule extends Component {
static navigationOptions = {
headerTitle: '墨规范',
};
}
```

4. 待更新...

### 依赖库

Expand All @@ -179,27 +170,28 @@ windows用户请用 react-native run-android 命令启动
4. redux-saga: An alternative side effect model for Redux apps
5. redux-logger: 日志





### 组件库

1. MOUI: 是一套轻量的适用于react-native的ui组件库,待开发..
2. react-native-vector-icons: 是可以直接使用图片名就能加载图标的第三方库,类似于web的iconfont矢量图,使用很方便, 你不需要在工程文件夹里塞各种图片, 节省很多空间
3. react-native-scrollable-tab-view:是一个很好用的可滑动的tab导航,(如果你的项目的tab没有超过一屏的话就用react-navigation的TabNavigator)

### 消息推送

1. jpush-react-native: 极光推送官方支持的 React Native 插件(Android & iOS)
2. react-native-code-push: 微软的热更新开源库

### 如何使用消息推送

全局搜索 896ea8641e9c62c38906de41 ,替换成自己的JPUSH_APPKEY就可以了

### 如何使用热更新

1. android部分:全局搜索 TyXCHztJx9rvb3Ogy5I4cVU-DHGH6a76e0de-a57f-4a89-b60d-01d72ab0675f ,替换成自己的安卓项目codepushkey就可以了;
2. ios部分: 全局搜索 5WgvzaDBLyL5zKjeLscIhfGKtJHb6a76e0de-a57f-4a89-b60d-01d72ab0675f ,替换成自己的ios项目codepushkey就可以了;

### 编程规范

编程规范我们使用的是airbnb,但是这还不够,我希望大部分的代码格式类的工作都能自动化帮我做,开发人员只需要注重业务代码就好。
为此我们用prettier+eslint+sublimelinter+airbnb,在保存代码的时候就对我们的代码进行格式化,提交代码之前再做一次严格的airbnb校验。基本就能保证团队代码的可维护性。

Expand Down

0 comments on commit f7d8a0a

Please sign in to comment.
0