利用Hexo搭建Github的个人主页

背景:

近期在跟圈内朋友谈一件事情:

搭建一个关于DICOM协议的中文社区,以开源书籍的模式,自发翻译DICOM官方最新标准。以DICOM协议为切入点,通过阅读、研究、到最后翻译,更加全面掌握标准,尤其是加深对医疗行业的了解。

随着国内新医改的逐步深入,各行各业的创业者开始涉足医疗行业,无论出于颠覆旧有体制和现行标准,还是出于对DICOM标准了解不足的角度,未来新的医疗大环境下必然需要标准的更新,或新的标准。称之为DICOMX.X也好,称之为XXX也罢。充分研读现有标准,实时关注当下新需求,为改善或制定适应未来医疗环境的新标做准备……

虽然目前看起来这件事情的意义不是很大,且以我个人的能力来推动还有很艰难的一段路要走。但是只要有恒心和毅力,哪怕是靠一己之力,每天一点点变化终究会有收获,正如我博文的格言“只要踏出一步,路就在前方”。因此近期在构思以如何的一种方式才能更有效更优质的来实施该项目。 以类似于MongoDB中文社区、Scala中文,还是以hadoop中文,还是以W3CSchool,甚至干脆就在Github上发布一个开源书籍项目,诸如7天学会Node.js、Docker中文。 Σ( ° △ °|||)︴。

Hexo发布GitHub个人主页:

看了一下目前手中的资源和环境,决定先用Github上提供的免费空间来尝试一下。谷歌或百度一下,该类教程很多。还是按照老方法,先搜索资料,尝试在Win7 64位的本机搭建环境,然后待搭建成功后将搭建经验整理成博文。
本篇博文后文主要介绍如何利用Hexo来发布Github个人主页。详细内容如下:

1、环境配置:

博文Hexo搭建Github静态博客中比较详细的介绍了如何配置Hexo整体环境,但是在具体实施过程中遇到了问题。比如在我的Git Bash下,无法识别npm。如下图所示:
利用Hexo搭建Github的个人主页_第1张图片

(1)Node.js Install:

因此需要安装Node.js,从官网下载下载的x64位的Windows Installer安装失败,具体而且安装过程中也未给出具体提示,如下所示:
利用Hexo搭建Github的个人主页_第2张图片
最终在圆点网博文中找到了解决方案:
第一步,从Node.js官网下载Node.js引擎,也就是一个叫做node.exe的二进制包

第二步,从Node.js上下载最新的npm,我选择的是npm-1.4.9.zip
第三步,配置环境变量。新建NODE_PATH环境变量,指向node_modules,如我本地 F:\ZSGitHub\nodejs\node_modules。 向Path系统变量中添加Node.exe的路径,例如我本地为 F:\ZSGitHub\nodejs,以及刚才创建的NODE_PATH变量,即向Path路径中添加%NODE_PATH%
第四步,进入NODE_PATH目录,运行npm install express。安装完成后输入node -v看到如下内容,说明安装Node.js成功。
这里写图片描述

(2)Hexo Install:

安装完Node.js后,接下来直接安装Hexo,输入npm install -g hexo指令即可。

(3)Git Install:

参照博文Windows下Git安装指南即可顺利完成Git的安装,安装完成后,开始菜单中如下图所示:
利用Hexo搭建Github的个人主页_第3张图片
安装完成后,需要配置Git的用户名和邮件地址。启动Git Bash,输入git config -l可先查看当前环境Git的配置情况,例如我本地:
利用Hexo搭建Github的个人主页_第4张图片
然后按照Hexo搭建Github静态博客中配置自己Git的信息,即username和email,分别输入git config –global user.name “zssure-thu”和git config –global user.email [email protected]

2、具体部署:

环境搭建完成后,接下来让我们动手利用Hexo在本地发布一个网页。

(1)生成博文:

网页发布需要有内容,也就是我们常说的博文。进入到Hexo目录,我本地F:\ZSGitHub\Hexo,输入hexo new “Hello World zssure”,随后会看到在F:\ZSGitHub\Hexo\source_posts目录下生成一个名为Hello-World-zssure.md的MarkDown文件。双击利用MarkDownPad打开,内容如下:

title: Hello World zssure
date: 2015-05-22

