Awesome
Vue仿照掘金客户端App开发Web版掘金App
运行
git clone https://github.com/sanfengliao/vue-juejin.git
cd vue-juejin
npm install
# serve with hot reload at localhost:8080
npm run serve
# build juejin application for production
npm run build
正文
介绍
该项目是抄袭仿照掘金客户端使用Vue开发的WebApp。里面所有的API均来自官方Android。页面基本上和掘金App差不多,不过由于里面的一些图片本菜使用的是阿里的iconfont,因此会和掘金App上面的图片有点不一样,但是整体的功能和掘金App还是差不多的。
该项目源码已经开源在gayhubgithub, 点击可查看源码,希望各位掘友大大给个star
效果图
(前面一大波长gif来袭)
(如果图片显示不出,请访问原文链接)
-
首页
-
沸点
-
搜索
-
小册
-
我的
-
用户主页
-
话题主页
-
文章详情
-
沸点详情
完成度
本来以为仿照App实现的话应该很快就可以全部昨晚,可做起来才发现APP 里面的东西实在是不少(有一些是本菜实在做不了,比如支付),包括页面和交互,要完全照抄实现确实需要一些时间和精力,UI 之类的都是简单测量+肉眼调试实现的,下面列出页面和交互的完成度,这里应该只是列出了绝大部分。未列出、未实现的后续会根据时间、精力来实现。 实际完成度请以代码为主
- 启动页 不做
- 登录、未登录跳转和页面数据刷新(逻辑还不够眼睛)
- 上拉加载、下拉锁芯
- HOME 完成
- TAB切换
- TAB编辑
- 关注的作者发布的文章
- 点赞
- 沸点
- TAB切换
- TAB编辑
- 关注的作者发布的动态
- 点赞
- 沸点详情
- 搜索 完成
- 按照综合、文章、用户、标签搜索
- 小册
- 小册列表
- 小册详情
- 小册章节详情
- 购买小册 (臣妾做不到啊)
- 我的
- 个人主页
- 编辑
- 活动
- 原创文章
- 沸点
- 收藏集
- 收藏集详情页
- 喜欢的文章
- 关注的标签
- 标签详情页
- 消息中心
- 赞过的文章和沸点
- 收藏集
- 创建的
- 已关注的
- 已购小册 (不知道有没有问题)
- 阅读过的文章
- 标签管理
- 已关注标签
- 所有标签
- 推荐标签
- 所有标签
- 关注标签
- 夜间模式
- 设置 完成一些
- 修改密码
- 登录页
- 作者榜
- 用户主页
- 关注
- 活动
- 原创文章
- 沸点
- 收藏集
- 收藏集详情页
- 关注收藏集
- 收藏集文章列表
- 收藏集详情页
- 喜欢的文章
- 关注的标签
- 标签详情页
- 用户主页
- 话题榜
- 更多话题
- 已关注话题
- 话题详情
- 关注话
- 文章详情页
- 文章内容
- 显示评论
- 文章作者其他系列文章
- 关注作者
- 收藏文章、分享文章
- 评论
- 其他
- 沸点详情页
- 文章内容
- 显示评论
- 推荐沸点
- 关注作者
- 分享沸点
- 评论
- 其他
- 个人主页
- ... 应该还有一些完成的没有列举出来,大家clone下来跑一遍试试吧 点击此下载源码
交互完成度
评论、留言、关注、添加到收藏集、发表沸点等暂时均没有实现,因为 APP 里面的东西实在是不少......
- 评论
- 留言
- 未完待续部分...
后续
- 话说掘金的 API 域名(二级)真是多啊,使用webpack-dev-server的proxy配置代理都让node报
possible EventEmiter memory leak deteceted
的警告了。 - 富文本部分是直接拷贝掘金web官网的富文本样式
- 有些页面的显示还不够丝滑,后续需要改进
- 认真的看效果图的话,可以看出某些页面还是有一些bug的,
- 关于页面切换动画似乎还不够连贯,不知道是代码的问题(绝对是代码的问题),还是浏览器的问题
- 登录的token好像有一些问题,在两个app登录同一个账号不会报token异常,但是在该项目中在两个浏览器中登录会出问题。
- html节点的font-size设置太小了,因此有些忘记设计font-size的元素可能会显示不出文字。
- 后续会不停的完善该项目,把一些能够开发的功能都开发出来,希望各位朋友们多多支持。