个人博客的搭建

基于Gitpage和Hexo的个人博客搭建(Linux)





  这篇文章是我在历经几次博客搭建之后自己总结出来的一些个人经验。


  我的博客是使用 Github + Hexo 来完成的,这也是目前很多人都会选择的主流方法。当然也有其他很多人选择其他的博客搭建方法,比如使用现成网站提供的博客页面,再比如从零开始一步步搭建自己的网站……当然我这种又小白又想展现一点技术的,就理所当然的选择了这个方法。


  好了废话不多说,开干!!


  这种博客的搭建方法大致分为三大步:

  • 本地Hexo的工作以及文件配置
  • Github 的申请与准备
  • 从本地向Git端的部署



一、本地Hexo的工作以及文件配置

Hexo是一个集简单、快速、强大于一体的基于 Github Pages 的博客框架,支持Markdown格式,有很多的插件和主题。

总的来说,我们对于博客的操作,就是我们在本地创建文件和文档,然后上传到网络端,网络端随着我们上传的更新,来进行更新。而Hexo在其中的作用,就是每当我们要对博客进行更新的时候,就将写好的文章或者其他的什么东西,交给Hexo,让它来将改更新进行统一的管理,然后上传到 github ,这样,我们在网络上的博客内容就会随之更新。

Hexo需要依赖 Node.js 环境,所以我们首先需要下载安装 Node.js 以及 npm

sudo apt-get install nodejs
sudo apt-get install npm    //nodejs的包管理工具



然后输入以下命令查看是否安装成功,安装成功会显示出版本号

node -v
npm -v



接着,下载安装配置 Git

sudo apt-get install git
git config --global user.name "yourname"              //设置你的名字
git config --global user.email "[email protected]"   //设置你的邮箱



Git 安装配置完成之后就开始安装配置我们的正主—— Hexo

npm install -g hexo-cli   //-g的意思是全局安装Hexo
mkdir blog                //创建一个目录用来存放博客文件
hexo init blog            //将我们的博客目录初始化
cd blog                   //进入目录
npm install               //在目录中安装依赖包
hexo g                    //生成静态文件
hexo s                    //初步完成!启动本地服务 命令行会出现一个地址,进入

到这里,我们的第一步就完成了,但这里,可能有两点需要解释清楚:

  • hexo g 命令 何为生成静态文件

    hexo g 也就是 hexo generate ,我们在初始化完成之后的博客目录中所作的一切操作,都是对博客内容的更新,这时候我们需要使用这个命令将我们做出的操作生成静态文件,也就是我们的博客文件

  • hexo s 命令

    hexo s 也就是 hexo server 启动我们的本地服务,这个命令将会将我们的静态文件推送到本地服务器,也就是将我们的更新推送到本地服务器,之后我们进入提示的 http://localhost:4000/ 站点,就可以看到我们对博客做出的更新,简单的来说,就是给我们提供了一个本地预览的效果,那我们怎么将它上传到网络让更多人看到呢?往下看




二、Github 的申请与准备

  Github是一个全球最大的通同性交友网站……哈哈,开玩笑,想具体知道这个网站的功能与特点请自行谷歌。我们这里需要用到的相关知识不是很多。所以不多赘述。


  首先我们需要申请一个Github的帐号,因为我们需要用到 git 提供的 gitpages 功能来给我们的博客提供一个可以访问的网站页面。
Alt text



————>    https://github.com/    <————




  注册完毕之后,接下来我们该做的就是创建一个Github仓库。


  选择 new repository 创建新仓库 ,仓库名必须起为 你的用户名.github.io 的格式 ,也就是说如果你的用户名是 youcai , 那么你的仓库名称就必须是 youcai.github.io ,其他名称是无效的 ,这样以后 ,你的博客访问地址就是https://youcai.github.io 名字取完以后,点击绿框的 Create repository。




  好啦 ,到这里 ,我们的网站地址以及仓库就设置好了。接下来我们该做的是建立远程仓库和本地的连接 —— 添加SSHkey

首先,打开终端,输入

ssh-keygen -t rsa -C "[email protected]"

这里的邮箱输入你自己的邮箱,回车的时候会提示出现输入 password ,可以选择直接回车跳过,就是默认无密码。

接下来,我们输入

ls -a

会找到一个名为 .ssh 的隐藏目录,进入这个目录可以找到两个文件id_rsaid_rsa.pub ,其中我们把前者称为私钥,不能泄露出去,后者我们称之为公钥,我们把它打开,复制这个文件的所有内容。

  接下来,打开我们的 github 网页,右上角头像——>settings,进入设置页面之后,左边列表有一个 SSH and GPG keys 选项,进入,选择绿色的小方块,New SSH key,点击,创建新的SSHkey,名字随便起,在下方的 key 方框中,粘贴我们刚才复制的id_rsa.pub文件内容,完成。

这时候,我们可以输入一条命令来验证一下是否连接成功

ssh -T [email protected]

如果有选项输入yes就好,当我们看到
Hi XXX! You've successfully authenticated, but GitHub does not provide shell access.
的时候就证明连接成功了。




三、从本地向Git端的部署

主题的更换

   还记得第一步最后终端给我们的本地终端链接吗?那个页面就是 hexo给我们的默认主题,如果觉得不喜欢的话,我们可以将它换掉。


   我们可以进入Hexo的官方主题网站来选择一款自己喜欢的主题进行更换。

Alt text



  点击图片会进入主题预览,如果对哪款主题比较喜欢,可以退回到这个界面,点击它的名字,会进入这个主题的git页面,这里我以我的主题 NexT 为例
Alt text


看到右面那个很明显的绿色小方块Clone or download 了吗?点击它,然后复制它给出的链接地址。


这时候我们再切回我们的终端,进入我们的博客目录,找到一个名为 themes 的目录,进入然后使用命令

git clone http://the website .com



git clone 后面粘贴你刚才复制的链接,等待克隆完成之后,我们就可以看到在 themes 目录下多了一个名为 “next” 的目录,这就是我们刚才所选好的主题的文件。


回到我们的博客目录,再次打开我们之前名为_config.yml的配置文件,找到主题设置的代码段,把名字换成你的主题名
Alt text


修改完成后,我们输入以下两条命令来验证是否安装成功

hexo g
hexo s


第二条命令输入并回车之后,会再次出现让我们去http://localhost:4000/站点的提示信息,然后我们进入,就会看到,之前默认的主题已经变了,变成了我们所选择的主题的样子。

到这里,我们的主题更换完成!





将博客变成我们自己的

  虽然我们将主题换成了自己喜欢的,但是我们的博客其他配置还都是默认的,这时候我们需要进入_config.yml文件再次进行修改
Alt text

它的设置通过名字就能看出来,非常简单,其中language后面的参数zh-Hans代表中文,设置完成以后,我们的网站名称和作者就完全变成了我们所设置的内容。





将博客部署到git

  打开我们初始化过的博客文件,也就是之前创建的 blog 目录。可以看到目录下有一个名为_config.yml的配置文件,打开,添加我们的git仓库
Alt text

找到图中所示的部分代码,像我一样填写,在 repo: 后面填写的是你在第二步中创建的 github 仓库名,所以你这里应该填写的是`[email protected]:yourname/yourname.github.io.git`

  这一步完成之后,我们需要安装一个依赖使我们的博客能正常推送到 git

npm install hexo-deployer-git --save

安装完成后,我们输入

hexo clean   //这一步是为了产生不必要的错误,所以清理一下缓存
hexo g       //生成静态文件
hexo d       //向远端推送

完成部署




部署完成以后,我们就可以打开 http://yourname.github.io 来查看你的博客啦!