Sorry, your browser cannot access this site
This page requires browser support (enable) JavaScript
Learn more >

搭建博客的理由

记得刚上大学,进入到ACM,遇到想了半天没思路的的题,习惯性的上百度看别人的解析,于是发现很多人都会去维护一个自己的“网站”(当时觉得这种由自己网站的大佬好酷2333),当时并不知道是什么,于是各种查资料,并自学了 一些前端的技术,于是使用Hexo着手搭建了自己的第一个博客,当时搭建博客的主要目的是写一些做题笔记,好让自己赛前复习用,之后由于要给新加入ACM的新生们上课,于是就用作发布课程讲义了,再后来,大三跟队友做了些项目,外加考研复习,第一个博客就基本上没怎么更新了,渐渐被我遗忘在了角落,直到疫情期间在家倒腾笔记本的时候把南侨芯片烧了。。。。,电脑修好拿回来,脑子一热重做了系统,于是原来的博客由于没有做备份于是就这么没了。

现在已经是大四下学期了,刚考完研究生的我正焦急的等待着成绩,我想着也不能让自己闲着,于是就决定重新弄一弄自己的博客。

在制作第一个博客的时候,我对前端“三大金刚”的学习还是入门阶段,对hexo的使用也紧紧停留于看看别人的快速入门指南这种程度。于是从头再来,认真阅读官方文档(其实内容确实不多,主要是因为之前懒2333)

那么,回到标题,我为什么想要搭建一个个人博客呢,在我进入ACM之后,我认识到了一个问题,那就是对我来说,掌握一门知识,输出比输入要难,如果一门知识我可以很好的把他输出给别人看,那么说明我对这门知识的掌握程度上升了一个高度。撰写博客时,我对学过的知识进行回顾、归纳、总结、并用自己的话说出来,这样对我来说大概是一个很好的复习、巩固的过程。所以就有了这篇教学文档,我喜欢把我认为好的东西分享给身边的朋友以及学弟学妹。

第一部分:Hexo、Github,域名

这一部分大家的教程都大同小异,但我身边的朋友们其实在项目中Git接触的较少,所以我会更多的去讲解一些Git的知识,并且可能涉及到一些计算机网络方面的知识。

Hexo

Hexo简介

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

这是Hexo官网对hexo的介绍,Hexo,基于Node.js,依赖少,便于安装,且可托管到GitHub等网站,许多人喜欢使用这个框架搭建自己的个人网站,Hexo的创建者来自台湾,对中文支持友好。

Hexo搭建

由于Hexo时基于Node.js的,所以在安装Hexo之前,我们得安装Node.js,下载地址:

Node.js

Node.js是什么呢,下面引用一段百度百科

Node.js发布于2009年5月,由Ryan Dahl开发,是一个基于Chrome V8引擎的JavaScript运行环境,使用了一个事件驱动、非阻塞式I/O模型, [1] 让JavaScript 运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。

我对Node.js的理解是什么呢:

  1. 我理解的前端”三大金刚”包括:HTML、CSS、Javascript
  2. 其中Javascript是一门脚本语言,用来定义一个网页的行为,比如定义点击某个按钮会发生什么样的事情
  3. 那么Javascript能不能像C++、Java、Python那样来写服务端逻辑呢,本来是不能的,直到Node.js的出现
  4. Node.js是一个基于Chrome V8引擎的JS运行环境,可以让JS运行在服务端的开发平台。也就是说,可以用JS写后端逻辑了
NPM

接下来的安装我们需要用到npm,npm啥呢

NPM:

npm is the world’s largest software registry.

这段话来自npm官网,来自世界各地的开发者使用npm来分享他们的开源项目,npm被包含在了node.js中,==也就是说,当我们安装上node.js的时候,npm就一起被我们安装了==,因为npm其实是node.js的包管理工具,在前端开发中,许多需要反复使用的代码大家会做成模块发布到npm上,这是只要通过npm下载使用即可,而且npm会将该模块有以来关系的模块全部下载管理。

以上两个软件被安装以后,可以打开windows下的cmd,或者powershell,使用如下命令验证是否安装成功:

1
2
node -v
npm -v

另外,linux下的安装比windwos下要方便很多,只需要如下两行命令即可:

1
2
sudo apt-get install nodejs
sudo apt-get install npm

安装Git

Git简介

每次介绍git时,就不得不提起linux,在程序员数量越来越多的今天,Linux相信已经不是什么十分陌生的的名词了,Linus在1991年创建了开源的Linux,据说这位哥在维护Linux时,由于开源项目的特性,有世界各地的程序员向他提出改进方案,Linus为了管理这些修改而产生的不同版本,开发了git这么一种项目管理工具,当时CVS、SVN这些免费的管理工具速度较慢,且需要联网,而另一些商用版本管理工具需要收费,与开源精神相悖,于是这位哥就自己造轮子,花了两周的时间用C写了一个分布式版本控制系统,就是Git。

那么什么是版本管理工具呢,这里引用一下料廖雪峰老师的例子:

什么是Git

Git是目前世界上最先进的分布式版本控制系统(没有之一)。

Git有什么特点?简单来说就是:高端大气上档次!

