某网站注册不能用免费邮箱,一时冲动买了个域名来弄企业邮箱,另外也配合ngrok做内网穿透。只是这样的话有点浪费,于是顺便搭个静态博客来玩。

就需求来说,个人笔记以前用evernote就足够了,协作,共享都能实现,手机端操作十分方便。但私人笔记记录比较随意,注释都没几条,时间久了按步骤复现没问题,但背后原理难免有点模糊。发到博客上则能强制自己写仔细认真些。

静态博客平台比较

首先要按需求和前置技能选一个合适的平台,以下结论是google得来,除了Hexo另外两个并未亲自尝试,所以并不靠谱。以后有空会都试试再详细对比。

Jekyll (JB, octopress)

👍Github原生支持
👍插件众多
👎页面生成效率低
👎ruby搭建环境对win不友好

Hugo

👍GO编写,性能强大,页面生成效率极高
👍依赖少,单个可执行文件搭建环境简单
👎扩展性差

Hexo

👍Node.js,搭建环境相对简单
👍扩展性强
👍页面生成效率不及Hugo,但远超Jekyll
👎社区偏小

由上可见性能和扩展性折中的Hexo更合适我个人使用。

环境搭建

Git

Node.js

通过nvm安装nodejs。win版nvm

1
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash

重启终端,然后安装node.js

1
nvm install stable

若访问npmjs.org过慢,可换npmmirror的源

1
npm config set registry https://registry.npmmirror.com

注册GitHub账号

配置SSH keys

1
cd ~/.ssh

若提示No such file or directory则需生成新Key

1
ssh-keygen -t rsa -C "youremail@youremail.com"

passphrase为每次提交项目输入的口令,若不想每次都输入的话可以通过ssh-agent来保存

1
2
3
cd
touch .profile
vim .profile #添加启动代码

复制~\.ssh\id_rsa.pub的内容到Github Settings
注:Windows环境变量
测试ssh

1
ssh -T git@github.com

设置用户信息

1
2
git config --global user.name "你的姓名" #不是用户名
git config --global user.email "你的邮箱"

部署Hexo

安装hexo

1
npm install -g hexo-cli

建立新文件夹,在bash中指向这个文件夹

1
2
3
4
hexo init
npm install
hexo generate #生成静态页面至public目录
hexo server #http://localhost:4000 查看效果

安装主题

这里选用的是luuman的SPFK

1
git clone https://github.com/luuman/hexo-theme-spfk.git themes/spfk

配置

修改以下文件

/_config.yml

Site部分
url
theme: spfk
Deployment部分

1
2
3
4
deploy:
type: git
repository: git@github.com:username/username.github.io.git
branch: master

/themes/spfk/_config.yml

启用youyan,注释掉另外两个
friends部分,添加友链
站长验证
流量统计

/themes/spfk/source/img

替换favicon.png, head.jpg, alipayimg.jpg, wechatimg.jpg, apple-touch-icon.png

部署到GitHub

1
hexo d

定制域名(可选)

域名为二级域名(example.com)

在public目录添加CNAME,内容为域名地址。
到DNS服务商处更改解析:添加A记录指向185.199.108.153

域名为三级域名(blog.example.com)

在public目录添加CNAME,内容为域名地址。
到DNS服务商处更改解析:添加CNAME记录指向YOURNAME.github.io

常用插件

备份博客

由于部署在github上的是public文件夹的内容。故文章源码,博客配置文件等仍需另行备份,这里用的是hexo-git-backup
github中新建一个私有仓库,如blog-backup
安装插件。

1
npm install hexo-git-backup --save

_config.yml文件最后添加以下内容。

1
2
3
4
5
backup:
type: git
theme: landscape,spfk
repository:
github: git@github.com:YOURNAME/blog-backup.git,master

执行备份上传。

1
hexo b

参考资料

Hexo Docs
使用GitHub搭建Hexo博客