toFrankie / blog

种一棵树,最好的时间是十年前。其次,是现在。
20 stars 1 forks source link

使用 VS Code + Github 搭建个人博客 #327

Open toFrankie opened 7 months ago

toFrankie commented 7 months ago

配图源自 Freepik

写在前面

相关话题,感兴趣可看看。

博客方案

搭建个人博客的方式很多,门槛很低。

选择现有平台:

自行搭建:

如何选择?

我们写个人博客的初衷,大致会有这些吧:

我对个人博客平台的要求:

在国内的话,可能是掘金、语雀、博客园会好一些吧,用户群体基本都是程序员,可以带来更多讨论。知乎 Markdown 支持不行,简书内容审核很严格,动不动封禁文章。作者在简书写了几年,后来由于审核机制太傻比了,动不动封禁,实在忍无可忍就溜了。

如果自行建站,要考虑 SEO、图床、域名备案、运维费用等问题。选择国内平台,无法避免的是内容审核,改个字都得审核一下,无话可说。

总之,各有利弊,选择一个合适自己的就行。

我的博客:种一棵树,最好的时间是十年前。其次,是现在。

我现在的选择是:

Github Blogger

Github Blogger inspired by Aaronphy/Blogger.

此前离开简书,考虑过到掘金上续写,但现在掘金的整体质量不如以前,而且充斥着各种标题党,给人一种贩卖焦虑的感觉。后来看到了一种 Github Issue 的方案,找到了 Aaronphy/Blogger 插件,可以安安静静地写博客。

用了一段时间,发现有些地方用得不顺手、而且有一些 Bug,作者好久没更新了,那干脆就基于此作一个二次开发,修复了一些 Bug,并添加了一些功能,于是 Github Blogger 诞生了。

原作者的设计思路如下图,源自《在 VSCODE 中写博客吧》。

我没有直接 Fork 一个出来改,而是进行了重写。在原有功能的基础上,新增或调整了一些地方:

长这样 👇

如果你恰好也喜欢,欢迎来这里试试~ 👋

如何使用 Github Blogger

很简单,准备好一些几步就行:

  1. 安装 Github Blogger(VS Code 扩展)。
  2. 准备好你的 Github Personal Access Token,它使用 Github API 来创建、更新 Issue/Labels 等。
  3. 使用 Command + Shift + P 或 Ctrl + Shift + P 快捷键唤起命令面板:
    • 键入 Config Github Blogger 完成初始配置。
    • 键入 Open Github Blogger 打开编辑界面,可以愉快地进行创作了。

该扩展配置如下:

{
  "github-blogger.token": "xxx", // Your GitHub Personal Access Token
  "github-blogger.user": "xxx", // Your GitHub Username
  "github-blogger.repo": "xxx", // Your GitHub Repository Name
  "github-blogger.branch": "main" // Your GitHub Repository Branch Name
}

其中 branch 用于指定你的博客仓库的分支,默认是 main 分支,一般情况下无需特别设置。它主要用于图片、文章存档。

请注意,你的博客仓库必须是公开的。原因是图床使用了 Github + jsDelivr 的方案,后者对私有仓库不支持,否则会出现图片无法查看的情况。

可配合 github-issue-toc 使用,它可以在 GitHub Issue 内生成目录。

GitHub Issue 除了支持标准的 Markdown 语法之外,还支持特有格式,详见:About writing and formatting on GitHub

The end.