https://github.com/guoguodad/jd_mall
🔥🔥高仿京东商城App,具有完整的结构,代码整洁规范,结构清晰,集成Flutter模块,具备React-Native热更功能... 同款Flutter版本( https://github.com/GuoguoDad/jd_mall_flutter.git )
https://github.com/guoguodad/jd_mall
android kotlin mvi react-native
Last synced: about 2 months ago
JSON representation
🔥🔥高仿京东商城App,具有完整的结构,代码整洁规范,结构清晰,集成Flutter模块,具备React-Native热更功能... 同款Flutter版本( https://github.com/GuoguoDad/jd_mall_flutter.git )
- Host: GitHub
- URL: https://github.com/guoguodad/jd_mall
- Owner: GuoguoDad
- License: gpl-3.0
- Created: 2022-01-25T14:05:02.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2023-11-10T08:50:34.000Z (almost 2 years ago)
- Last Synced: 2025-08-13T05:39:29.311Z (3 months ago)
- Topics: android, kotlin, mvi, react-native
- Language: Kotlin
- Homepage:
- Size: 352 MB
- Stars: 212
- Watchers: 6
- Forks: 42
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 前言
高仿京东商城App,具有完整的结构,代码整洁规范,结构清晰,集成Flutter模块,具备React-Native热更功能,...如果对你有帮助,给个star
1. 使用kotlin语言开发,项目使用模块化开发,降低了耦合性
2. 网络使用 retrofit2 + okhttp3方式,进行了高度的封装
3. [使用leakcanary 内存泄漏检测](https://github.com/square/leakcanary)
4. [基于MVI架构(airbnb的Mavericks)开发](https://airbnb.io/mavericks/#/README)
5. [使用本地mock模拟服务端](https://github.com/mirrajabi/okhttp-json-mock)
6. [采用ARouter路由管理](https://github.com/alibaba/ARouter/tree/master)
7. 集成Flutter模块,填写订单页由flutter编写, module_flutter可单独运行
8. 集成RN热更功能,[rn工程请见](https://github.com/GuoguoDad/mall_page.git)
* ### 同款Flutter版本( https://github.com/GuoguoDad/jd_mall_flutter.git )
### **** 运行要求,Android环境,flutter环境, rn为热更,无需rn环境 ****
# MVI架构

由于没有明确的状态管理标准,随着应用程序的增长或添加功能或事先没有计划的功能,视图渲染和业务逻辑可能会变得有点混乱,并且这种情况经常发生在Android应用开发过程中。可能你经常遇到状态管理导致业务逻辑和 UI 渲染的分工不明确,最终导致应用架构的混乱。而新提出的MVI架构,提倡一种单向数据流的设计思想,非常适合数据驱动型的UI展示项目。MVI的架构思想来源于前端,由于Model、View和Intent三部分组成。
* Model: 与其他MVVM中的Model不同的是,MVI的Model主要指UI状态(State)。当前界面展示的内容无非就是UI状态的一个快照:例如数据加载过程、控件位置等都是一种UI状态
* View: 与其他MVX中的View一致,可能是一个Activity、Fragment或者任意UI承载单元。MVI中的View通过订阅Intent的变化实现界面刷新(不是Activity的Intent、后面介绍)
* Intent: 此Intent不是Activity的Intent,用户的任何操作都被包装成Intent后发送给Model进行数据请求
# Flutter module 作为依赖项
#### 方案 A - 依赖 Android Archive (AAR)
- 这种方式会将 Flutter 库打包成由 AAR 和 POM artifacts 组成的本地 Maven 存储库。这种方案可以不需要安装 Flutter SDK 即可编译宿主应用。
#### 方案 B - 依赖模块的源码
- 该方式可以使你的 Android 项目和 Flutter 项目能够同步一键式构建。当你需要同时在这两个项目中进行快速迭代时,这种方案非常方便。必须安装 Flutter SDK 才能构建宿主应用程序。
本项目采用的方案B,[细节详见](https://flutter.cn/docs/development/add-to-app)
# 热更新
热更新也叫动态更新,一种和web更新方式很类似。对比App的版本更新,热更新能及时修复线上存在的问题,大幅提升业务迭代效率。
热更流程:

1,将本地打包好 Bundle 文件上传到 OSS ,同时生成MD5值。只要 Bundle 内容发生了变化,那么生成 MD5 值就是不一样的,用 MD5 保证文件的唯一性。
2,上传前面生成的bundle包,然后将服务最新的线上 Bundle 修改成最新的,这时版本服务会在内部通过 mysql 或 redis 把线上最新文件给记录下来。
(这里项目使用json文件记录)
3,React Native App 发起版本请求,版本服务会直接把最新的 Bundle 告诉 React Native 应用。
4,React Native 发起 CDN 资源请求
资源请求会先询问某个 CDN 的边缘节点,如果该边缘节点没有缓存,则会去源站拉取;如果该边缘节点有缓存,则直接返回。
# 效果
### 首页

### 分类

### 购物车

### 我的

### 商品详情

### 填写订单(flutter模块,混合)

### 账户设置(rn页面-拉取远程的bundle)

# 第三方库
| 库 | 功能 |
| ----------------------- | ---------------------- |
| **retrofit2** | **网络** |
| **okHttp3** | **网络** |
| **mavericks** | **MVI框架** |
| **BaseRecyclerViewAdapterHelper** | **万能适配器** |
| **PhotoView** | **图片预览** |
| **ARouter** | **组件化路由** |
| **coil** | **图片加载** |
| **XPopup** | **弹窗组件** |
| **banner** | **滚动图** |
| **SmartRefreshLayout** | **智能下拉刷新框架** |
| **gson** | **json解析** |
| **leakcanary** | **内存泄漏检测库** |
# 声明
⚠️本APP仅限于学习交流使用,请勿用于其它商业用途
⚠️项目中使用的图片及字体等资源如有侵权请联系作者删除
⚠️如使用本项目代码造成侵权与作者无关