打造属于自己的博客系统

前言

以前写博客时用的是CSDN、 博客园、新浪博客之类的博客系统,这类博客系统好处就是什么都弄好了,自己只需要写文章即可,但是一类大缺点就是广告太多,打开一篇文章,基本满屏都是广告,让人看下去的愿望都没有,所以一直打算先搞个自己的博客系统,专门记录一下学习过程。

我的博客链接:https://crazyandcoder.work/

在这里插入图片描述

正文

关于hexo的简介请看官网介绍《详细介绍

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

而我们要做的就是现在本地写好文章,然后解析成HTML文件,最后再部署到github上面显示出来,总的来说,过程还是蛮简单的,而且步骤也简单,只需要几条命令即可,下面我们来具体实现。

搭建过程

配置

首先需要下载一些配置软件:

  1. hexo,生成本地的文章
  2. node.js ,用来生成静态页面的
  3. git ,把本地的hexo内容提交到github上去.
  4. 申请github账号 ,部署到博客
  5. 申请 阿里云 域名,绑定github.io

注意: 这里面申请的github账号的名称就是以后你博客的域名,所以一定要起一个有个性的名字。

安装node.js和git没有啥好说,直接下载软件安装即可,傻瓜式安装。

下面来说一下安装hexo,需要用到以下的命令:

npm install -g hexo-cli

正常情况下,输入以上命令即可安装成功,测试一下,输入命令,显示版本号即表明安装成功,如果中间过程中出现任何问题,请自行百度解决

C:\Windows\System32>hexo -v
显示内容:
Native thread-sleep not available.
This will result in much slower performance, but it will still work.
You should re-install spawn-sync or upgrade to the lastest version of node if po
ssible.
Check C:\Users\AppData\Roaming\npm\node_modules\hexo-cli\node_modules\hexo-
util\node_modules\cross-spawn\node_modules\spawn-sync\error.log for more details
hexo-cli: 1.0.1
os: Windows_NT 6.1.7601 win32 ia32
http_parser: 1.0
node: 0.10.29
v8: 3.14.5.9
ares: 1.9.0-DEV
uv: 0.10.27
zlib: 1.2.3
modules: 11
openssl: 1.0.1h

运行博客系统

以上软件安装好,我们就已经生成了一个博客系统,只不过这是最基础也是最简洁的博客系统,我们来测试一下。

在本地磁盘新建一个目录,这以后就是我们写博客的地方啦譬如我在E盘新建一个hexo目录,同时进入到该目录下

C:\Windows\System32>cd E:\hexo

进行初始化一下:

C:\Windows\System32>hexo init
显示内容:
E:\hexo>hexo init
Native thread-sleep not available.
This will result in much slower performance, but it will still work.
You should re-install spawn-sync or upgrade to the lastest version of node if po
ssible.
Check C:\Users\liji\AppData\Roaming\npm\node_modules\hexo-cli\node_modules\hexo-
util\node_modules\cross-spawn\node_modules\spawn-sync\error.log for more details
INFO  Cloning hexo-starter to E:\hexo
Cloning into 'E:\hexo'...
remote: Counting objects: 53, done.
remote: Total 53 (delta 0), reused 0 (delta 0), pack-reused 53
Unpacking objects: 100% (53/53), done.
Checking connectivity... done.
Submodule 'themes/landscape' (https://github.com/hexojs/hexo-theme-landscape.git
) registered for path 'themes/landscape'
Cloning into 'themes/landscape'...
remote: Counting objects: 724, done.
Rremote: Total 724 (delta 0), reused 0 (delta 0), pack-reused 724eceiving object
Receiving objects: 100% (724/724), 2.51
Resolving deltas: 100% (381/381), done.
Checking connectivity... done.
Submodule path 'themes/landscape': checked out 'decdc2d9956776cbe95420ae94bac87e
22468d38'

这样就生成了一个默认的博客系统。
我们来查看一下默认的博客系统是什么样子,
输入以下命令:

E:\hexo>hexo generate
等待几秒结束后,输入
E:\hexo>hexo s
成功后会显示:
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

