怀旧系列。

最近在GitHub中发现了2017年写的一个博客网站项目(目前已经删除),经过一番修改,终于能跑起来了(目的是做最后的截图留念),长这个样子的:

iBlog Config WalkThrough ! iBlog 完全配置指南 !_web

左边有我的各个社交媒体的主页,虽然都不怎么维护了。网站有暗黑模式和白天模式,默认是暗黑模式,保护眼睛。上面还有搜索框,支持标签搜索、正则表达式。头像是一只古代牧羊犬。

iBlog Config WalkThrough ! iBlog 完全配置指南 !_js_02

页脚的年份2021因为是计算出来的最新年份,早在2018年就不维护这个博客了。居然还可以播放BGM,我瞅了一眼仓库,发现可以选择如下2个音频文件可选,都是当年爱听的歌:

  • Up&Up (Radio Edit) - Coldplay.mp3

  • Blank Space - Taylor Swift.mp3

点击About,还能弹出自我介绍:

iBlog Config WalkThrough ! iBlog 完全配置指南 !_js_03

可以看出,我当年的文笔很有嘻哈、无厘头风格,可能是受大学室友的影响,觉得这样“不说人话”的样子很酷。。。至于这个jinhengyu.xyz本来想好好维护的,后来种种原因就放弃了。

iBlog Config WalkThrough ! iBlog 完全配置指南 !_搜索引擎_04

这个博客最大的特色是,所有文章都是其他平台的链接,博客本身不存储文章,只存储每篇文章的元信息:标题、url、内容概括、原创性、标签、发表日期、图片。比如下面这个JSON:

{
    "title": "10个实用技巧,让Finder带你飞~",
    "url": "https://yq.aliyun.com/articles/307497",
    "desc": "Finder 是 Mac 电脑的系统程序,有的功能类似 Windows 的资源管理器。它是我们打开 Mac 首先见到的「笑脸」,有了它,我们可以组织和使用 Mac 里的几乎所有东西,包括应用程序、文件、文件夹、磁盘以及你网络上的共享磁盘,你同时可以通过它看到丰富的、高质量的文件预览。",
    "copy": false,
    "tags": ["mac", "2016", "finder"],
    "date": 1475901420000,
    "img": "data:image/jpg;base64,/9j/2wBDABcQERQRDhcUEhQaGBcbIjklIh8fIkYyNSk5UkhXVVFIUE5bZoNvW2F8Yk5QcptzfIeLkpSSWG2grJ+OqoOPko3/2wBDARgaGiIeIkMlJUONXlBejY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY2NjY3/wAARCAB8AMgDASIAAhEBAxEB/8QAGwABAAIDAQEAAAAAAAAAAAAAAAQGAQIFBwP/xAAyEAEAAQMBBQYEBQUAAAAAAAAAAQIDEQQSEyExUgU0cXKRsRVBUZIGIjJCVCQzYWKB/8QAGQEBAAMBAQAAAAAAAAAAAAAAAAECBAMF/8QAIREBAAIBAwUBAQAAAAAAAAAAAAERAgMSExQhIkFhUQT/2gAMAwEAAhEDEQA/AOKA6OQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADMUVTGYpqmPBnYr6KvSVmicRERwiI5QbU/WXbi+snU/FZ2K+ir0k2K+ir0lZtqfrJtT9ZOL6dT8Vnd19FXpJu6+ir7ZXbs2j8tdyfnOITnHLxmmrT88Yyed7uvoq+2Td19FX2y9EFdy+151NFURmaaoj6zDD0DVxFWkvU1RExNE5ifB59HKPBMTaJimQEoAAAAAAAAAAAAAAWXJlpky3U8qm+TLm0Xa/jVdG3Vsbv9OeHydCiNuumnqmIRE2tOFVDuaSjd6a3T88Zn/r7NeXBH1+rjRaK5qJomuaI4Ux855Q8+ZubetEVFJQ4NFH4hv0b7f2LEzxizNPvwTeytdf1VN21q7O61NiYpriI4TnlMCyZqe7XfJV7PPo5R4PQNR3a75KvZ5/HKPBMKZMgLKgAAAAAAAAAAAAAO9k2mmTL0aedTOzRvJubMbcxjaxxSdHx1lqJ6kXJtYnMTiUTjcUmO0xKz5FZm7Xj+5X90rFZnNm3M8c0x7MWppbPbfp6u/wBPoZYfK1qbV69dtW69qu1MRXEfJydW2o7td8lXsoEco8F+v93u+Sr2UGOUeCYVyZASqAAAAAAAAAAAAAA6+TLTLGeD1KYafTJlAinU6efyTvrf0nnDaNfRHC5bronwU3x77L7J9d03Kyaac6W1P+keynT2hZ/bFdU/SIdjTXu0tbpbdvT2401rZxN6vnPgz/0ZRMRTto4zEzaZ2j2hVRXGk0UbzV18OH7P8ykdn6OnQ6aLcTtVzO1XX1VNdDoLOhond5quVfruVc6kpkaGt+f6e75KvZQo5R4L5f7vd8lXsocco8EwrLICUAAAAAAAAAAAAAAOjkygxeuxGNuWd/d659Ibepx/HDjlNyZQt/d659IN/d659IOpx/DjlMjEcohYOya9rQUx0zMKnv7vXPpD62u0NXYpmm1fqpiZziIhy1dXHPGohfDGcZtdBTvi2v8A5NfpB8W1/wDJr9IZqdbW6/3e75KvZRI5R4JdztPW3KJor1Fc01RiY4cUVKJkAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB/9k="
}

