基于mongodb+express+vue+axios+bootstrap的掘金最热文章收藏评论分析
2017.11.21更新:本篇文章的代码详解整理完毕,发布在另外一篇文章,有兴趣的可以移步:
http://blog.****.net/xiaozhuyirena/article/details/78861963
目前此项目还在完善,项目地址在:传送门
灵感来源
最近浏览技术文章的时候,偶然看到一篇关于分析简书热荐文章中代码块数量的文章,链接我翻了一遍了历史记录也没有发现,可能被“吃了”把,好吧不管他的文章在哪了。看了那边文章后,我对掘金的首页开始了非分之想(嘿嘿嘿嘿~~,掘金君不要怪我奥!!)
灵感初现
看了掘金的最热文章后,我开始了一次“天马星空”的猜想,为什么这个文章会成为最热的呢,是因为浏览量比较多,评论数比较多,还是收藏量比较多导致的呢,我开始有了初步的想法。光想还是不行,我还是要开始动手做了,我喝了一杯水,在浏览器上轻轻的打开了掘金的首页,然后熟练的打开了调试器,开始对掘金君进行无情的分析,好吧,初步分析以后,发现评论数,浏览数,收藏数就在API接口中(我露出一丝坏笑~~),这样就可以省的我去爬页面的数据了;第一个想法浮现在脑海中,直接调用接口进行前100最热篇文章的分析,利用echarts的折线图绘制曲线进行分析;(嗯,很好,很快就能完成~~)然而爱折腾的我没有认同这种做法,这样没有挑战性,也学不到多少东西,怎么办,改变套路(额,就是套路,对没错,套路一番);
一个让自己可以重新梳理前后端以及数据库知识的想法悠然而生,一直在做一些爬虫的小程序(这里只只是想简单用一下而已,请勿喷~~),为何不在此利用一番,好吧说干就干,反正有了接口可以直接用,就不用解析dom了;
技术选型
自从有了nodejs,现在前端是什么都敢干了,我想说:js要一统天下(会不会被打,哈哈);梳理一下思路:
1、使用superagent获取掘金接口数据
2、获取的数据利用mongoose存储在mongodb中(Schema重新设计,过滤不需要的数据)
3、使用express搭建后端服务提供接口给前端调用,数据从mongodb中获取
4、前端使用vue + axios + bootstrap + echarts + jquery (我只是想多个库同时使用解决不同问题,喜欢纯用vue的同仁,可以把九十米长刀放下,别误伤 (ಥ _ ಥ) )进行构建
实现功能
1、前端可以显示掘金历史最热前100篇文章的评论,浏览及评论数据分析图
2、并且可以按照类别进行查看
3、对于数据库中不存在的数据要进行提示
4、提示后跳转到可采集页面
6、点击指定栏目可进行采集数据,并返回采集结果
7、额外功能:文章瀑布流显示,并可跳转原文章页面
目前此项目还在完善,项目地址在:传送门
有兴趣的可以来个star,没兴趣的(好吧,我也没有办法让你有兴趣 o(╯□╰)o )
近期我会把项目的整个搭建过程及代码解释整理出来,方便有兴趣的童鞋学习,如果大佬感觉so easy ,那我也没办法了。。。