使用github+Hexo创建自己的博客

这周Web实验课,老师让我们用git+hexo创建自己的github博客,要求在发布的博客界面中显示至少两张图片,图片一张引用方式为绝对路径,另一张引用方式为相对路径。因此,没错,这次的目的就是掌握Web项目中相对路径和绝对路径的问题,我真是拜了佛冷。
使用github+Hexo创建自己的博客
不过要不是这次实验,才疏学浅的我还真不知道有git这么一个强大的工具,Git是一个目前世界上最先进的分布式版本控制管理工具(没有之一),它可以让你更好的管理你的程序,比如你原来提交过的内容,以后虽然修改了,但是通过git这个工具可以轻松的revert到你之前未修改的时候,和Intellij Idea—>local history的作用差不多。以前只知道github是一个网站,里面有很多大牛的开源项目,你可以随意的看到这些大牛写的程序,但还不知道github是利用git实现的。花了一天的时间,简单的了解了一下git的基本命令,以及如何用github+hexo实现一个博客。

首先由于本人的才疏学浅,还不知道git和github的区别,于是我首先百度了git与github的区别,见:https://blog.csdn.net/csdn_zad/article/details/80158303。
然后又从这篇博客中,机缘巧合的看到了廖雪峰老师的git教程:(其中有git的基本使用命令,如何从github的远程库和本地的git仓库进行连接):
https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000
这下就对git有了简单的了解,发现它是以后进入公司进行团队合作的一个有力工具,尤其是它分支管理。由于自己目前还是孤军奋战,还不能深入体会到git这个工具的强大之处,请自行了解一下。

接着我们来进入正题:
第一步:环境搭建
安装git(因为要给gitHub上传文章) 官网:http://git-scm.com
安装Node.js(因为Hexo是基于Node.js开发的) 官网:https://nodejs.org/en/

第二步:安装和配置Hexo
创建一个Hexo文件夹,在此文件夹中打开Git Bash,使用npm安装Hexo,键入命令即可:

npm install -g hexo-cli

如果执行这条命令时长时间未成功,那么请先使用下面的命令将npm镜像源更改为国内的镜像,再执行上面的安装命令,因为国外的镜像源很有可能被墙了。

npm config set registry https://registry.npm.taobao.org

然后依次执行下面的命令进行hexo的初始化

hexo init

出现下图内容则表示初始化成功:
使用github+Hexo创建自己的博客
接着安装依赖文件:

npm install

最后就是启动本地服务了:

hexo server

打开浏览器输入http://localhost:4000出现下图证明Hexo安装成功
使用github+Hexo创建自己的博客

第三步:github注册与配置
github官网(http://www.github.com)
①注册账号,创建一个存放博客文章的仓库。库名为:yourname.github.io,其中yourname必须和前面的Owner一致。
②添加SSH KEY到Github:
首先打开本地git bash,使用如下命令生成ssh公钥和私钥对

ssh-****** -t rsa -C '[email protected]'   //然后一直回车即可(单引号里的参数为你的邮箱地址)

现在,已经生成了ssh key,其存放路径为:c:/Users/你电脑的用户名/.ssh/下。
然后复制SSH KEY到github中
到目录下找到.ssh文件夹,找到id_rsa.pub文件,复制里面的内容,登录GitHub系统,点击账号的Settings,点击“SSH and GPG keys” –> “New SSH key”,title标题不用写,Key中拷贝id_rsa.pub文件的内容。
③接下来配置账户:

$ git config --global user.name “your_username” #设置用户名
$ git config --global user.email “your_registered_github_Email”

④测试SSH KEY是否设置成功

$ ssh -T [email protected]

接下来会返回一些信息,并需要你输入一次yes,若生成ssh key时设置有密码则还会让你输入生成ssh key时设置的密码。
Hi xxx! You’ve successfully authenticated, but GitHub does not provide shell access. 出现这句话,说明设置成功。

⑤将本地Hexo项目托管到Github
首先修改全局配置文件_config.yml:

在Hexo文件夹中有一个_config.yml文件,使用编辑器打开:
注意:配置文件中每个字段后面的冒号是英文格式的,且在其后要加一个空格再写值
编辑最后面的deploy属性,加入代码:
type: git
repository: [email protected]:你的Github用户名/你的Github用户名.github.io.git
branch: master

type使用是git。

repository属性改成你的刚才创建仓库git地址。

分支branch填写master。

然后安装hexo-deployer-git插件

$ npm install hexo-deployer-git --save

最后部署到GitHub上就行了:
执行命令$ hexo deploy //简写为hexo d

同样的出现下图,则说明配置成功
使用github+Hexo创建自己的博客

报错的话,自己复制错误,百度谷歌吧。没报错,打开自己的博客网站就可以看到自己的主页了。
最后,我们来看看Hexo文件夹:
里面source—>posts有个hello—world的MD文件(MardDown文件),hexo就是将这个文件部署到了gitHub上。当然,你可以自己编辑MD文件,然后部署到GitHub上。
Hexo文件夹中还有一个themes文件夹,里面时hexo的主题,默认安装hexo的加载了一个默认主题landscape,可以从github上下载其他主题,通过yml配置文件就行设置。

参考网站:
https://gomwan.github.io/2018/03/11/Github注册与配置/
https://gomwan.github.io/2018/03/11/hexo配置/
https://www.jianshu.com/p/863f3f2d1733