基于Vue.js的2.5.13版本和TypeScript编写的模仿原生应用的WebApp.
建议直接添加到主屏幕(ios端体验差一些).
- 学习vue全家桶，本人很长一段时间在用React。
- 利用PWA技术来模仿原生应用,来探究PWA与原生的差异。
- 作者声称2.5之后vue增强了对TS的支持，探究TS在vue中的支持情况。
- github上缺乏Typescript编写的vue项目，个别项目也不是完整的,这可能是第一款。
- 原生APP与WebApp最大的区别就是离线能力，我们希望做一款以离线能力为主的app，这种类型的app绝大多数都是工具类的，例如番茄闹钟、效率工具等等，诸如美团、头条这种app离线场景价值有限（离线怎么点餐看新闻啊？缓存里的应该叫旧闻了）。
- 其实最主要的一点是本人自制力差,仿饿了么、xx音乐的项目太多了，怕遇到困难直接抄人家源码，少了思考过程。
-
我们全程Typescript编写,组件完全Class化,ts是构建健壮应用的必备良药,众多团队在ts化自己的项目了,而github上我找不到任何一个ts+vue的完整app,此项目可以供你学习.
-
我们利用了pwa技术,pwa目前已经被ios支持(虽然支持得烂),所以,开花结果是迟早的事情,vue+pwa的项目也是十分有限,尤其是在vue-cli 3.0之后就没有相关的项目供参考了.
vue2.5 + Typescript + vuex + vue-router
git clone https://github.com/xiaomuzhu/vue-ts-daily
npm i && npm run dev
MacOS 10.12.6 node10.0.0
- 习惯新建 -- 完成
- 习惯编辑 -- 完成
- 习惯归档 -- 完成
- 习惯删除 -- 完成
- 习惯激活 -- 完成
- vuex持久化 -- 完成
- 当日习惯展示 -- 完成
- 对之前习惯的补签和取消 -- 完成
- 默认习惯选择列表 -- 完成
- 习惯图标与背景颜色的编辑 -- 完成
- 习惯的重复日期、激励语、重复时间段的编辑-- 完成
- 奖励卡领取 -- 完成
- 不同时间段不同习惯的tab筛选 -- 完成
- 习惯的总天数、当前连续天数、历史最高纪录等记录逻辑 -- 完成
- 登录 -- 完成
- 反馈 -- 完成
- 更新日志 -- 完成
- 远程同步信息 -- 完成
- 开启https实现pwa
- 加入后台推送功能
- 加入主题更换
- 丰富动画效果
�习惯管理、习惯首页、设置
时间段编辑、补签记录
习惯库、图标设置
习惯记录
新建习惯
编辑习惯
本项目是还原了APP Store一个精选习惯管理app,叫"小日常"。
整体功能还原了90%以上，身为工具类的app还是以逻辑为主，有两个点比较难处理.
- 逻辑耦合严重，例如一个习惯成功打卡或者取消打卡后，相关的连续天数、总天数、当前天数、习惯当前的ui、日历ui、弹窗逻辑全部要响应.
- 时间处理,习惯养成工具最主要的还是要处理时间,例如日历组件,当天之后的补签是不能响应的,因此需要做一个时间上的判断,而补签之前的相关连续记录要做改变,这个时候需要计算这个补签是否改变了连续的记录,其中又得涉及时间的处理,整个逻辑就是处理跟时间的关系.