---

工具

• Git Account
• Hexo
• Typora

搭建框架

• GitHub Pages

  GitHub Pages是什么：简单来说，GitHub Page是为GitHub Repository服务的，是为了更简明易懂的展示你在Github上所作的projects的网页，就如GitHub Pages官网所说－－“Websites for you and your projects.”

  可能很多人还是不理解为什么要有GitHub Pages这样的一个东西...举个例子来说，你是一个新手，当你浏览Github上某一个大牛的代码时，你看到的是一大堆源码，你肯定没有心情深入的看下去（反正我最开始就是这样😂），那么GitHub Pages就可以允许用户自定义项目首页，用来替换默认的源码列表～因此小白你就可以看的更明白啦～

  一句话来说就是，GitHub Pages可以被认为是用户编写的、托管在Github上的静态网页。

• Hexo

  为什么我们可以用Hexo？因为Github允许通过Github提供的模版站内生成网页，但是也允许用户自己编写网页然后上传，但这种上传并不一定是简单的上传，也可以通过Hexo、Jekyll等静态站点生成器的再处理

• 此框架的优缺点：

  优点：

  1. 免费＋无限流量

  2. 享受git的版本管理功能

  3. 你只要用自己喜欢的编辑器写作即可，其他事情都一概由Github处理

  缺点：

  1. 有一定技术门槛，你必须懂git和网页开发
  2. 它生成的是静态网站，添加动态功能必须使用外部服务
  3. 不适合大型网站，因为没有用到数据库

  －－综合来看，它不失为搭建中小型Blog或项目主页的最佳选项之一

  ​
  <u>总结：你接下去要搭建的个人博客将是一个基于Hexo，托管在GitHub，写作用MarkDown的超高效率工具👊</u>

  ​

搭建步骤

1. 使用GitHub Pages建站

   请按照官网首页的教程来进行设置，只需操作官网教程的前两步，也就是创建仓库和克隆仓库到本地

   • 创建仓库：新建的仓库的username.github.io的username一定与自己account的username一致
   • 克隆仓库：目的是为了让自己未来的博客和代码处在git管理之下，所以我们要把刚刚在Github上博客项目拉到本地，代码如下

   $ git clone https://github.com/username/username.github.io
   

   （请自行替换你的username)

2. 安装Hexo

   安装Hexo的步骤：

   1. 安装Git

   2. 安装Node.js，需要先安装nvm（Node.js版本管理器）

      官网教程在这里，但是官网通过curl安装nvm的命令已经失效，下面我介绍一下用Homebrew进行安装的方式：

      # 通过Homebrew安装nvm
      $ brew install nvm
      
      # 创建nvm的工作目录，为了可以让你直接在shell使用nvm指令
      $ mkdir ~/.nvm
      
      $ vi ~/.bash_profile
      # 在.bash_profile文件里添加以下两行
      # export NVM_DIR=~/.nvm
      # . $(brew --prefix nvm)/nvm.sh
      
      # source .bash_profile
      $ . ~/.bash_profile
      
      # 验证nvm是否已经安装
      $ nvm help
      
      # 因为我们是通过homebrew安装的，所以不需要像官网说的要重启terminal，执行以下命令来安装Node.js
      $ nvm install stable
      

   3. 安装Hexo

      $ npm install -g hexo-cli
      

3. 编写博客，发布

   1. 创建博客

      $ hexo init username.github.io
      # 在从git克隆到本地的仓库的目录下初始化hexo，在我的电脑里就是cd ~
      

   2. 更改配置

      $ cd username.github.io
      $ git clone https://github.com/iissnan/hexo-theme-next themes/next
      

      这里安装的是主题Next（官方文档在这）更多主题

      1. 进入username.github.io/_config.yml修改基础配置：(请确保每个字段都缩进一个空格，因为YAML依靠缩进来确定元素间的从属关系）

      title: Luke's Blog    //你博客的名字
      author: Luke  //你的名字
      language: zh-Hans    //语言 中文
      theme: next   //刚刚安装的主题名称
      deploy:
       type: git    //使用Git发布
       repo: git@github.com:username/username.github.io.git      
      

//刚刚在git创建的仓库，这里使用ssh不需要输入账户密码（前提是配置好了Github的ssh），使用https需要输入账户密码，我已经配置过了ssh，所以这里使用ssh
branch: master
```

   2. （optional）进入username.github.io/themes/next/`_config.yml`中修改主题配置文件（参见[官方文档](http://theme-next.iissnan.com/getting-started.html#theme-settings)）

3. Markdown写文章

  将你写的文章存到username.github.io/source/_posts的目录下就OK了，Markdown编辑器推荐[Typora](https://typora.io/) - "Live Preview"

4. 在本地环境进行测试

   ```
   $ hexo s
   # 测试服务启动，在浏览器中输入http://localhost:4000进行访问
   ```

5. 安装[hexo-deployer-git](https://github.com/hexojs/hexo-deployer-git)自动部署发布工具

   ```
   $ npm install hexo-deployer-git --save
   ```

6. 发布

   ```
   $ hexo clean && hexo g && hexo d
   # hexo clean命令是为了清除缓存文件 (db.json) 和已生成的静态文件 (public)。

在某些情况（尤其是更换主题后），如果发现您对站点的更改无论如何也不生效，您可能需要运行该命令。

hexo g是为了生成静态文件，hexo d用于部署网站。

   ```

   <u>***以后每次写博客，只要重新进行三四五六步的操作就OK啦~***</u>

7. 在浏览器中输入https://username.github.io，验收你的博客！

8. 更多配置与插件，敬请期待😆