Home

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 之类的都是简单测量+肉眼调试实现的,下面列出页面和交互的完成度,这里应该只是列出了绝大部分。未列出、未实现的后续会根据时间、精力来实现。 实际完成度请以代码为主

交互完成度

评论、留言、关注、添加到收藏集、发表沸点等暂时均没有实现,因为 APP 里面的东西实在是不少......

后续

  1. 话说掘金的 API 域名(二级)真是多啊,使用webpack-dev-server的proxy配置代理都让node报possible EventEmiter memory leak deteceted的警告了。
  2. 富文本部分是直接拷贝掘金web官网的富文本样式
  3. 有些页面的显示还不够丝滑,后续需要改进
  4. 认真的看效果图的话,可以看出某些页面还是有一些bug的,
  5. 关于页面切换动画似乎还不够连贯,不知道是代码的问题(绝对是代码的问题),还是浏览器的问题
  6. 登录的token好像有一些问题,在两个app登录同一个账号不会报token异常,但是在该项目中在两个浏览器中登录会出问题。
  7. html节点的font-size设置太小了,因此有些忘记设计font-size的元素可能会显示不出文字。
  8. 后续会不停的完善该项目,把一些能够开发的功能都开发出来,希望各位朋友们多多支持。