那什么是版本控制系统?

如果你用Microsoft Word写过长篇大论,那你一定有这样的经历:

想删除一个段落,又怕将来想恢复找不回来怎么办?有办法,先把当前文件“另存为……”一个新的Word文件,再接着改,改到一定程度,再“另存为……”一个新文件,这样一直改下去,最后你的Word文档变成了这样:

就很烦

过了一周,你想找回被删除的文字,但是已经记不清删除前保存在哪个文件里了,只好一个一个文件去找,真麻烦。

看着一堆乱七八糟的文件,想保留最新的一个,然后把其他的删掉,又怕哪天会用上,还不敢删,真郁闷。

更要命的是,有些部分需要你的财务同事帮助填写,于是你把文件Copy到U盘里给她(也可能通过Email发送一份给她),然后,你继续修改Word文件。一天后,同事再把Word文件传给你,此时,你必须想想,发给她之后到你收到她的文件期间,你作了哪些改动,得把你的改动和她的部分合并,真困难。

于是你想,如果有一个软件,不但能自动帮我记录每次文件的改动,还可以让同事协作编辑,这样就不用自己管理一堆类似的文件了,也不需要把文件传来传去。如果想查看某次改动,只需要在软件里瞄一眼就可以,岂不是很方便?

这个软件用起来就应该像这个样子,能记录每次文件的改动:

版本文件名用户说明日期
1service.doc张三删除了软件服务条款57/12 10:38
2service.doc张三增加了License人数限制7/12 18:09
3service.doc李四财务部门调整了合同金额7/13 9:51
4service.doc张三延长了免费升级周期7/14 15:17

这样,你就结束了手动管理多个“版本”的史前时代,进入到版本控制的20世纪。

有了Git的帮助,我们就可以很方便的管理我们的hexo本博客文章了,此外使用Git,还能将你的博客长传到Github,部署到Github,成为你的个人主页,Git的操作是基于命令行的,各种命令的用法可以前往廖雪峰老师的博客进行查看,学习。

Git 安装
1
sudo apt-get install git

安装完成以后,使用

1
git --version

查看版本号,进行验证

安装Hexo

以上工具安装完成后,就能开始搭建Hexo静态博客了,首先在本地创建一个文件夹,给它一个响亮的名字,比如EnderBlog,然后使用==cd==命令进入这个文件夹,或者在这个文件夹下右键git bash打开。

使用

1
npm install -g hexo-cli

命令安装hexo,使用

1
hexo -v

xxxxxxxxxx6 1[[(2)[0] (2)[1] (5)[2] (1)[3] (5)[4] (3)[5] (4)[6] (3)[7]]2 [(3)[5] (5)[6] (2)[7] (2)[0] (1)[1] (3)[2] (4)[3] (5)[4]]3 [(3)[4] (4)[5] (2)[6] (5)[7] (1)[0] (3)[1] (2)[2] (1)[3]]4 [(4)[3] (1)[4] (3)[5] (4)[6] (5)[7] (3)[0] (2)[1] (3)[2]]]  # 最终状态5[0, 3, 4, 5]  # 最终状态表示6286  # 拓展节点个数shell

接下来初始化一下hexo

1
hexo init myBlog

此处myBlog可以任意起名,会在你的当前目录下创建一个以该字符串命名的目录,hexo会为你创建一个博客框架,接下里使用命令

1
2
cd myBlog #此处用cd到你之前起名的文件夹
npm install

安装hexo的所有依赖包,该命令会在我们的当前目录下生成一个node_modules目录,用来存放这些依赖包

到目前为止,我们的博客目录应该包含如下文件:

  • node_modules: 存放依赖包
  • public: 存放有markdown生成的页面
  • scaffolds: 存放用于生成文章的模板
  • source: 存放文章的本体
  • themes: 存放主题
  • config.yml: 博客的配置文件

接下来一个博客的大致框架就已经搭建好了,使用如下命令,就能直接看到我们的第一个版本的博客了:

1
2
hexo g #hexo的生成命令,完整形式为hexo generate,用于根据markdown生成一个html页面
hexo s #启动hexo服务,完整形式为hexo serve,用于启动hexo服务,

此时,在浏览器中输入localhost:4000就可以看到你生成的博客了。

localhost-即127.0.0.1,是回送地址,一般代表本机地址
4000带表端口号,传输层用于分流/合流

Github

这里引用知乎提问:Github 是怎样的一个存在,的一个回答,该回答来自知乎ID:古土雷柏

github是共产主义在软件开发领域的具体实现样板之一,即以生产资料社会公有制为基础(代码开源),以社会化合作(离散化的个人、组织等社会颗粒)为生产方式,主要采用合作社组织形式(项目组)的技术支撑平台。

虽然可能说的比较夸张,但是确实把Github的模式很好的概况了,而且也方便理解。

github可以通过git,将你的代码托管到这一平台上,平台社区里的用户可以共享到你的项目。通过issue的方式向你提出建议。

那么第一步就是上Github申请一个账号:Github

我们利用Github提供的Github Pages功能搭建一个个人博客。

登录github之后选择新建一个仓库

未完待续…..

评论