相信大多数的程序员都会想要搭建一个属于自己的博客，放一些技术博客、读书笔记，这件事不关乎于技术栈和阅读量，只是想完全靠自己构建一个私密的空间，可以想说什么说什么。
为什么要搞博客？
首先做程序员，就得有程序员的觉悟或者说情怀？为开源做一些自己的贡献，可以白嫖但不能白嫖到底。
然后是这一路上有非常多的大神、巨佬们，在遇到问题的时候伸出援手，帮忙解决问题，一方面是感恩，一方面是自己踩过的坑希望其他人能避过去，哪怕是一个人，这件事也是有意义的。
再然后是上学时候受一位老师启发，当能给别人讲明白一个问题的时候，才是真正掌握这个知识点，知识是需要输入与输出的，在输出的过程中能够把似懂非懂的彻底弄懂。同时因为人的大脑是“关系型数据库”，也就是说你记住的所有东西都依赖我们大脑里已经有的东西，在输出过程中也有助于碎片化知识的串联、共鸣。
其次还有非常重要的，提高自己的语言组织能力和思维逻辑能力，不管是写一篇博客、做一期vlog，还是筹办一场婚礼、安排一次旅行，都需要在脑子里搭建一个框架，然后去充实、去陈列，一点点的变得丰满、变得充实。
最后，与人交流是人生非常快乐的一件事，在微博和朋友圈可能很难找到和自己志同道合的人，但试试博客，或许会带来不一样的感受。
Hexo
Hexo是非常非常好用的博客搭建工具，简单、轻便、主题多，不管你是喜欢动漫风，还是机械风，都能找到自己心仪的主题，18年的时候用hexo搭过一个网站，也很方便，但是缺点就是过于花里胡哨了，可能长大了喜欢简约一点的风格。
vuepress
文档地址：
vuepress是基于Vue 驱动的静态网站生成器，你可以使用 Markdown 来书写内容（如文档、博客等），然后 VuePress 会帮助你生成一个静态网站来展示它们。
最早是vue的团队为了vue和vue生态的项目文档需求，因为其简约和方便越来越被更多的开发者用来当作文档、博客来使用。
vuepress-theme-vdoing
vuepress-theme-vdoing是一款简洁高效的VuePress 知识管理&博客 主题。
官方文档地址：
GitHub地址：
安装和使用
文档地址在上面，具体的API就不搬过来凑字数了，没啥意义
# clone the project
git clone https://github.com/xugaoyi/vuepress-theme-vdoing.git
# enter the project directory
cd vuepress-theme-vdoing
# install dependency
npm install # or yarn install
# develop
npm run dev # or yarn dev
复制代码功能介绍
除了可以提供一个比较简洁高效的博客之外，这个主题的拥有个性化、碎片化、结构化的管理形态，通过标签和文件层级，自动生成侧边栏、目录页、索引页、面包屑等，轻松构建一个结构化知识库。
目录
通过文件目录的编号来生成对应的pages目录
通过config.js来配置navbar的菜单
gitalk
Gitalk，一个基于 Github Issue 和 Preact 开发的评论插件。
vuepress-plugin-meting
一款博客播放器，有点鸡肋，但是又有点意思，可以放一些自己喜欢的音乐。
安装一下
yarn add vuepress-plugin-meting -D
复制代码config.js
// 插件配置
plugins: {
// 鼠标点击特效
"meting": {
meting: {
//放会员歌曲的话，只能30s，所以霉霉、Beatles这种的就别放了
auto: 'https://music.163.com/#/my/m/music/playlist?id=xxxxxxx',
// 当前服务为netease -> 网易
server: "netease",
// 类型为歌单
type: "playlist",
// 歌单id
mid: "xxxxxxxx",
},
aplayer: {
// 0为不显示歌词
lrcType: 3,
// 音量
volume: 0.15,
// 开启迷你模式
mini: true,
// 自动播放
autoplay: true
},
},
}
复制代码部署和构建
github.io
github.io是基于github的repo管理，可以用来博客的容器来使用。尤其是github action的出现，可以实现自动化的打包部署，非常方便。
首先需要新建一个仓库，缀名一般情况下使用 （.github.io）
比如我的仓库名字就是：
norwegianwood1208.github.io/
复制代码然后在仓库的Settings/Pages里面设置相应的分支以及文件夹等等
actions自动化
首先在代码仓库的Settings/Secrets设置token令牌，官方文档：
https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token
复制代码需要注意的是token的名称需要和下面脚本里的环境变量名称一致
然后点击代码仓库的actions，创建自动化脚本
name: CI
# 在master分支发生push事件时触发。
on:
push:
branches:
- master
jobs: # 工作流
build:
runs-on: ubuntu-latest #运行在虚拟机环境ubuntu-latest
strategy:
matrix:
node-version: [10.x]
steps:
- name: Checkout # 步骤1
uses: actions/checkout@v1 # 使用的动作。格式：userName/repoName。作用：检出仓库，获取源码。 官方actions库：https://github.com/actions
- name: Use Node.js ${{ matrix.node-version }} # 步骤2
uses: actions/setup-node@v1 # 作用：安装nodejs
with:
node-version: ${{ matrix.node-version }} # 版本
- name: run deploy.sh # 步骤3 （同时部署到github和coding）
env: # 设置环境变量
GITHUB: ${{ secrets.ACCESS_TOKEN }} # toKen私密变量
CODING: ${{ secrets.CODING_TOKEN }} # 腾讯云开发者平台（coding）私密token
run: npm install && npm run deploy # 执行的命令
# package.json 中添加 "deploy": "bash deploy.sh"
复制代码自动化部署脚本
首先在package.json里面添加一个运行脚本的命令：
"deploy": "bash deploy.sh",
复制代码deploy.sh文件
#!/usr/bin/env sh
# 确保脚本抛出遇到的错误
set -e
# 生成静态文件
npm run build
# 进入生成的文件夹
cd docs/.vuepress/dist
# deploy to github pages
echo 'https://github.com/NorwegianWood1208/NorwegianWood1208.io' > CNAME
if [ -z "$GITHUB_TOKEN" ]; then
msg='deploy'
[email protected]:NorwegianWood1208/NorwegianWood1208.github.io
else
msg='来自github actions的自动部署'
githubUrl=https://norwegianwood1208.github.github.io/
git config --global user.name "NorwegianWood1208"
git config --global user.email "[email protected]"
fi
git init
git add -A
git commit -m "${msg}"
git push -f $githubUrl main # 推送到github gh-pages分支
cd -
rm -rf docs/.vuepress/dist
复制代码运行命令就可以实现自动化打包部署的功能了
在部署的时候可能会有让输入Github SSH Key，按照下面的文章可以免去每次输入key
https://xuanwo.io/2015/02/07/generate-a-ssh-key/
复制代码在浏览器打开：
norwegianwood1208.github.io/
复制代码最后
百度的seo不支持GitHub，想要做seo的可以把代码放在腾讯的coding pages上面。