前言

一些关于博客搭建的问题，不想看可以直接跳过，不影响后面的流程

关于主题

我现在使用的主题就是使用Hexo+NexT主题搭建的，但是你也不一定需要使用和我一样的主题，hexo还是有很多其他好看的主题，例如butterfly等主题都可以供你选择，你可以在Hexo的主题官网自行选择即可。我选择NexT主题是因为它本身比较简洁。当然，本基础教程是适用于所有主题的，你只需要把安装NexT主题的部分换成你自己想要的主题即可。

关于Github Page与Gitee Page

为什么要选择Github Page，而不是用Gitee，主要原因如下：

  • Gitee Page 的开通需要身份证认证，不仅要拍身份证正反面，还要有手持身份证的照片，甚至还有不通过的可能，总之就是很麻烦
  • Gitee似乎是有5G空间限制的，虽然说纯打字基本是不可能用完的，但是如果你要使用相对路径来储存文章图片的话，那可能就不好说了
  • Gitee不知道能否绑定自定义域名，反正Github是可以的。如果你看不惯 XXX.github.io的域名话，可以自行去阿里云域名，腾讯云域名等官网购买自己想要的域名，当然这就会造成额外的花费了，不想花钱的话也可以不购买。关于“如何绑定自定义域名”的方法我会单独写篇文章来细致讲解，这里就不过多赘述，毕竟标题是搭建免费博客
     
  • 当然，如果你会使用Github Page，那么你也自然会使用Gitee Page了，二者的步骤其实大同小异，并且如果你想从Github转到Gitee，在接下来的教学中我也会介绍方法。

如何搭建Hexo

接下来就进入我们的正式环节了，不用担心自己没有编程基础，跟着做你就肯定能学会。

环境搭建

注册Github账号

 

进入GitHub官网并注册账号，不会的可以看这篇教程，官网网址如下：https://github.com

下载Git

下载并安装 Git，官网地址： https://git-scm.com/downloads

下载Nodjs

下载安装 Nodejs：http://nodejs.cn/download/

环境配置

  1. 在键盘上按下win+R键，输入cmd（大小写均可）
运行

2. 在弹出的窗口中输入

git --version
npm version

 只要不报错就行
 

CMD

安装与调试

  1. 更换 npm 源
    在刚刚弹出的窗口中输入代码，并等待安装完成（可直接复制，下同）
npm install -g hexo

如果出现报错的情况，例如：

npm ERR! code ENOTFOUND
npm ERR! errno ENOTFOUND
......
npm ERR! network ’proxy‘ config is set properly.  See: ’npm help config‘

这主要是网络的原因，毕竟服务器在国外，下面是解决方案：

  • 如果不是淘宝的镜像，使用taobao镜像，然后跳过下一个方案。
npm config set registry https://registry.npm.taobao.org
  • 如果现在是taobao的镜像，使用下面的
npm config set registry http://registry.cnpmjs.org/
  • 如果不清楚现在用的是哪个，用第一个解决方案。

博客搭建

  1. 在电脑任意位置新建一个文件夹，文件名随意。这个文件夹将用于储存你网站的静态文件。路径最好是全英文的，如果发现路径中存在“此电脑”“本地磁盘”的中文名，不用想着去修改，它的实际路径其实是英文的
     
路径1
路径2

2. 右键鼠标，打开Git Bash Here，并依次输入以下命令：

hexo init 想创建的二级文件名
cd 二级文件名
npm install

 

GItbash
bash1
bash2

3. 到这时候，我们 Hexo 的的本地搭建可以说是基本完成了，接着再输入以下命令：

hexo g
hexo s

Hexo 的相关快捷指令可以去网站建设中的相关概念中查看，里面还有其他使用的内容。关于 NexT 主题的安装与优化会单独写篇文章讲解，如果对此感兴趣的话，欢迎收藏或订阅。

网址

如图所示，在浏览器中输入http://localhost:4000 ，如要复制请右键复制，使用Ctrl+C将停止 serve。当然如果你不小心使用了快捷键使其停止了，再次输入hexo s运行即可，成品如下：

成品2

将博客托管至GitHub

在 Github 中新建一个仓库
 

hub1

注意:Repository name一定要按照图片上的格式填写，其他的默认即可

用户名

SSH连接
先输入：

cd ~/.ssh #检查本机是否已经存在 SSH 密钥

如果提示：No such file or directory 说明你是第一次使用git。
输入如下代码，生成 SSH 文件

ssh-keygen -t rsa -C ”邮件地址“

然后连续3次回车，最终会生成一个文件在“用户”目录下，打开“用户”目录（C:\用户\用户名.ssh）并找到id_rsa.p ub文件，用“记事本”打开并复制里面的内容，在 Github 主页的右上角进入 Setting -> 左侧菜单栏“SSH and GPG keys” -> New SSH Key -> 填写你获得的 SSH Key。

配置


接下来还需要配置用户名和邮箱：

git config --global user.name “xxx”    #你的 github 用户名
git config --global user.email  “xxx@qq.com”  #你的 github 注册邮箱

上传到 Github

在站点配置文件的_config.yml中填写有关deploy的部分：

deploy:
type: git
repo: https://gitee.com/用户名/仓库名  
branch: master

注意：冒号后面必须有一个空格，否则可能会报错。
2. 我们还需要安装一个插件，在 Git bash 下输入

npm install hexo-deployer-git --save

接着再输入

hexo d

可能会弹出“Windows 安全中心”的窗口，使用 Github 账号密码登录一下即可，登录成功后便会继续上传。
3. 上传成功后来到 Github Page 查看，成品如下：
 

成功


（PS：如果使用 Gitee 还需要在“服务”中开启 Gitee Page，并且还需要根据它的步骤进行身份认证，时间可能会比较久)
5. 点击 Setting -> Page 即可查看自己的站点网址，Github 还有一个好东西就是Enforce HTTPS，可以强制执行 HTTPS 进行加密，具体往下翻就能看到。

尾声

如果还有什么不懂的地方，欢迎在评论下方留言，我一般集中在周末一起回答。关于博客美化的问题，我在这里想应用想起用@dboy大佬的一句话：“你们这些孩子哪里是真为了写博客。你们只是想体会换新工具的愉快感觉，顺便体会一下否定掉旧工具，觉得自己特别的小欣喜。”博客是写作的工具，而内容才更重要。我引用这句话并不是想否定美化的作用，而是我们在美化的时候，不要忘记内容才是我们的根基!