SingleMai / SingleMai.github.io

0 stars 0 forks source link

建站--博客 #4

Open SingleMai opened 6 years ago

SingleMai commented 6 years ago

经过这段时间的沉淀使用,最终还是决定自己建站搭一个博客来使用。主要思考原因如下:

  1. 方便按照自己喜欢的布局去排列内容
  2. 方便去为博客开发新特性和功能(邮件订阅推送、评论点赞什么的),虽然说其实很多主流的工具都已经有这类型的提供,但是使用它你需要去了解并且适应人家的方式,那么麻烦何不自己实现一个更好呢?(也当做自己实现能力的一种嘛)
  3. 想把自己博客建起来作为一个信息集合平台,虽然说这个网站最终会面向大众,但是就我个人而言,其实很大程度上我是为了给自己用的。每天上班我大概会给自己空余一小些时间用来阅读各种文章和咨询吧,但是现在有很多平台,medium 知乎、掘金..........各种大佬的博客,然而要浏览完总会缺这缺那,缺失些精华吧,所以想给自己做一个聚合过滤,方便自己最快地接触到相关咨询。
  4. 方便自己验证一些自己脑海想法做实践,例如我很想试一下ASR是怎么做的,但是这种情况下公司如果不愿意或者没时间采用这套技术,那么我永远只能在纸上谈兵,或者我自己建一个项目。那么如果需要一个项目,就来一个博客吧!(前段时间也思考了很多项目的实现,但是要么不是很有趣,要么就是可能自己没有维护热情————最终归结还是自己没有好的想法)。而博客其实是可以作为一个偏中等难度的东西,你要把它做好有很多细节点需要考虑,如果只是粗糙做做,那么随意几个功能就能完成你的需求。
SingleMai commented 6 years ago

那么既然决定了,我们就开始动工吧。首先,寻找合适的页面设计。这是最头痛的地方吧,大概。先把自己喜欢的页面给弄起来,好让自己有无限的热情去弄呀喂

SingleMai commented 6 years ago

这里来记录一下过程中看到比较好,值得参考的博客:

  1. 翁天信的博客 排版设计上不错,提供日间和夜间模式的值得参考。
  2. 张鑫旭的博客 想要用来作为整合所有咨询的想法来源于张老师的博客。如何把大量地咨询整合进一个页面十分值得参考。
  3. 小土刀
  4. Google Blog
SingleMai commented 6 years ago

先约定一些技术选型吧:

  1. Egg.js + Typescript使用搭建node后台。原本想着已经写了好一段时间egg这种黑盒式的node框架,其实有点想回归koa本身来实现。但是考虑到之前其实已经试过koa+Ts这种开发形式了,而egg+ts的确还没有一次比较好的实现过。所以综上就这样来捣鼓一下吧。
  2. Vue + Typescript 使用来单间前后端分离的应用。vue算是我目前三大主流框架唯一会的了,这次加上typescript想踩更多的坑吧。毕竟听说vue对ts的支持其实真的一直没有特别让人舒服。有几次想要开坑,但是还是忍住了。这次让我们一把跳进火海里吧。
  3. 其实看到前两点大家都能看出来技术架构就是前后端分离式的SPA了。这是我特别熟手的事,但是考虑到我希望这套架构能够足够地灵活让我以后可以各种架构实现都在这里才做,所以特意想让各块的东西都没那么大耦合性。(例如尝试vue的ssr服务端渲染、vue的同构实现或者甚至尝试用react来重写之类的吧)
    1. 数据库没啥好说的,直接掏出老牌的mysql,ORM的话有点点想尝试用typeORM来做而不是sequelize来做。emm,不过这块不是特别重要吧,反正都只是API调用罢了。听说typeORM的支持会更棒,但是如果sequelize用得顺手那么就继续这样用吧。

当然搭建什么的,掏出最近刚学的docker来做,不过这些都是后话了。进程守护管理,pm2算是用得比较顺手的。虽然egg一直极力不推崇。那么为了折磨自己,我们来考虑一下就不引入pm2来看看到底会有什么火花。顺带提一下最近一直想要研究的easywebapck,虽然不得不说他真的封装得足够好了,但是本着折腾的心,我觉得不能让自己过得太安逸吧。用着黑盒魔法,万一哪天就不让用了,内心不安。而且自己内心是想着能终有一日做一下webpack的优化的(或许遥遥无期)

so,总结一下:

