Hexo+Github搭建个人博客

经常遇到这样的问题,学习搭建一个新的环境,在网上查阅很多资料搭成功了,可是第二次搭全忘了还得重复之前的操作,于是决定养成记录的习惯。不光是记录自己的学习笔记,也想与别人分享一些东西,有个博客还是不错的。

我用过几个用于记录的软件或网站,更多的是记录了一些学习笔记,像是印象笔记、CSDN、简书等。这个有一点不好,那终究还是别人的东西,写点学习笔记还行,有的时候自己想写点私人的东西就不是太合适,我想做一个个人博客。


行啊,作为一个程序员那就干吧,不就是写一个博客嘛。干的过程中感受到现实的残酷(尴尬脸),苦于自己是后端程序员,界面做的丑的不能看,挣扎了许久遇到了HEXO。

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

Hexo、jekyll、wordpress、jpress都是快速blog生成工具,我只用过hexo,就说说怎么搭建的(-. -我觉得HEXO还是比较好用的),大家倒可以挑自己喜欢的。


第一次搭建的时候实在windows下搭建的(台式电脑),这导致了一个问题,更新博客得把我的电脑抱着走,因为本地仓库在那啊,后来就决定把博客迁移到服务器(因为迁移,所以博客的一些统计数据清零了),这样只要有XShell到哪都能发博。所以这次所说的博客搭建是基于Ubuntu16.04x64系统搭建的,服务器是在阿里买的,当然腾讯也可以,一直喜欢用Ubuntu,而且阿里云会预装一些软件很方便。


扯了这么多,步入正文吧。

准备工作

安装NodeJS

Hexo是基于Nodejs的,所以当然要装啦。使用apt-get 安装的nodejs版本过老,会导致安装hexo的时候出问题。
官方推荐的安装方法:

curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
sudo apt-get install -y nodejs

安装npm

待会要用它下载hexo

sudo apt-get install npm

安装hexo

一个功能强大的静态网站生成系统

sudo npm install hexo-cli -g

等待安装完成吧。

Github

Github帐号

你这博客是要塞到Github上的,没账号可不行。自己百度注册吧。连接在此:Github

在Github建一个远程仓库

你在本地编辑的博客需要部署到这个地方,当然,这里hexo会帮你一键部署,但你得给它一个仓库。
在你的Github主页点击New repository,到下面这个页面,填写仓库名字,这个不能乱填。
新建仓库
我的Github用户名叫JohnneyAnn,那就得取名JohnneyAnn.github.io,必须!

给你的服务器安装git

首先,确认你的系统是否已安装git,可以通过git指令进行查看,如果没有,输入下面指令进行安装。

sudo apt-get install git

配置git

安装完成后需要配置git,就是配置你的用户名还有邮箱(以我的为例)

git config --global user.name "JohnneyAnn"
git config --global user.eamil "604718423@qq.com"

创建公钥

配置完成后,需要创建验证用的公钥,因为git是通过ssh的方式访问资源库的,所以需要在本地创建验证用的文件。

ssh-keygen -C '604718423@qq.com' -t rsa

RSA是一种加密方式,执行这个命令后会在用户目录~/.ssh/下建立相应的密钥文件。这一步创建会让你填入两次信息,不用管直接回车。

上传公钥

创建完成了,你得让github知道啊。
进入公钥文件夹:

cd ~/.ssh

使用cat命令查看公钥:

cat id_rsa.pub

把这个文件所有的内容复制,接着去github,进入个人主页点击Edit profile之后点击SSH and GPG keys
上传公钥
点击New SSH key,名字随便去,然后把你复制的内容填进去报错就行了。

测试是否连通

ssh -T git@github.com

出现下面这个就ok了。
测试SSH
我这不是第一次,所以只有一行,第一次应该有三行提示,反正出现“Hi 你的名字!”就行了。

开始hexo吧

新建一个博客

选一个文件夹吧,我去的是/home文件夹下

cd /home
hexo init myBlog

hexo init myBlog就是新建一个博客,myBlog是你本地博客的文件夹名,可以随便取名,之后会去下载所需的东西。
下载完成后进入myblog文件夹:

cd blog

文件夹结构如下,简单说下主要文件:
文件结构
_config.yml文件是主要的配置文件,就是你网站的一些信息以及部署的仓库。文件底部可配置要部署的仓库:
文件结构
themes文件夹存放是的是博客主题样式,在知乎上看到一些,可在这里选择知乎:有哪些好看的 Hexo 主题?。我选的是hexo-theme-spfk,去github上下载下来,放到themes文件夹下即可,你可以选择你喜欢的主题。
每个主题的文件夹下也有一个_config.yml配置文件,配置页面的,具体的配置以后有空会单独写一篇博客。

编译博客

可以看到,hexo生成的文件夹离得内容并不是html,所以我们需要编译它(可简写为 hexo g):

cd /home
hexo generate

部署到github

根据_config.yml最后面的配置将博客部署到github上,只要你配置好了hexo会帮你一键部署。
部署之前需要安装hexo-deployer-Git(不然会出现ERROR Deployer not found: git)。
安装:hexo-deployer-Git

npm install hexo-deployer-git --save

好了可以部署了(可简写为 hexo d):

hexo deploy

当然你可以将编译和部署一起来(生成并发布):

hexo generate -d

部署完成后在浏览器输入JohnneyAnn.github.io(输入你实际的名字)即可访问你的博客,当然还是希望你能给先配置你自己的网站,填写这些配置很简单在网上都能够找到方法,后期我会具体写一下,今天这里有点多了。另外,大家肯定不愿意输入这个网址进入自己的博客,所以后面还会告诉大家如何将自己的域名解析到这个地址以及相关的配置,慢慢来。

本地预览

你肯定想修改后先看看效果再部署把(可简写为 hexo s):

hexo server

之后在浏览器输入,IP:4000就可以访问了(IP是你服务器的实际ip)。
crtl+c终止预览。

其他(MarkDown)

Hexo里面的博客都是使用markdown语法的,其实也是个文本文件,后缀名为.md,它是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式,所以使用它来生成html很方便,语法也很简单,这里提供一个链接可以学习一下:简书:献给写作者的 Markdown 新手指南。MarkDown用一般的文本编辑器就可以编写,如果想一边写一边预览,可以尝试下MarkdownPad 2这个软件。



哇,写了这么多,好累啊,下面有打赏(害羞脸)。
推荐阅读:生活:回合肥路上发生的事

Licensed under CC BY-NC-SA 4.0
本文链接:http://JohnneyAnn.github.io/2017/09/09/Hexo+Github搭建个人博客/