这就是一个简单的空的博文文件,利用MarkDownPad编辑器将自己需要发布的内容粘贴进去。关于MarkDown的语法我就不介绍了,可参照之前CSDN官方对MarkDown编辑器的介绍。我今年的博文也都是用MarkDown来编辑的,因此这里为了省事,就直接将最近期的一篇专栏文章DICOM:DICOM Print服务中PresentationContext协商之 MetaSOPClass与SOPClass对比分析直接贴过来了。大致效果如下:
利用Hexo搭建Github的个人主页_第5张图片
保存后,我们的博文就算写完了。
在当前目录,输入hexo server,可启动本地web服务,打开chrome浏览器,输入http://localhost:4000/可以看到如下内容,这说明我们的博文已经顺利发布了。
利用Hexo搭建Github的个人主页_第6张图片

(2)生成网站文件:

众所周知,网站发布需要html、css、js等多种语言和结构配合,虽然MarkDown内嵌了诸多html的语法,但是离真正发布的网站文件还有一些差别。这就是我们之所以使用Hexo的原因。有了Hexo工具,不需要我们自己编写html、css和js文件,Hexo可一键生成。
同样命令行进入目录F:\ZSGitHub\Hexo,输入hexo generate,过一段时间后,可以看到当前目录多了public文件夹,打开可以看到该文件夹内已经由hexo自动生成了网站发布所需的各种文件,诸如css、js、index.html、archives等等。

(3)发布到Github:

一切准备就绪,接下来就是将我们利用Hexo搭建的本地网站发布到Github主页中去了。为什么要发布到Github主页呢?其实很简单,在这之前我们利用Hexo构建的只能在本机和局域网内部访问,我们搭建网站自然是希望放到外网上供大家浏览啦。而Github就提供了这样一种服务,简而言之就是提供拥有外网IP的一个约300M的免费空间给你。在该空间内按照Github的说明,将自己构建的网站内容上传到Github指定目录下,就可以完成我们网站在外网的发布啦。
参照Hexo搭建Github静态博客博文,我们修改F:\ZSGitHub\Hexo目录下的_config.yml配置文件,主要修改内容有两部分:

第一部分
# Hexo Configuration
## Docs: http://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site
title: zssure
subtitle: 只要踏出一步,路就在前方
description: zssure的个人网站
author: zssure
language:
timezone:
第二部分
# Deployment
## Docs: http://hexo.io/docs/deployment.html
deploy:
type: git
repository: [email protected]:zssure-thu/zssure-thu.github.io.git
branch: master

再次进入F:\ZSGitHub\Hexo目录,输入hexo deploy,即可完成网站的发布。按照博文中的说明此刻即可顺利发布网站到Github个人主页。但是在本地运行时弹出了ERROR deployer not found:github
利用Hexo搭建Github的个人主页_第7张图片
在VE2X博文中给出了问题的解决方案,即需要在当前目录下输入npm install hexo-deployer-git –save利用Hexo搭建Github的个人主页_第8张图片
随后输入hexo deploy即可顺利完成网站到Github的发布,结果如下图所示:
利用Hexo搭建Github的个人主页_第9张图片

【PS】: 在简书博文介绍了_config.yml配置文件各部分的含义,以及配置说明,需要注意的是_config.yml配置文件中冒号“:”后要留有一个英文半角的空格

3、域名绑定:

此刻可以看到Github个人账户Repository中的zssure-thu.github.io项目下出现了我们利用Hexo在public本地中的文件。此时在浏览器输入http://zssure-thu.github.io即可看到与Hexo本地发布相同的网站,唯一不同的是此刻我们的网站发布在外网,可以随时随地被访问到。
利用Hexo搭建Github的个人主页_第10张图片
正巧手中屯了一堆域名还未使用(^_^),就百度了一下如何将自己的域名绑定到Github个人主页,参照帖子中的方法,在Github的zssure-thu.github.io项目下添加CNMAE文本文件,输入要绑定的域名,例如我的域名zssure.me。保存后,将域名解析服务绑定到Github提供的域名解析服务器,192.30.252.153或192.30.252.154即可完成域名绑定。
最后在浏览器中输入www.zssure.me试试吧,至此网站顺利发布了。
利用Hexo搭建Github的个人主页_第11张图片

后记:

此次过程,作为博文背景中提到的想法的一次初步动手尝试,值得庆幸的是,在学习技术的同时也看到了些许成果。后续的工作主要放在优质高效的研读、分析和翻译DICOM标准上,敬请期待。如果有兴趣可通过博文中的邮箱联系我。



作者:[email protected]

时间:2015-05-22

你可能感兴趣的:(github,hexo,node-js)