利用Hexo+Github完成搭建个人博客(1-搭建)

前言

        ​最近在学java框架,想利用博客记录下来学习过程以及学习成果,同时也算为自己做一个笔记,平时都是使用Xmind思维导图做笔记,但是在手机上不太方便回顾。本来是打算自己用java写一个博客系统出来,一来记录自己的学习路程,二来可以作为毕业设计,不过考虑到打算重构之前的在线购物系统,以及水平能力有限,便放弃了这个想法。好在无意中接触了hexo,首先hexo的风格吸引了我,画面简洁。其次是功能强大,基本上该有的功能都有。再加上正在学习使用MarkDown书写工具,以及接触GitHub,可以说是各种机缘巧合。正好进行一个系统的全面的学习。

​        我分别在不同的电脑上搭建了两次博客,第一次是笔记本(win10),可以说是磕磕碰碰,最后勉勉强强算搭上了。第二次是在第一次记录的基础上,使用腾讯云服务器(win server 2012)进行搭建,整个过程都非常顺利,这个博客便是第二次搭配记录。跟着这个步骤,最多30分钟便能搭起一个基础的博客。不过基础的博客肯定不能满足后续的要求。

        ​在下一篇学习页面设置和写/发博客。提前预览(https://licqing.github.io/)

1.概述

​        Hexo官网:A fast, simple & powerful blog framework,即:快速、简洁且高效的博客框架。基于Node.js 所带来的超快生成速度,让上百个页面在几秒内瞬间完成渲染,只需一条指令即可部署到 GitHub Pages, Heroku 或其他网站,Hexo 拥有强大的插件系统,安装插件可以让 Hexo 支持 Jade, CoffeeScript。    

        也就是说,只需要30分钟左右就可以搭建一个属于自己的个人博客。同时又有丰富的插件可以使你尽可能的完善自己的博客细节。利用GitHub的git pages,可以托管我们的静态网页,而且可以自定义域名(参考中有)。等博客搭建完毕,我们就只需要写博客内容了。




2.搭建环境

2.1 Node.js

        一个JavaScript运行环境,我们使用它来生成我们博客的静态页面。如果不确定自己电脑上是否安装了Node.js,可以在cmd命令行下   运行

npm -v

​     运行结果如下表示未安装:


未安装node.js

​         接下来我们需要去官网下载,进行安装。如果版本过低可能会导致部分功能丢失或者配置方法不同,建议6.0以上。

​         安装完成之后我们再运行cmd命令会显示如下结果


安装成功

         如果还是提示非命令,有可能是node没有加到环境变量中去,在环境变量的path中,加上刚刚的安装目录。(如我的安装目录:C:\Program Files\nodejs\)有自定义目录需要修改成自定义目录。

2.2 Git 环境

​         接着我们就是需要安装Git了,同时我们先查看一下电脑是否安装了git,在cmd中执行

git --version

​         如果显示为非命令,则需要我们下载安装,可以上官网,如果下载较慢的话,也可以上某度云进行下载,安装过程基本上选择默认的就好了。建议版本2.0以上

        ​ 验证是否安装成功同上,不过这次需要加的环境变量则是Git安装目录下的cmd,(如我的:C:\Program Files\Git\cmd)

2.3 Git hub

        Git-hub注册过程就不多赘述,基本上不会有什么问题。重要的是需要建立存放代码的仓库和添加SSHkey保证本地能正常上传代码到github。

1)建立仓库:登陆GitHub之后,在点击右上角的“+”号,选择 new repository


新建仓库

        ​ 在 Repository name中填入"用户名.github.io"。用户名就是GitHub的用户名。


我的已经创建,所以会提示

​         最后点击create repository 这一步就ok了。

        ​ 2)第二步,我们来添加SSHkey,确保我们本地有权限能够提交代码到github。首先我们仍然测试看看本地能否存在key(第一次当然是没有,不过为了和后面出现对比,我们可以先测试一下)。首先在桌面右击 -> 选择Git Bash Here调出git命令台。输入下面命令:

ssh -T git@github.com