我们在浏览器上面输入以上地址 http://localhost:4000/ 我们就会打开一个本地的HTML页面,这就是我们的博客原型,

image

不过这只能在本地访问,别人还是不能访问到,要想别人也能看到的话,接下来我们就要发布到github上面去。

发布到GitHub

那么问题来了,我们该如何发布到github上面呢?

1、首先我们,需要在github上面新建一个账号,点击进入github官网注册一个账号,这个账号就对应我们的博客访问地址,譬如,我注册的账号就是crazyandcoder,那么我的博客访问地址就是http://crazyandcoder.github.io/

2、新建一个repository,输入名字。


在这里插入图片描述

3、配置我们的hexo init生成的配置文件

在这里插入图片描述

4、在最后面添加我们刚刚新建的repository,里面的test就是我们刚刚创建的repository


在这里插入图片描述

5、最后发布

hexo deploy

测试,在浏览器中输入博客地址 http://账户名.github.io/ 就可以进行测试了,别人也可以访问了。

总结:

以后我们进行写文章到发布到我们的博客系统上去总共要经历一下几个步骤:

  1. hexo new ”postName” #新建文章
  2. hexo new page ”pageName” #新建页面
  3. hexo generate #生成静态页面至public目录
  4. hexo server #开启预览访问端口(默认端口4000,’ctrl + c’关闭server)
  5. hexo deploy #将.deploy目录部署到GitHub

其中第一步在本地创建文章,会在本地博客目录下生成文章。


在这里插入图片描述

然后我们就可以打开文件,在里面写文章。

写好文章后,我们需要将其生成HTML文件,如何生成,这就需要使用第三步的命令:

hexo generate

生成文章后,我们首先可以在本地预览一下,如果没有什么问题的话可以发布到github上面。使用以下命令:

hexo depoly

等待几秒即可发布完成

博客主题选取

以上就是用hexo + github搭建自己的博客系统的内容。最后附上一些常用的hexo主题,供大家自己选择:传送门+hexo主题

绑定域名

我自己用的域名是阿里云域名,很便宜,一年不到10块钱,很划算,接下来我们需要将上面http://账户名.github.io/ 绑定自己申请的域名上面,这样我们就可以直接访问域名就可以查看博客了。

购买域名

域名的话,我推荐阿里云,毕竟大公司,靠谱。我们购买域名的时候,首先需要查询一下,这个域名有没有被别人注册过。域名查询,到这个网址上面查询一下,如果没有被注册过,即表明你可以申请使用的。譬如,我们搜索jackboyblog.tech这个博客域名,没有被注册,你就可以购买,资金充足可以购买顶级域名,不然的可以选择一些普通的,譬如tech.work等。我自己的就是work,很便宜,才几块钱一年。

在这里插入图片描述

域名解析

(1)在你的github博客仓库下创建一个名字为 CNAME的文件,在其中填写你的域名地址 ,注意 :不要包含Http://和www

在这里插入图片描述

注意: 不要包含Http://和www

在这里插入图片描述

(2)进入你的博客github仓库 ,点击settings,查看Custom domian这一项是否已经填写好并保存

在这里插入图片描述

(3)解析你的域名,你可以在终端中ping一下你的 github博客的地址,得到ip


在这里插入图片描述

(4)进入域名解析控制台,点击解析,点击 添加纪录 ,记录类型选择A,主机记录填:www 记录值填你的IP TTL默认就好了(调大TTL值可以提高域名的解析稳定性和速度,如果近期要更改IP的话建议调小点)

再点击 添加记录 记录类型选择A,主机记录填:@ 记录值填你的IP TTL默认就好了;

在这里插入图片描述

经过以上步骤,我们过个10分钟左右即可访问自己的域名博客了。我的是:https://crazyandcoder.work/

在这里插入图片描述

以上便是搭建自己博客系统所有的步骤,记录总结一下,有需要的朋友可以参考一下。

关于作者

专注于 Android 开发多年,喜欢写 blog 记录总结学习经验,blog 同步更新于本人的公众号,欢迎大家关注,一起交流学习~

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

推荐阅读更多精彩内容