利用github和hexo搭建个人博客

利用github和hexo搭建个人博客

0x00. 引言

  1. 使用github pages服务搭建博客的好处有:
  1. 全是静态文件,访问速度快;
  2. 免费方便,不用花一分钱就可以搭建一个自由的个人博客,不需要服务器不需要后台;
  3. 可以随意绑定自己的域名,不仔细看的话根本看不出来你的网站是基于github的;
  4. 数据绝对安全,基于github的版本管理,想恢复到哪个历史版本都行;
  5. 博客内容可以轻松打包、转移、发布到其它平台;

0x01. 准备工作

  • 有一个github账号,没有的话去注册一个;
  • 安装了node.js,并了解相关基础知识;
  • 安装了git for windows(或者其它git客户端)。

0x02. GitHub创建个人仓库

  1. 新建一个github仓库,命名规则为你的用户名.github.io(必须是你的用户名,其它名称无效),比如说,我的github用户名是wayxz,那么你就新建wayxz.github.io的仓库,将来我的网站访问地址就是 https://wayxz.github.io

0x03. 安装Git

  1. 从git官网下载Git,下载安装后在命令行里输入git测试是否安装成功。

  1. 安装成功后,将你的Git与GitHub帐号绑定,鼠标右击打开Git Bash。
1
2
git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"
  1. 生成ssh密钥文件。
1
ssh-keygen -t rsa -C "你的GitHub注册邮箱"
  1. 然后直接三个回车即可,默认不需要设置密码,然后找到生成的.ssh的文件夹中的id_rsa.pub密钥,将内容全部复制。

  1. 打开GitHub_Settings_keys 页面,新建new SSH Key。

  1. 在Git Bash中检测GitHub公钥设置是否成功,输入 ssh git@github.com ,如果显示successfully等如下字样,即配置成功。

0x04. 安装Node.js

  1. 下载Node.js ,从官网下载长期支持版: 10.16.1 (包含 npm 6.9.0)的Node.js,并安装。

  1. 安装成功后输入node -v,显示安装的node版本。

0x05. 安装Hexo

  1. Hexo就是我们的个人博客网站的框架, 在在电脑常里创建一个文件夹,可以命名为Blog,Hexo框架与以后你自己发布的网页都在这个文件夹中。创建好后,进入文件夹中,右击鼠标运行git bash here。

  2. 使用node.js自带的npm命令安装Hexo,输入:

1
2
3
4
npm config set registry http://registry.npm.taobao.org          //由于国外npm源网速过慢,建议更换为国内源
npm config list //查看换源是否成功

npm install -g hexo-cli
  1. 安装完成后,初始化我们的博客,输入:
1
hexo init blog    //新建一个名为blog的网站
  1. 为了检测博客是否搭建成功,分别按顺序输入以下三条命令:
1
2
3
4
5
hexo new test_my_site  //新建一篇文章   文章被生成在.\blog\source\_posts文件夹下

hexo generate //生成静态文件,该命令可以简写为hexo g

hexo server //启动服务器。默认情况下,访问网址为:http://localhost:4000/,该命令可以简写为hexo g 。

推荐主题模板,教程很详细可以按照上面的设置

0x06. 推送网站到github

  1. 将我们的Hexo与GitHub关联起来,打开站点的配置文件_config.yml,翻到最后修改为:

    deploy:
    type: git
    repo: 这里填入你之前在GitHub上创建仓库的完整路径,记得加上 .git
    branch: master参考如下:

  2. 保存站点配置文件,其实就是给hexo d 这个命令做相应的配置,让hexo知道你要把blog部署在哪个位置,很显然,我们部署在我们GitHub的仓库里。最后安装Git部署插件,输入命令:

1
npm install hexo-deployer-git --save
  1. 这时,我们分别输入三条命令:
1
2
3
hexo clean 
hexo g
hexo d

hexo d 就是部署网站命令,d是deploy的缩写。完成后,打开浏览器,在地址栏输入你的放置个人网站的仓库路径,即 https://wayxz.github.io

常用hexo命令

常见命令

1
2
3
4
5
6
7
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本

缩写:

1
2
3
4
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

组合命令:

1
2
hexo s -g #生成并本地预览
hexo d -g #生成并上传

参考

  1. Git教程
  2. Node.js教程
  3. HEXO教程
Author: wayxz
Link: https://wayxz.github.io/2019/08/05/利用github和hexo搭建个人博客/
Copyright Notice: All articles in this blog are licensed under CC BY-NC-SA 4.0 unless stating additionally.