测试ssh

         如果提示< Are you sure you want to continue connecting (yes/no)?,输入yes

​         这就是本地没有权限连接的,需要我们创建SSHkey。我们继续输入以下命令

ssh-keygen -t rsa -C "注册github的邮箱"

​         三次回车之后,会出项下面的结果:


生成sshkey

​ 然后git会自动在c盘用户下面的当前用户文件夹新建一个.ssh文件,里面有一个  id_rsa.pub  文件。使用记事本打开之后,复制里面的内容。


存放sshkey的路径

​ 我们在本地生成好key之后,需要添加到github上。在GitHub网页进入个人设置选择SSH and GPG keys,新建一个ssh key:


个人设置


新建key

​         把复制过来的内容粘贴在key框,上面的title可以写,也可以不写,不写会默认使用邮箱。如果为了区分多台客户端,可以填写区分一下


​         点击Add SSH key之后,输入密码确认,跳转到sshkey页面,你会发现刚刚添加的key已经在里面了。到这里我们就已经添加成功了,于是我们再测试一下连接,出现以下结果就是正确的。


连接成功

        ​ 然后再运行以下命令,来让git记录我们的身份

git config --global user.name "GitHub账号"

git config --global user.email "注册邮箱" 

​         到这里我们的准备工作就已经结束了。下面就开始搭建博客,如果到这里就放弃,那就前功尽弃了(加油)。




3.搭建博客

3.1 安装hexo

        新建一个文件夹,用来存放我们的博客文件,右键 -> git bash执行以下代码:

    npm install -g hexo


安装hexo

        可能会要一点时间,如果没有报错(ERR),说明安装问题。

3.2搭建博客

        依次运行以下代码。‘#’后面是注释

hexo init  初始化hexo环境

hexo g  生成静态页面

hexo s  开启本地服务


        执行完最后一条命令,会出现如上结果。从图中我们也得知,在浏览器输入< http://localhost:4000/ > 就可以浏览我们的博客了,然后按ctrl + c 结束本地服务。生成的静态文件就在public文件夹中。


        至此我们就快大功告成,把代码同步到github让它帮我们管理代码。同时,我们也可以输入之前我们定义的仓库名,进行外网访问。不过,我们还要进行最后一步配置。

3.3配置并同步代码

        用文本文件打开刚刚存放博客文件的目录中的 _config.yml 文件,然后拉到最后找到deploy:


按照如下进行配置,冒号后面一定要跟空格:

deploy:

  type: git

  repository: git@github.com:GitHub用户名/GitHub用户名.github.io.git

  branch: master

​ GitHub用户名就是刚刚新建仓库的名称。保存之后,再依次运行以下命令:

npm install hexo-deployer-git --save  安装插件

hexo d  上传代码


        上传成功之后,然后我们可以到我们GitHub的仓库下看看,是不是把本地的文件上传过去了。然后我们利用其它的浏览器,或者客户端输入 刚刚定义的仓库名称 < https://licqing.github.io/ >就可以访问你的博客了。


​         搭建博客的结束,正是入门博客的开始。hexo文档。后续将配置博客样式和书写博客。

4.途中遇见的问题

        这里分享第一次搭配遇到的问题和最后怎么解决的吧。

* hexo init 命令 : 错误 conmand not found 。应该是hexo未配置进环境变量,我们找到node_modules文件夹,这时我们发现里面有很多文件夹,找到hexo文件夹,这里我们可以看到一个bin文件夹,进到bin。然后把这个目录加到环境变量path中去。

* hexo init 命令 : 错误 FATAL not empty。存放博客的地方一定是需要空文件夹。注意检查空文件夹。

* hexo g 命令 : 错误 FATAL bad indentation of a mapping entry at line 82, column 13。 _config.yml文件冒号后面没有跟空格

        还有一些错误大致是连接git的时候没有配置用户名和shh之类的。

5.参考(可配置域名)

//www.greatytc.com/p/05289a4bc8b2

https://www.cnblogs.com/liuxianan/p/build-blog-website-by-hexo-github.html

https://hexo.io/zh-cn/docs/writing

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

推荐阅读更多精彩内容