hexo+Github搭建博客

1、hexo是什么:

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

hexo文件目录结构

2、搭建流程:

  • 配置搭建环境(含node.js、Git和github账户的申请配置)
  • 安装hexo
  • 配置hexo
  • 将hexo与github page联系起来
  • 发布文章
  • 主题配置
  • 博客优化
  • 绑定域名

3、node.js 安装

[Windows Installer 64-bit](https://nodejs.org/dist/v4.2.3/node-v4.2.3-x64.msi)  

[Windows Installer 32-bit](https://nodejs.org/dist/v4.2.3/node-v4.2.3-x86.msi)

一路保持默认即可,安装结束后,检查组件是否安装好,同时按win(windows键)+R键,输入cmd(或者在开始输入CMD,右键管理员允许),打开命令窗口。
windows运行界面

在命令窗口输入

node -v  
npm -v  

结果如下图,则表示node.js安装成功

4、 安装Git:

Git官网地址

安装默认即可,要注意的是在选择PATH选项时,建议按照下图选择,这样会使得Git在安装的时候会在系统PATH中加入Git的路径,可以直接调用CMD。

检查安装是否正确,输入以下命令:

git --version  

5、github账户注册和配置:

官网地址

输入自己的用户名、邮箱、密码,注册完毕后,一定要去自己注册的邮箱中确认,否则不能使用gh-page。

创建代码库:

登录进去后,点击右上角的+号,选择New repository:

Repository name(仓库名字)一定要填与自己github账户名一样的名字,不然后续会有些麻烦,此处因为我已经创建了。

代码库设置

进入你的仓库后,选择setting,如下图所示:

下拉找到Github Pages,找到Source,选择master branch,再点击save保存,过一会会生成一个github pages网址。

6、 安装配置hexo:

安装hexo

打开git brash或者cmd控制台

  • 安装hexo依赖
npm install -g hexo-cli
  • 安装install 组件
npm install hexo --save  
  • 查看版本
hexo -v  

如下图所示,则表示安装成功

配置hexo

  • hexo初始化

使用命令切换到你需要存放本地仓库的磁盘,然后在磁盘根目录新建文件夹(本地仓库)。
假如你在E盘根目录新建一个文件夹(**此处文件夹名必须和你的github新建的仓库名(Repository name)一致)

E:    #切换到E盘
hexo init xx.github.io     #新建本地仓库  

初始化完毕后,在E盘根目录会看到一个xx.github.io的文件夹,这就是你的本地仓库。

  • 安装npm包
npm install  
  • 生成
hexo g   #hexo g 是hexo generate的简写  
  • 启动服务预览
hexo s   #hexo s 是hexo server的简写  

上述也可以写成

hexo s -g  

当完成上述操作后提示如下,即可访问http:localhost:4000/

INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.  

填坑

理论上到此处就可以访问http:localhost:4000/,但是事与愿违,4000端口往往被占用,导致不能访问,不过官方也给出了解决方法:https://hexo.io/zh-cn/docs/server.html#自定义-IP
hexo3.0后的版本,由于服务器是独立成个别模块,所以首先需要安装hexo-server

npm install hexo-server --save
 

安装完成后,输入以下命令以启动服务器,您的网站会在 http://localhost:4000 下启动。在服务器启动期间,Hexo 会监视文件变动并自动更新,您无须重启服务器。

hexo server  

再更改端口

hexo server -p 5000 #更改为5000端口  

在浏览器输入http:localhost:5000/即可访问

7、将hexo和github关联起来:

  • 配置git个人信息:

第一次使用git的话,需要配置用户名与邮箱地址:

git config --global user.name "XXX"
git config --global user.email "XXX@XXXcom"  

检查是否有SSH,没有的话需要在github新建

cd ~/.ssh   #检查
ls          #查看  

如果有的话,会有两个文件,如下图:

  • 生成新的密钥
ssh-keygen -t rsa -C "XXX@XXXcom"  
  • 将SSH Key 添加到ssh-agent
eval $(ssh-agent -s)  
  • 查看SSH返回路径
ssh-add ~/.ssh/id_rsa  

添加成功,会返回路径

Identity added: /c/User/Administator/.ssh/id_rsa (/c/Users/Administator/.ssh/id_rsa)  

根据地址找到这两个文件

  • 把SSH添加到github上

打开github,右上角选择setting,再选择SSH and GPG keys,选择New SSH key(添加SSH key),将id_rsa.pub的文件拷贝到key中,最后Add SSH key即可。

  • 验证SSH
ssh -T git@github.com  
  • 配置Deployment

找到本地仓库(xx.github.io),打开找到_config.yml文件,(建议使用Notepad++编辑),再找到deploy,配置如下:


git@github.com都是一致的,后面的则分别是github帐户名、仓库名
图上coding地址为使用coding加速后才添加的,此处可不添加
修改完毕后保存,并使用命令保存,否则报错:

npm install hexo-deployer-git --save  

8、发布文章 :

  • 新建一篇名为article title的博客:
hexo new post "article title"  

在我的电脑的目录下 E:\xx.github.io\source\ _posts 将会看到 article title.md 文件(打开.md文件,windows推荐使用markdownpad2)

  • 生成部署:
hexo clean  
hexo g                 #生成
hexo d                 #部署  
hexo d -g            #也可以只有一步,在部署前先生成

部署完毕后即可访问博客:https://xx.github.io/

9、主题配置:

详情请见这篇文章:NexT主题配置

10、博客优化:

由于诸多原因导致国内访问github速度很慢,有时更新一篇博客,或者改动一些配置,需要很长时间才能加载出来,所以我们可以对博客进行一些优化,提高加载速度。
详情请见下面这篇文章:

//www.greatytc.com/p/414ca84237ea

11、绑定域名:

一般使用hexo搭建博客后,博客地址大多为:https://xx.github.io之类,一来是不好听没有个性,二来是不方便管理,三是速度慢。

购买域名

比如国外的:godaddyName等;国内的:或新网万网耐思尼克……
我是选择的阿里云(万网),以下介绍的也是阿里云的域名:
输入你 想要的域名,选择未注册的域名,有不同的套餐,一年几年。

购买域名
  • 域名解析
    管理控制台

    域名解析

首先需要进行域名实名认证,未认证不能使用,图中域名状态显示未认证,实名认证很简单在这不多赘述

点击解析,进行解析:

解析设置

点击添加解析,添加两个A记录类型,主机记录都为@,线路默认,记录值为github提供的2个ip:(192.30.252.153、192.30.252.154),再添加一个CNAME类型,主机记录为www,记录值为你的博客地址xx.github.io,最后保存即可。

  • 创建CNAME文件

上述设置完毕后,在本地仓库xx.github.io目录下的source文件夹中新建CNAME文件,不带任何后缀名,然后再其中放入你的域名地址(xxxx.com),最好写xxx.com而不是www.xxxx.com,这样使用xxx.com或者www.xxx.com都可以访问。

至此博客算是搭建完毕,这只能算是一个比较粗略的博客,还有很多需要去配置改进的;
我查阅了不下十篇文章,其中坑太多,新手容易入坑,为此我把一些该注意的都列举出来,以防止掉坑里。

参考文章:
hexo入门学习(五):绑定独立域名
少撸两局教你搭个博客玩
手把手教你用Hexo+Github 搭建属于自己的博客

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 210,978评论 6 490
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 89,954评论 2 384
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 156,623评论 0 345
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,324评论 1 282
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,390评论 5 384
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,741评论 1 289
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,892评论 3 405
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,655评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,104评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,451评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,569评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,254评论 4 328
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,834评论 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,725评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,950评论 1 264
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,260评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,446评论 2 348

推荐阅读更多精彩内容