使用Coding和Hexo搭建免费静态Blog

喜欢写Blog的人,会经历三个阶段。

第一阶段,刚接触Blog,觉得很新鲜,试着选择一个免费空间来写。
第二阶段,发现免费空间限制太多,就自己购买域名和空间,搭建独立博客。
第三阶段,觉得独立博客的管理太麻烦,最好在保留控制权的前提下,让别人来管,自己只负责写文章。
大多数Blog作者,都停留在第一和第二阶段,因为第三阶段不太容易到达:你很难找到俯首听命、愿意为你管理服务器的人。
但是六年前,情况出现变化,一些程序员开始在GitHub网站上搭建blog。他们既拥有绝对管理权,又享受GitHub带来的便利—-不管何时何地,只要向主机提交commit,就能发布新文章。更妙的是,这一切还是免费的,GitHub提供无限流量,世界各地都有理想的访问速度。
今天,我就来示范如何在GitHub上搭建Blog,你可以从中掌握GitHub的Pages功能,以及Hexo软件的基本用法。更重要的是,你会体会到一种建立网站的全新思路。


概要

GitHub Pages 是什么?


如果你对编程有所了解,就一定听说过GitHub。它号称程序员的Facebook,有着极高的人气,许多重要的项目都托管在上面。简单说,它是一个具有版本管理功能的代码仓库,每个项目都有一个主页,列出项目的源文件。

但是对于一个新手来说,看到一大堆源码,只会让人头晕脑涨,不知何处入手。他希望看到的是,一个简明易懂的网页,说明每一步应该怎么做。因此,GitHub就设计了Pages功能,允许用户自定义项目首页,用来替代默认的源码列表。

所以,GitHub Pages可以被认为是用户编写的、托管在GitHub 上的静态网页。

GitHub 提供模板,允许站内生成网页,但也允许用户自己编写网页,然后上传。有意思的是,这种上传并不是单纯的上传,而是会经过Hexo或Jekyll等程序的再处理。
<font color=gray size=30>什么是Hexo?</font>


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

A fast, simple & powerful blog framework, powered by Node.js.

类似于jekyll、Octopress、Wordpress,我们可以用Hexo创建自己的博客,托管到github、Heroku或Coding上,绑定自己的域名,用markdown写文章。本博客即使用hexo创建并托管在github上。

<font color=gray size=30>为什么要用hexo</font>


不可思议的快速 ─ 只要一眨眼静态文件即生成完成
支持 Markdown
仅需一道指令即可部署到 GitHub Pages 和 Heroku
已移植 Octopress 插件
高扩展性、自订性
兼容于 Windows, Mac & Linux

  • 易用。不仅部署简单,平时使用中仅需要hexo new hexo generate hexo server hexo deploy四个命令。不像Jekyll需要很多繁琐的git命令。
  • 轻。文件少、小,易理解,方便自定义。
  • 用户多。虽然赶不上Jekyll和Octopress,但遇到什么问题都能搜索到答案,或者找到同样使用hexo的用户进行参考和咨询。

<font color=gray size=30>谁能使用hexo</font>


这是一个免费开源的博客程序,任何人都可以使用和修改。但是不同于wordpress,hexo由于需要使用Github,Git,Markdown,Node.js这样的工具,好多插件、widget都需要自己安装、设置。所以适合那些有一定计算机基础,喜欢折腾的人。但是,不要恐惧,只要跟着本教程走,就能很方便地让自己的博客”飞起来”。

<font color=gray size=30>怎样搭建hexo博客</font>


正题来了,请认真往下看吧。


准备工作

注意 本文主要针对Windows平台和Hexo 3.x
<font color=gray size=30>安装GIT</font>
下载 Git 并执行即可完成安装。So Easy

<font color=gray size=30>安装Node.JS</font>


在 Windows 环境下安装Node.js非常简单,仅须下载Node.JS并执行即可完成安装。So Easy
<font color=gray size=30>安装Hexo</font>


在任意位置右键,选择Git Bash Here

1  npm install hexo-cli -g
2  #如果命令无法运行,可以尝试更换taobao的npm源
3  npm install -g cnpm --registry=https://registry.npm.taobao.org

Hexo初始化配置

<font color=gray size=30>创建hexo文件夹</font>


安装完成后,根据自己喜好建立目录(如D:\hexo),在该文件夹下右键–Git Bash Here。执行以下命令

1   hexo init

<font color=gray size=30>安装依赖包</font>


1 npm install

该命令会将hexo所需文件自动下载到hexo文件夹下。

1 #新建完成后,指定文件夹的目录如下
2   ├── _config.yml
3   ├── package.json
4   ├── package.json
5   ├── scaffolds
6   ├── scripts
7   ├── source
8   | ├── _drafts
9   | └── _posts
10  └── themes

<font color=gray size=30>安装Hexo插件(可省略)</font>


1 npm install hexo-generator-feed --save
2 npm install hexo-generator-sitemap --save
3 npm install hexo-generator-baidu-sitemap --save
4 npm install hexo-generator-json-content --save
5 npm install hexo-deployer-git --save
6 npm install hexo-generator-index --save
7 npm install hexo-generator-archive --save
8 npm install hexo-generator-category --save
9 npm install hexo-generator-tag --save
10 npm install hexo-server --save
11 npm install hexo-deployer-heroku --save
12 npm install hexo-deployer-rsync --save
13 npm install hexo-deployer-openshift --save

<font color=gray size=30>查看本地运行效果</font>


现在我们已经搭建起本地的Hexo博客了,继续执行以下命令(在D:\Hexo),成功后即可登录localhost:4000查看效果,运行显示了相关页面,说明当前网站已经在本地建立。

1 hexo generate  #可简写为hexo g
2 hexo server      #可简写为hexo s

好了,至此,本地博客已经搭建起来了,只是本地哦,别人看不到的。下面,我们要部署到Coding。


配置Coding

<font color=gray size=30>注册Github账号</font>


已有账号可以跳过,没有的,请登录Coding进行注册,很简单,这里就不介绍了。

<font color=gray size=30>创建repository</font>


在自己Coding主页中间上面,创建项目。比如我的Coding账号是MoPoint,那么我应该创建的项目名字应该是mopoint。然后都不用选择,直接点击最下方的创建项目,然后点击左侧的代码,图片,点击,右侧中间的点击这里快速初始化仓库,然后点击下方的启用README.md文件初始化项目,再点击他右侧的创建 。最后我们要创建一个进入页。点击当前页右侧上方的新建文件,22.png,最后点击右下方的提交到master分支。最后一步,点击左侧的Pages服务,再部署来源里面选择master分支,点击保存之后即可访问静态主页如http://mopoint.coding.me/mopoint

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

推荐阅读更多精彩内容