然后将所有JSON存到mongodb数据库中,原以为通过日积月累,坚持录入新文章,文章可以越来越多,形成自己的笔记仓库,可以快速检索以前写过的任何东西,可是最终只坚持到第9篇就放弃了,这9篇文章是:

iBlog Config WalkThrough ! iBlog 完全配置指南 !_web_05

下面就展示一些博客的源文件了(乱七八糟)

博客的README.md

iBlog Config WalkThrough ! iBlog 完全配置指南 !

Intro

...iBlog诞生于 Sat Sep 02 2017, 前身是OpenBlog, 前后端分离之后网站挂了...多年后发现一些第三方博客平台如CSDN和OSChina还留着以前写的许多辣鸡文章, 为何不做一个平台把他们链接起来呢? 于是我利用XXXX的时间完成了这个轻量级博客(600K+), 当前版本 1.0.3, 特别感谢MDUI框架提供了响应式的Material风格 ~

About Author

目前是个缺钱的noder, 未来可能是个denor, 一生专注Web全栈, 走得很安详... 意淫的个人tags: ["JinHengyu","Jim","恒星","智障"]... 常用邮箱 jinhengyu666@qq.com 终身域名 jinhengyu.xyz, 服务器目前在米国所以略慢(反正没人看)

Environment

数据库: mongodb 4.0.3 容器: expressjs 4.16.2 前端: mdui 0.4.1

以上3个主要框架, 还有一些小的模块详见package.json, 除此之外无任何依赖, 初次访问600+K, 缓存之后~50K [流量天使]

Config

Keywords

  • linked: 博客原名叫LinkedBlog, 原因是本博客不存储文章内容, 全部链接于第三方站点, MongoDB只存储每篇文章的元数据(meta data)

  • secure: 减少了文章存储的设计成本, 我将更多的经历投入到网站安全设计上, 做到99%的安全

  • single-user: 网站用户(不是访客)唯一, 是一个单人博客

  • light-weight: 初始响应体积600K+, 缓存后每次不到100K, 依赖极少

  • read-only: 访客(guest)只可读, 意味着没有点赞和访问量的统计数据, 一定程度上增强安全性

  • material-design: 全站遵守material design设计原则, 实现无缝的动态UI, 感谢MDUI框架(https://mdui.org)

  • responsive: 响应手机端/平板/laptop三种屏幕以及更大的屏幕

常用命令(表达式)

统计post目录中json文件数量:

require('fs').readdir(cfg.post.path).filter(f=>f[0]!=='.').length 统计mongo中post表中文章数量:

网站上所有的图片:

iBlog Config WalkThrough ! iBlog 完全配置指南 !_web_06

iBlog Config WalkThrough ! iBlog 完全配置指南 !_js_07

iBlog Config WalkThrough ! iBlog 完全配置指南 !_web_08

iBlog Config WalkThrough ! iBlog 完全配置指南 !_java_09

iBlog Config WalkThrough ! iBlog 完全配置指南 !_java_10

iBlog Config WalkThrough ! iBlog 完全配置指南 !_java_11

iBlog Config WalkThrough ! iBlog 完全配置指南 !_java_12

iBlog Config WalkThrough ! iBlog 完全配置指南 !_java_13

iBlog Config WalkThrough ! iBlog 完全配置指南 !_搜索引擎_14

iBlog Config WalkThrough ! iBlog 完全配置指南 !_java_15

iBlog Config WalkThrough ! iBlog 完全配置指南 !_web_16

package.json:

{
  "name": "iblog",
  "description": "iblog",
  "main": "index.js",
  "scripts": {
    "test": "istanbul cover _mocha",
    "start": "pm2 start index.js --name 'iblog'"
  },
  "author": "JinHengyu",
  "license": "MIT",
  "dependencies": {
    "archiver": "^3.0.0",
    "body-parser": "^1.18.3",
    "connect-mongo": "^2.0.1",
    "ejs": "^2.5.7",
    "express": "^4.16.2",
    "express-session": "^1.15.6",
    "mongodb": "^3.1.8"
  },
  "devDependencies": {}
}