关于我的博客

Mar 11, 2017

建立这个博客的初衷是用来记录一些我的想法,并且最好是对他人有帮助的内容,另一方面这里也是我个人的一个技术实验室,很多技术相关的 idea 会先在这里进行实践应用。

为什么要自己写一个博客系统

一篇文章在发布后随着时间的推移,通常会发现可改进的地方或者有错别字之类的,所以最好可以支持随时编辑文章,编辑后实时生效,从这点来看众多静态博客系统就算配合 CI 也不是很灵活,所以还是自己从零开始写了一个博客系统,这样可以 100% 按照自己的想法来设计。

主要用到的技术栈:

  • Node.js
  • PostgreSQL
  • GraphQL
  • React
  • TypeScript
  • JSON Web Token

技术栈转变历程 🤖

stage 1 (2016-2017)

这是最初版本,传统的 MVC 模式,统计了一下大概 2000 行代码实现了前端到后端的 CRUD

  • Handlebars.js
  • MongoDB
  • gulp

这个阶段的代码是非常简单清晰的,对于一个简单的应用来说也可以了,虽然它并不容易做组件化和工程化。

stage 2 (2018)

17年开始,我刚好在当时的公司推动前后端分离,当时花很多精力做了一套 React 服务端渲染框架来支持前后端分离,成功把手头的两个项目从 MVC(Laravel + jQuery + React) 迁移到了 React SSR,上线后虽然因为历史代码问题出现了内存泄露,不过好在事先做了监控,及时发现并定位到了问题。

有了这次在生产环境的成功案例,加上工作上写了快两年 React,这个时候再来看 Handlebars.js 这种模板语法就很难接受了(由俭入奢易 由奢入俭难)
并且在这个时候我切身体验到了 MongoDB 的一些体验性问题,比如说,相比 PostgreSQL 和 MySQL 它并没有一个我个人觉得很好用的 GUI,另一方面 MongoDB 官方提供的命令行备份工具相比 PostgreSQL 也不够好用。

基于上述背景,我决定将博客系统的技术架构调整为这样:

  • MVC 改为前后端分离,建立单独的 API server 和 render server
  • 首屏服务端渲染,在浏览器端过渡为 SPA (兼具 SEO 和用户体验)
  • MongoDB 替换为 PostgreSQL

整个改造过程大慨用了一个周末加几个晚上,期间也是一边学 SQL 语法,一边用 SQL 重写 API Model 层(这个时候没有用 ORM 框架),得益于前面说的工作经验,这次重写博客系统的时候顺便单独写了一套 React SSR 工具链 发布在 NPM 上,方便我其他的 Side Project 复用这套工具链。

改造好之后,给我最大的感受就是从农业时代的刀耕火种进化到了工业时代,同样的功能用不同的技术方案去做,开发效率和体验是有非常大差距的。

stage 3 (2018)

GraphQL vs REST 感觉可以单独写一篇文章了。

  • graphql-yoga
  • React-Apollo

graphql-yoga 使用下来也发现了个别蛋疼的问题(比如默认 host 是 0.0.0.0 用户不能更改,为了安全在生产环境还得自己用 iptables 关掉对应端口的公网访问权限),并且相关的 PR 在 github 上一直没有被通过,后续准备替换掉它。

Features 🚀

  • Mobile First (核心功能支持移动设备)
  • 实时 CRUD
  • 代码自动格式化和高亮(现在会使用 Prettier 保持统一的风格)
  • 一系列高性能优化
  • 文章权限系统