搭建自己的github博客

1 什么是 Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

2 开始搭建博客

2.1 前提

电脑安装好 Node 和 Git

2.2 安装

直接用 npm 全局安装（嫌慢的话就用 cnpm 吧）

1	npm install -g hexo-cli

2.3 搭建博客网站

完成 Hexo 的安装之后，就可以执行下面的命令，在指定文件夹内生成系列的网站文件

1
2
3

hexo init folderName
cd folderName
npm install // 安装依赖

注意
好像新版本的 hexo-cli 在初始化项目的时候会自动安装依赖，如下图

鉴于网络因素，直接用npm 安装依赖实在是太慢了，想快一点的同学看到他在装依赖的时候，不要怂，直接就是 Ctrl+C 断了它进程，然后自己进入文件夹用 cnpm install 装依赖。

3 查看效果

运行下面代码，开启博客

1	hexo server

最后打开4000端口就可以看到自己的博客网站啦

4 项目结构

新建个项目之后，指定的文件夹的目录如下：

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

4.1 _config.yml

网站的配置信息，小伙伴们可以在这边配置大部分的参数。

4.2 package.json

这个就不说了，就是这个项目的信息了。

4.3 scaffold 文件夹

模板文件夹。当我们新建文章的时候，Hexo 会根据 scaffold 来建议文件

Hexo 的模板是指在新建的 markdown 文件中默认填充的内容。例如，如果我们修改 scaffold/post.md 中的 Front-matter 内容，那么没一次新建一篇文章都会包含这个修改

4.4 source 文件夹

资源文件夹是存放用户资源的地方。除 _posts 文件夹之外，开头命名为 _(下划线)的文件/文件夹和隐藏的文件将会被忽略（意思就是在这里不要以下划线开头去命名新建的文件/文件夹）。Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件会被拷贝过去。

4.5 themes 文件夹

主题文件夹。Hexo会根据主题来生成静态页面。这里的话，推荐一个主题吧。 next 我也不知道为啥要推荐它，反正就瞅他顺眼+多人用+文档全吧。不过想用其他也随便吧，反正写博客嘛，咱们还是多关注内容，外观的话，顺眼舒服就行了。

5 开始写博客

这个就很简单了，三步走直接搞定啦。

直接找个能写 markdown 的工具就开始写我们的博客了。这里的话我推荐用一下『有道云笔记』吧（『有道云笔记』的工作人员看到了麻烦给点广告费啊~(@^_^@)~），平常就可以在上面做做笔记，写写博客，写完直接导出来一个 markdown 文件。当然其他编辑器一般也是可以方便的写 markdown 的。

『注意：这里有道云笔记有个坑点，不是会员不给 markdown 引入本地的图片，如果想用图片的话只能引入网上外链，这时候就要使用图床了，这边推荐用一下『七牛云』吧，有免费 10 G 的空间可以用。（『七牛云』的小姐姐看到麻烦给我叫个鸡腿），里面还有一些使用技巧，这里就不说了，大家自己再去百度玩一下吧。』

将写完的 markdowm 文件直接丢到 source/_posts 文件夹内，但是为了方便分类和管理自己的文章，在导出的 markdown 文件加入下面这些东西

---
#文章标题
title: flex布局
#文章发布时间
date: 2018-08-26 21:37:55
#文章的标签，可多写几个
tags: 前端布局
#文章分类
categories: flex
---
#下面就是我们的文章正文啦

上面然后就可以在我们的站点中看到我们新增的博客啦。

6 后续

讲到这里，我们的博客已经搭建起来的了，如果还有不明白的东西可以去翻翻 hexo 中文文档。最后咧，虽然博客搭起来了，也能写了，但是不自己配置一下的话，还是有点简陋的，所以下次就来讲讲如何去配置我们的 Hexo 博客吧。