总流程

安装Git Bash / iterm或其他命令行工具
安装NodeJs
安装git
安装hexo并发布一篇博客
生成SSH并添加进github
部署项目到github
修改及配置主题

Hexo

Hexo是一款基于Node.js的静态博客框架。通过它可以把本地的文件生成为本地网页。如果需要放在网上的话，就可以通过 Github Pages 来搭建

使用 Hexo 之前，需要先安装 Node.js 和 Git。

操作如下：

安装 Node.js
- 不在此赘述啦
- 输入 `node -v，查看版本号
安装 Git
- 不在此赘述啦
- 输入 git --version, 查看版本号
  额外说明：如果 Git –version 指令不管用，可能需要到 Environment Variable 那里添加 Path。
安装 Hexo
- 打开iterm
- 输入 npm install -g hexo-cli
- 回车开始安装（可能提示没有权限，sudo解决；如果sudo询问who are you通过chmod解决）
- 输入 hexo -v
- 得到 hexo-cli: 1.0.4 等一串数据
  安装成功
  
  image.png
  
  简单介绍一下
- _config.yml：博客的配置
- db.json：source解析所得到的
- node_modules：依赖包
- package.json：项目所需模块项目的配置信息
- public：存放的是生成的页面
- scaffolds：命令生成文章等的模板
- source：命令创建的各种文章
- themes：主题

创建本地博客
- 在某个目录下创建文件夹 blog
- cd 进入该文件夹
- 输入 hexo init 将 blog 文件夹初始化成一个博客文件夹。
- 输入 npm install 安装依赖包（可选cnpm通过淘宝镜像下载）。
- 输入 hexo g 生成（generate）网页。默认展示Hexo 里面自带了一个 Hello World 的博客页面。
- 输入 hexo s 将生成的网页放在了本地服务器（server）。通过提示访问对应url（ http://localhost:4000/）即可观看效果
  
  image.png
- 按 Ctrl+C 结束。
  
  此时 http://localhost:4000/ 就是无法访问了。
发布一篇博客
- cd进入blog文件夹里，在iterm（命令提示符）中输入 hexo new "My First Post" 创建一个名为“My First Post”的文件；
- 在 \blog\source_posts 路径下，会有一个 My-First-Post.md 的文件。编辑这个文件，然后保存。
- 回到iterm，输入 hexo g
- 输入 hexo s
- 前往 http://localhost:4000/ 查看成果。
- 回到iterm，按 Ctrl+C 结束。

Github Pages

Github Pages 其实本身就是 Github 提供的博客服务。我们在 Github 中创建一个特定格式的 Repository，Github Pages 就会将里面的信息生成一个网页，展示出来。

操作如下：

注册 Github 账号，然后在 Github 中创建一个以 .github.io 结尾的 Repository。
1. Repository name: znlu.github.io
2. 勾选 Initialize this repository with a README
3. Create repository
简单地编辑一下 README.md 这个文档并保存(Commit changes)。
打开网页：znlu.github.io 这里就可以看到 README.md 里的内容了。

注意：创建一个Repository的时候，名称为yourname.github.io, 其中yourname必须是你的github名称，按照这个规则才能构建成功

image.png

生成SSH并添加到github

回到iterm中配置你的github账户信息包括姓名和邮箱
git config --golabal user.name "XXXXX"
git config --golabal user.email "XXXXX"
输入ssh-keygen -t rsa -C "youremail@example.com”生成ssh然后
通过cd ~/.ssh cat id_rsa.pub来获取，并在github上进行配置；

image.png

image.png

新建并在详情里粘贴进去

将本地 Hexo 博客部署在 Github 上

前面两个部分，我们已经有了本地博客，和一个能托管这些资料的线上仓库。只要把本地博客部署（deploy）在我们的 Github 对应的 Repository 就可以了。

操作如下：

获取 Github 对应的 Repository 的链接。

登陆 Github，进入到 znlu.github.io
点击 Clone or download
复制 URL 待用

我的是 https://github.com/ZnLu/znlu.github.io.git

修改博客的配置文件

打开配置文件/blog/_config.yml，滚到最下面

image.png

找到 #Deployment，填入以下内容：
deploy:
type: git
repository: https://github.com/ZnLu/znlu.github.io.git
branch: master
输入 npm install hexo-deployer-git --save 安装 hexo-deployer-git 此步骤只需要做一次。
输入 hexo d
得到 INFO Deploy done: git 即为部署成功

image.png

之前我们创建的 ReadMe.md 会被自动覆盖掉。

查看成果

前往 https://znlu.github.io/ 即可。

使用其他主题

更多 Hexo 的主题看这里

这里以 Next 为例。大概思路就是把整个主题的文件克隆到我们的主题文件夹中。在配置文件中注明使用该主题。

操作如下：

还是回到 iterm。输入 git clone https://github.com/iissnan/hexo-theme-next themes/next

这样，该主题的文件就全部克隆到 \blog\themes\next 下面。
修改博客配置文件
- 打开 \blog_config.yml
- 找到 theme:
- 把 Hexo 默认的 lanscape 修改成 next。即 theme: next
- 找到 # Site，添加博客名称，作者名字等。
- 在 language 后面填入 en 或者 zh-Hans，选择英文或者中文。
- 找到 # URL, 填入 url。比如 url: https://znlu.github.io
重新生成部署即可
- 回到 Git Bash。输入 hexo g -d就可以了。
  
  先把修改的内容生成网页，再部署。
查看成果

前往 znlu.github.io 即可。