搭建Github Pages博客

搭建Github Pages博客

本文是在Windows 10上创建docker容器（Hexo构建环境），之后用VS Code连接Docker容器进行博客创作，利用Github Action监听git push事件，实现一键构建博客页面

一、注册Github账号

1. 用浏览器打开Github官网，如下图所示，点击Sign up按钮；

2. 然后依次填写用户名、邮箱和密码，如下图所示，点击Create account按钮；

3. 主要是选择注册账号的目的及你所擅长的开发语言，可以什么都不选，直接跳过，滚动到页面底部，如下图所示，点击Complete setup按钮；

4. 验证邮箱地址；

5. 登录注册时的邮箱，查看noreply@github.com发送的邮件，如下图所示，点击Verify email address按钮；

二、创建Github仓库

1. 创建仓库，如下图所示，点击Create a repository按钮；

2. 创建仓库，仓库的名称与用户名保持一致，如下图所示，点击Create repository按钮；

3. 点击Setting按钮；

4. 在该页面底部附近，如下图所示，点击None按钮，选择分支名称，这里直接选择main；

5. 点击按钮Choose a theme；

6. 根据自己的喜好，选择主题，选完之后点击Select theme按钮；

7. 进行初次提交；

8. 根据自己的用户名，在浏览器的地址栏中输入https://${Github_User}.github.io，显示效果如下图所示；

三、创建hexo构建环境

1. 通过下面的命令进行构建docker容器；

docker build https://github.com/wenchengji159357/Hexo-blog-docker.git --file Dockerfile --build-arg Github_User="syedndeliar23602" --build-arg Github_Email="syedndeliar23602@gmail.com" --build-arg Github_Branch_Name="main" --tag hexo-blog-image

注：syedndeliar23602、syedndeliar23602@gmail.com修改成自己的GitHub用户名和GitHub邮箱，Github_Branch_Name为Github Pages设置的分支名称，默认为master，如果分支名称是master，则删除参数–build-arg Github_Branch_Name="main"即可，默认的博客主题是fluid

2. 通过下面的命令拉取docker容器，并进入镜像；

 docker run -it hexo-blog-image -p 4000:4000 /bin/bash

3. 在浏览器的地址栏中输入http://localhost:4000， 显示效果如下图所示；

4. 进入刚刚拉取的容器，输入以下命令查看SSH公钥，复制输出结果；

cat ~/.ssh/id_rsa.pub

5. 再次用浏览器打开Github官网，如下图所示，头像旁边的小三角，点击Settings按钮；

6. 点击SSH and GPG keys按钮；

7. 点击New SSH key按钮；

8. 在Title下面的文本框中自己的实际情况进行命名，在Key下面的文本框中粘贴刚才的输出结果（SSH公钥），然后点击Add SSH key按钮；

9. 在刚才的容器终端中，输入以下命令查看SSH私钥（用于Github Actions），复制输出结果；

cat ~/.ssh/id_rsa

10. 点击Setting按钮；

11. 点击Secrets按钮和New repository secret按钮；

12. 在Name下面的文本框中输入SSH_PRIVATE，在Value下面的文本框中粘贴刚才的输出结果（SSH私钥），然后点击Add secret按钮；

13. 在刚才的容器终端中，输入以下命令，目的是把用于构建博客的代码上传至hexo_blog分支；

git push -u origin hexo_blog

14. 根据自己的用户名，在浏览器的地址栏中输入https://${Github_User}.github.io, 显示效果如下图所示；