-----------后续------------ 突然想起来同事一直热推的nestjs。稍微浏览了不少文章,关于nodejs-web框架的调研.大多都是各方有各方的争执,然后就有人拉着start出来说事了。结果发现现阶段nest和egg的差距已经只剩1K,那么按照这个增长趋势,是不是意味着nest将要反超了。当然看了一遍发现入门的成本好像还不低,有明确提到几块必须了解的前置知识。相反egg入门成本真的要低很多,个人感觉现在其实还可以再慢慢来考虑看看了。或者先用egg做了,再用nest重构一把?感觉这样是不是忒费时的说了。最近可以再多接触几把吧,毕竟作为个人项目其实项目能做出来并不是重要的,能让自己真正学到东西才是重要的

SingleMai commented 6 years ago

博客主要有以下几个功能区:

然后尽可能地能分类清晰展示出来就好啦,如有必要可以弄一个自荐的功能。就是自己写了文章很多,但是有哪几篇是觉得刚来的小伙伴特别应该学的,那么可以给他推荐一下。当然也算是后话啦

重要的还是阅读体验上,参照meduim等这些网站的设计思路吧,尽可能让阅读体验提高。另外一点,想要通过markdown文件来达到快速上传?毕竟平时的话我更倾向于去打开个编辑器来写而不是在网页端。

SingleMai commented 6 years ago

知识库 这个是本次设计我最希望有的一个功能区块。主要目的是能够汇总各种自己平时喜欢浏览的网站的文章,做一个统一集合吧。并不想直接把人家整块文章抓下来,只想要拿到标题、作者、阅读数(判断值不值得看)以及文章链接这样的功能来让自己快速拿到所有资料吧。当然最重要是有已读功能咯,还有标星功能、收藏之类的,这里不需要做得太重的逻辑,只想要有一个简单归纳,毕竟其实收藏功能,你一旦收藏就真的藏起来了。这辈子都不会打开,我想要的设计感是标一个想读,然后自己找时间把它给读掉即可。觉得忒好对自己有帮助可以直接迁到bolg的分享分支打标签吧。

抓取有几个问题: 1. 公众号的抓取 2. 掘金和知乎这类网站的抓取 3. 各种技术大佬们的私人博客抓取 4. 国外网站的抓取(这个要弄代理么) 具体要抓取什么内容可以后续另开一个进行统计(算是消化一下自己的收藏夹)

另一点比较重要的就是去重,避免从不同网站拉到同一篇文章,然后适当做一些过滤。但是数据量如果大起来,做这个查重或许也是一个不太那么友好的操作,具体可以后续进行考虑。(在一段时间内进行查重即可?毕竟阅读过我就没必要存起来了,有打算存起来的就该移到bolg进行记录了)

SingleMai commented 6 years ago

一个自己的首页介绍: 身为一个合格的前端工程师,对于自己的about页面,当然不能那么简单啦。尽可能参考一下别人做出个官网式的好看页面吧?

SingleMai commented 6 years ago
  1. 想要订阅的爬虫内容 百度Web前端研发部 淘宝前端团队 腾讯CDC 京东JDC
SingleMai commented 6 years ago

最近在强迫自己看英文文档、看英文视频学着去提升一下自己的英语能力。但是记单词真的好麻烦(感觉自己对这个太没语感了)然后又想起之前在考四级的时候有用过一个背单词的网站。我觉得是不是可以写个小插件,收录单词到网站上然后再每天进行巩固复习捏? 当然这样的生态应用其实还是蛮大的:

  1. 我需要弄个谷歌插件,用来查单词。并且每次查都要把这个查询记录推送到后台。如果不用这种插件,那么操作路径有点多,需要先查单词然后再打开另一个软件记录。容易有所遗漏
  2. 巩固复习,要参考之前的那个网站。样式表现上倒还行,主要还是得有一个定时提醒的功能之类的。这样的话做成electron应该才是最终归属?maybe 这已经不算博客的功能了,但是嘛记录在这里。以后有想法想写东西可以来这里嘛。而且我的博客就是想集合我自己全部的资源,最重要就是自己用的够爽,所以呢老子就是要集成进去。

不过立个小flag。最近都在学习别的内容,暂时还没打算开始这个项目,so...暂定过年的时候来完成吧!!

SingleMai commented 5 years ago

评论系统 这是某up的blog,https://hufangyun.com/2017/zsh-plugin/ https://github.com/gitalk/gitalk

SingleMai commented 5 years ago
  transformTimeForm(seconds) {
    return [
      parseInt(seconds / 60 / 60),
      parseInt(seconds / 60 % 60),
      parseInt(seconds % 60)
    ].join(':').replace(/\b(\d)\b/g, '0$1');
  }
SingleMai commented 5 years ago

今天看《跃迁》,突然有一个想法, 做一个提问功能。因为我初学时候或者有些时候经常有一些问题不知道问谁,希望通过这个提问的功能,能够帮助别人的同时进行一些思想碰撞吧