达到1000声望以后

起因

我注册SegmentFault账号是在2016年12月,但是正式开始参与社区贡献是2017年9月。那时候我刚刚毕业,参加工作。到现在已经半年了。

当时只是想着帮助别人,并且通过别人提出的问题和回答来积累自己实际经验。毕竟靠每天工作得到的项目经验太少了,个人成长实在有限。

以前觉得1000声望很难得,更不用说能上排行榜的5位数声望了。但是半年来,养成积极帮助他人的习惯后,我发现自己不知不觉也跨过了1000声望的门槛。从个人角度来讲,我想做点事情来纪念一下。

上周,我翻译了一篇关于react-vis的文章。而我想起以前一直对爬虫很感兴趣,当然现在没兴趣了。总之,这两个因素让我决定爬一爬自己通过回答得到的声望。没有文章被赞,没有文章被收藏等声望,就是单纯的,回答、回答被赞和回答被采纳。

实现过程

要实现这个项目,需要先分解需求,然后选取技术栈,最后发布。

分解需求

  1. 爬取SF页面
  2. 将得到的数据存入json,放在gitpage上
  3. 利用fetch api获取该json
  4. 根据得到的数据使用react-vis生成柱形图,x轴为时间,y轴为声望数,每一个x点分别有3个长方形,代表问答、被赞和被采纳。

技术栈

  1. node-crawel + cheerio:解决需求1
  2. react + react-vis:解决需求3、4
  3. jest:测试代码单元

json存储格式

1
2
3
4
5
6
7
8
9
10
11
{
answer:{
"2018-3-20":1
},
answerBeHonored:{
"2018-3-20":10
},
answerBeAdopted:{
"2018-3-20":15
}
}

关键思路

  1. 需要将SF声望记录里的x小时、x天前转成格式为yyyy-MM-dd。这个只需要判断不同情况,然后根据当天减去每天的毫秒数或每小时的毫秒数得到的毫秒数生成一个Date对象。然后再转换格式。
  2. 有的操作可能被用户取消,但仍保留在声望记录上。这时要通过判断是否存在[已取消]来跳过处理。
  3. 利用react-vis生成柱形图时,x坐标轴的类型要设置为oridinary

效果展示

最终效果
最后算了一下大概553点声望来自问答。看来通过文章,尤其是翻译文章,得到的声望占的水分挺大的。

总结

我不了解Node.js,之前没听说过node-crawel,所以纯粹是一时兴起尝试了一下,有一些坑,但最终还是解决了。满打满算一共是花了4.5小时,主要是尝试使用crawel以及测试各单元功能。

爬虫的代码不打算开源,一是因为很简单,照着教程写没什么问题。二是觉得爬虫这个东西或多或少有点危害?姑且算是我不开源的理由之一吧。

大概就是这样了,还是很感慨能够跨入1000声望呢,下一个目标大概是5000声望,继续努力吧。

参考文章

  1. 使用node-crawler和jsdom完成爬虫
  2. [译]Node Crawler:强大的Node开源爬虫
  3. [翻译]react-vis:一个数据可视化库
  4. react-vis文档