Steve's Blog

Talk is cheap, show me the code.

0%

使用Hexo+github搭建个人博客

环境搭建

使用Hexo+github搭建个人博客。

由于本文只是一个对于搭建博客过程的记录而不是教程,所以仅供参考。想要详细的教程请参考参考文章中的第一篇。
需要的具体环境有:
Node.js
Git
GitHub账号
Hexo
简单介绍一下,Node.js 是一个Javascript运行环境,是一个基于Javascipt,性能十分优秀的前端框架。Git就不说了,是一个分布式的代码托管仓库。程序员必备工具,如果你还不会,赶紧去学,这里有篇很好的教程 廖雪峰的Git教程

而GitHub是一个基于Git的线上代码托管仓库,你可以把你的代码上传到网站服务器进行托管。GitHub在这里充当的角色是服务器,通过访问你的线上仓库你就可以使用个人博客了~
当然只有这些还不够,之后是Hexo的安装,Hexo是一个开源的静态博客生成器,基于Node.js开发。安装结束后就可以进行博客的写作了。

个人博客的维护

这个部分可以分为两个部分:1.主题更换;2.发布文章。

主题更换

主题就是基于个人博客的页面布局等具体结构的封装文件。每个不同的主题有不同的页面布置,操作方式等。
我用的主题是cafe,将其下载下来放到Hexo安装目录下themes文件夹中,例如我的Hexo安装位置是G:\Blog,cafe的位置是G:\Blog\themes\cafe。
在Hexo中有两份配置文件,名称均为 _config.yml,一份位于站点根目录下,主要包含Hexo本身的配置;另一份位于主题目录下,这份配置由主题作者提供,主要用于配置主题相关的各类选项。下面举例说明一下:
在G:\Blog下的 _config.yml是整个网站的配置文件,而在G:\Blog\themes\cafe\下还有一个 _config.y文件,这个文件是cafe主题的配置文件
主题配置文件由主题作者提供,如何进行配置,主题作者都会在README中详细说明,例如主题cafe的 cafe的README文件,故在此不再详述。
网站配置文件是通用的。其中一般包括网站名称、作者(你的名字)、语言、友情链接等设置。其中重要的是两个:theme和repo(线上仓库的位置)。例如我的是:
Hexo配置
其中theme是cafe,这样我就可以用cafe主题了。而deploy中type为git,repo为我自己在github中的io仓库。这样主题设置完成了。具体设置参见参考文章的第一个连接,其中有详细说明。

发布文章

新建一篇博客:
打开cmd(我用的是Windows,Linux用户直接Ctrl+Shift+T打开terminal),进入到Hexo的安装目录下,输入

1
hexo new post "article title"

其中article title 是你的文章题目。这时候在安装目录下的source_posts文件夹下将看到 article title.md 文件,用MarkDown编辑器(我用的是MarkdownPad 2)打开就可以编辑文章了。文章编辑好之后保存,可以先预览一下我们写好的文章。运行命令

1
2
hexo g	//部署文章
hexo server -p 4000 //打开本地server

第二句执行完效果如图

![hexoServer](https://github.com/StephenHuge/Markdown_Pic/blob/master/我的Git教程/hexoServer.jpg?raw=true)

第二句的操作的作用是打开本地的server。其中-p为设置端口(port)操作,数字4000为默认端口,如果端口4000被占用也可以用别的数字。
之后通过访问 http://localhost:4000 即可预览我们部署好的文章。如果有排版或内容问题则继续修改,在本地修改好之后,执行 hexo g 重新部署。确认无误后,在远程生成文章

1
hexo d	//生成

部署成功后访问你的远程地址,例如我的是https://stephenhuge.github.io/,打开就可以看到生成的文章了。
当然如果不需要在本地预览时,文章写好之后可以直接在git bash执行
1
hexo d -g //在部署前生成

这句等价于

1
2
hexo g	//部署	
hexo d //生成

之后访问远程地址也能看到生成好的文章。
ps:如果提示

1
deployer not found:git

则是没有安装扩展,输入

1
npm install hexo-deployer-git --save

即可。

参考文章

[1] 安装教程 手把手教你用Hexo+Github 搭建属于自己的博客

[2] 主题配置 hexo系列教程:(三)hexo博客的配置、使用

[3] 遇到各种问题 使用localhost:4000访问本地blog一直无响应

[4] 遇到各种问题 网站处于联机状态,但未对连接尝试做出响应

扩展阅读

Jekyll搭建个人博客