0x00 为什么要写博客

学了很多东西,中断一段时间的学习后总觉得啥都忘掉了;折腾了很多东西,但再次折腾的时候总是要重新找教程;踩过很多坑,但是再次遇到的时候总要重新踩一般;做过什么事情,别人问的时候还得翻历史记录找链接。

如果你有遇到过以上的这些问题,那么你就该开始写博客了。诚然在写博客中会遇到很多的问题,在看完别人很好的技术文章后想自己总结一遍,但总觉得是在照抄别人的东西;自己搭建博客的时候会遇到许多问题,耗费很多的时间和精力;总是坚持不下去写博客,三分钟热度。但是这个折腾和总结的过程正是我们搭建自己的知识框架的过程,看过的文章再好,动动小手copy的时候也会发现很多忽略的细节,完成这样一个写的过程往往更能体会到作者的深意,缕清行文的思路;折腾得越久,投入得 时间越多,也会更想把自己得博客经营好;当别人问你问题的时候甩上自己文章得链接,岂不美哉!

0x01 选择博客框架

我从大一接触到云服务开始,使用了很多种博客框架,其中最方便得就是云服务器上基于宝塔面板的Wordpress框架,使用方便而且容易配置域名放在公网访问,但是要进行备案以及内容审查,面临着域名、服务器过期等问题。

后来又尝试了Hexo+githubpage的框架,体验非常好,无需备案,高度的可定制性,网上教程资源多,但是对刚刚入门的同学操作会有点难度。

最近在新买的homelab上搭建了内网的基于ubuntu docker的wordpress,配置了frp转发访问,折腾完觉得索然无味,于是便决定回归Hexo。折腾那么久后才觉得博客的本质在于文章而不在于框架,框架简单易用、能为写文章提供最大的便利即可。

本文记录了基于github page搭建Hexo博客,通过PicGo+github搭建图床,使用Typora+PicGo编辑文章 的工作流的流程。发布文章便捷,博客访问方便,且不用但心审查和过期。

0x02 搭建Hexo博客

2.1 准备工作

  • github账号

在github中新建仓库,仓库名为yourusername.github.io,在setting中找到github page并配置publish

image-20230304101702336

  • 安装好Git

  • 安装好NodeJs

image-20230304101837180

add ssh key

可以使用 SSH(安全外壳协议)访问和写入 上的存储库中的数据。 通过 SSH 进行连接时,使用本地计算机上的私钥文件进行身份验证。 有关详细信息,请参阅“关于 SSH”。

生成 SSH 密钥对后,必须将公钥添加到 以启用帐户的 SSH 访问。

打开命令行并输入:

1
ssh-keygen -t rsa -C 'your_email@example.com'

生成你的密钥。

img

可以看到你的密钥保存在/home/your_name/.ssh下,打开该文件夹并复制刚刚生成id_rsa.pub中的内容

随后打开你的github setting在ssh keys处添加你的公钥,完成添加。

img

最后建立一下ssh连接确认是否成功。输入:

1
ssh -T git@github.com

img

2.2 安装Hexo

我们采用Hexo来创建我们的博客网站,Hexo 是一个基于NodeJS的静态博客网站生成器,使用Hexo不需开发,只要进行一些必要的配置即可生成一个个性化的博客网站,非常方便。点击进入 官网

安装 Hexo

1
npm install -g hexo-cli

查看版本

1
hexo -v

创建一个项目 hexo-blog 并初始化

1
2
3
hexo init hexo-blog
cd hexo-blog
npm install

本地启动

1
2
hexo 
hexo server

启动后的页面如图所示,我们可以在本地预览博客

image-20230304102134819

2.3 将博客推送到github page

安装hexo-deployer-git

1
npm install hexo-deployer-git --save

修改根目录下的 _config.yml,配置 GitHub 相关信息

1
2
3
4
5
deploy:
type: git
repo: your repo address
branch: main
token: your token

请添加图片描述

执行生成博客并推送到远程的命令

1
hexo g -d

浏览器访问 https://yourunsername.github.io, 部署成功

image-20230304102636388

2.4 Hexo 命令

1
2
3
4
hexo n "标题"			//生成文章并存储到source/_posts
hexo g //生成博客页面
hexo s //本地预览文章
hexo d //推送文章到github page

使用简单的命令就可以完成博客的生成和部署,注意在未添加ssh key时使用hexo d会出现权限不够无法推送的问题,请务必为本机添加ssh key。

2.5 修改Hexo主题

使用Next主题

将主题的源码放入blog文件夹中的themes文件夹

image-20230304103846611

修改blog文件夹中的_config.yml文件,将主题修改成对应的主题名称

image-20230304104244994

重新生成并部署博客

2.6 小结

至此博客的部署全部完成,读者可以自己搜索相关配置文章,分别修改博客目录和主题目录下的_config.yml文件,注意要区分博客目录和主题目录!添加插件各种魔改来完善自己的博客。反正我是不折腾了。

0x03 PicGo搭建图床

博客文章的图片需要找个地方存放,全部存放在本地占用过大,引用别人的图片说不定哪一天就挂了;于是决定白嫖github的存储空间,毕竟能访问github page的也应该得能访问github

3.1 配置github

创建一个新的公共仓库,并获取github的access tokens

img

将获取的token保存起来

3.2 配置PicGo

https://github.com/Molunerfinn/PicG 下载PicGo并打开

image-20230309093148974

  • 输入你设定的仓库名(注意斜杆前后无空格)

  • 将分支修改为main

  • 将上一步得到的token输入进去

若未开启代理则有可能无法访问github,故我们在设置里面设置一下代理

image-20230309093340529

随意上传一张图片,上传成功则配置成功!

0x04 配置Typora+PicGo工作流

下载Typora 支持正版!

Typora有个很好的地方就是可以与PicGo无缝衔接,在文档中插入图片可以直接上传到图床中,使得工作流变得十分流程。

image-20230311092946660

按照下图设置便可完成配置。

结语

现在就可以开启你的博客之旅啦!记得保持更新,千万不要鸽!更重要的是注重内容的本身,注重这样一个积累的过程。