授权协议: MIT
开发语言: JavaScript
操作系统: 跨平台
收录时间: 2017-04-22
提 交 者: 素敌

美团客户端

支持: Android 4.1 (API 16)+ IOS(8.0+)

iOS截图

iOS_0.png

iOS_1.png

iOS_2.png

Android截图

Android_0.png

Android_1.png

Android_2.png

简介

这是一个用React-Native写的美团客户端。
使用了React-Native 0.42版本。遵循ES6语法。
主要实现了美团的四个一级页面(团购、附近、订单、我的),以及部分二级页面(团购详情、Web页面)。
所有功能都是用JavaScript写的,iOS和Android的代码复用率达到了97%(别问我这个数字怎么来的,我瞎掰的)。
这个Demo的静态类型检查工具使用了Facebook的Flow。它让我写JavaScript的时候,更有安全感。个人觉得可以用两个字形容这个工具,那就是:灰常牛逼!
我试着让这个Demo的结构尽量接近实际项目,同时使用比较简单方式去实现功能。这样可以让刚接触ReactNative的人(比如我自己...)更够容易理解代码。
所有的JS代码都在src目录下。
目录结构

Paste_Image.png

  • common
    通用的工具类

  • img
    所有图片资源

  • scene
    所有场景

  • widget
    通用的UI控件

  • api.js
    网络请求的接口

  • RootScene.js
    App的主入口,类似iOS中的RootViewController

该项目没有使用Redux。因为个人觉得目前大部分的中小型App并不需要Redux。如果盲目的将Redux添加到项目中,并不能带来太多的益处。
鲁迅曾说过:

"如果你不知道是否需要 Redux,那就是不需要它。"

Redux的作者 Dan Abramov 说过:

"只有遇到 React 实在解决不了的问题,你才需要 Redux 。"

哦,另外一个没有用Redux的原因,是我还不太会用。

App的页面跳转、TabBar、Navigation,全部通过第三方的库react-native-router-flux实现。这是一个非常牛逼的库,可以实现很多自定义的跳转功能。

App中很多页面都使用了同一个网络接口,这不是为了让代码更加简洁,仅仅是我偷懒 >.<

第三方依赖

安装

  1. Clone the repo

    $ git clone https://github.com/huanxsd/MeiTuan.git
    $ cd MeiTuan
  2. Install dependencies (npm v3+)

    $ npm install
  3. Running on iOS

    $ react-native run-ios

常见问题

Could not connect to development server

打开新的terminal窗口,并执行:

  $ react-native start

瞎扯蛋

我之前一直在写Objective-C,但不久前看了ES6的语法和Flex布局方式后,我便马上爱上了这种开发方式。
这个Demo花了大概5天时间,是我的第一个ReactNative项目。
如果对这个Demo有任何的意见或建议,或者喜欢ReactNative的朋友,欢迎在下方留言。我会在第一时间回复 :)

最后

如果你喜欢这个Demo,请给我一个star :)
我将持续更新这个Demo

展开阅读全文

代码

MeiTuan 的相关资讯

还没有任何资讯

MeiTuan 的相关博客

If Meituan integrates Didi, the housing, travel

Wang Xing said that there will be 100 million orders every day in the future. According to the current customer unit ...

SQL优化神器 —— SQLAdvisor

一、SQLAdvisor是什么 SQLAdvisor是由美团点评公司技术工程部DBA团队(北京)开发维护的一个分析SQL给出索引优化建议的工具。...

大话编程-适配器模式

适配器模式(Adapter Pattern) 将一个类的接口,转换成客户期望的另一个接口。适配器让原本接口不兼容的类可以合作无间。 动机...

Tencent rose 5.79%, leading the blue-chip gains

Tencent rose 5.79%, leading the blue-chip gains, with a total market value of HK$5.25 trillion. Our beloved Zhonggene...

mpvue开发美团外卖点餐小程序

mpvue-meituan mpvue-meituan 是一款使用mpvue开发的实战小程序项目,完全仿制美团官方外卖点餐小程序开发而成,项目的框架结...

redis之GeoHash

Redis 提供的 Geo 指令只有 6 个,它只是一个普通的 zset 结构。 增加 geoadd 指令携带集合名称以及多个经纬度名称三元组,注...

Redis学习记-近水楼台-GeoHash

近水楼台-GeoHash Redis在3.2版本以后增加了地址位置Geo模块,意味着可以使用Redis来查找附近的XXX。 用数据库来算附近的人 ...

如何开启MySQL慢查询日志

1, https://github.com/Meituan-Dianping/SQLAdvisor/blob/master/doc/QUICK_START.md http://www.ttlsa.com/mysql/meituan-s...

Spring boot 多数据源

网上多是基于XML文件,本文使用基于配置类的方式使用动态数据源。 多数据源原理 Spring作为项目的应用容器,也对多数据源提供...

MeiTuan 的相关问答

还没有任何问答,马上提问

评论 (5)

加载中
打分: 推荐
不错不错,楼主辛苦了
2018/05/10 22:30
回复
举报
打分: 推荐
用什么开发工具?
2018/01/30 19:06
回复
举报
咋配置服务器环境用phpstudy咋安装了求大牛解答
2017/09/06 10:12
回复
举报
打分: 力荐
厉害,加油
2017/04/24 16:07
回复
举报
tt
2017/04/22 19:27
回复
举报
更多评论
5 评论
83 收藏
分享
在线直播报名
返回顶部
顶部