GitHub+Octopress搭建自己的博客

作为一个程序员,如果没有自己的专属技术博客,岂不是一大不幸?于是不久前在jonyfang的详细教程下完成了在Mac上使用Github+ Octopress搭建属于自己的博客,十分的感谢!所以我把搭建博客的过程记录总结下来。附原文地址:Jony Fang

一、Octopress 与 Jekyll & Github Pages 的关系

  • Octopress 是基于 Jekyll 的静态博客框架。

  • GitHub Pages 这里用于显示托管在 GitHub 上的静态网页,是 GitHub 提供的一项服务。

  • 总的来说也就是我们使用基于 Jekyll 的 Octopress 生成本地的静态网站,然后将静态的网站托管到 Github 为我们提供的 Github Pages 服务上。最后访问 博客地址 就可以显示我们的个人博客网站了。

二、安装环境:

  1. 我使用的是 Mac OS X 系统

  2. 安装 Ruby,由于我之前安装了CocoaPods,所以已经有Ruby,一般来说,Mac OS X都是自带Ruby的

但还是记录下Ruby安装教程
(1) 打开终端,执行如下命令,安装 RVM,同时也会安装最新的 Ruby:

$ curl -L https://get.rvm.io | bash -s stable --ruby

(2) 安装完,执行如下命令,查看 Ruby 版本 (-v = --version)

$ ruby -v

如果你的 Ruby 版本不低于 1.9.3,可直接跳下一步进行安装 RubyGems。否则需要执行如下命令:

$ rvm install 2.0.0
$ rvm use 2.0.0

现在我们再执行命令查看 Ruby版本,会看到现在已经是 2.0.0 了。

$ ruby -v     

(3) 安装 RubyGems:

$ rvm rubygems latest

OK,环境准备工作搞定了

三、本地安装 Octopress

1. 将 Octopress 的项目 clone 到本地,终端执行如下命令:

$ git clone git://github.com/imathis/octopress.git octopress

进入 octopress 目录:

$ cd octopress

2. 安装 Octopress 所需要的依赖库(dependencies)

安装过程中可能会遇到权限问题,我们需要在命令前面加上 sudo 再执行,并输入登录密码。

注:sudo 全称是:super user do,也就是以 root 用户身份来执行

$ sudo gem install bundler
$ bundle install

这里在不翻墙的情况下,可能会遇到一个问题:sudo gem install bundler 执行后,一直没有响应。这是由于国内网络原因(你懂的),导致rubygems.org存放在 Amazon S3 上面的资源文件间歇性连接失败。所以你会遇到gem install rackbundle install 的时候半天没有响应的情况。

但好消息是国内某大神帮我们解决了这一心头大患,我们可以用淘宝的Ruby镜像来替换原来的镜像。只需终端执行下面的命令即可:

$ gem sources -a https://ruby.taobao.org/ -r https://rubygems.org/

然后执行如下命令查看切换后结果

$ gem sources -l

然后会看到这样的输出:

*** CURRENT SOURCES ***
https://ruby.taobao.org

这就说明我们切换到淘宝的 Ruby 镜像了,再次安装 Octopress 所需要的依赖库就会发现成功啦。

当然还有另外两种方法:

  1. 比较原始的方法 -> 动更改:打开 octopress/Gemfile文件 -> 将 source "https://rubygems.org" 改为 source "https://ruby.taobao.org"就可以了

  2. 相对方便点,因为我们使用的是 Gemfile,所以我们可以用 Bundler 的 Gem 源代码镜像命令,这样我们就不用改 Gemfile 的 source 了。命令如下:

    $ cd octopress
    $ bundle config mirror.https://rubygems.org https://ruby.taobao.org

3. 安装下默认主题:

终端执行下面的命令,即可安装默认主题,当然也可在这里就安装第三方主题,不过一会再安装也是一样的,所以留在后面说吧。

     $ rake install

注:rake 全称为:ruby make

4. 预览效果

OK,经过上面的流程,我们已经在本地搭建了一个简易版的 Octopress 博客。于是让我们来看看效果吧。在终端执行命令:

$ sudo rake preview

然后打开浏览器,输入 http://localhost:4000/
就可以看到效果了。虽然比较简陋,但让人挺高兴的,哈哈哈
至此我们算是结束了本地安装过程

Blog预览.jpg

四、本地的 Octopress 博客部署到 Github Pages

前面我们已经在本地搭出了 Octopress 雏形,接下来我们要将本地的 Octopress 博客部署到 Github Pages

1. 新建 Github repository

登录 Github 后,新建 Github repository。项目名称(Repository name)命名格式为 username.github.io ,username 是你的 Github 用户名(或 organization name,这里和后面我们先不讨论 origanization)。例如我的用户名是 XcodeTalk,所以输入 XcodeTalk.github.io 即可。点击 Create repository 创建。

注意:创建完后不要添加任何内容,另外自己过程中产生了两个疑问

  • 1.为什么用 github.io 而不是 github.com
  • 2.为什么是 Repository name 一定要按照 username.github.io填写?

第一个问题,简而言之,使用了github.io是为了安全。

第二个问题,和 Github 内部的结构有关,其次后面会通过 URL 截取填写的 username.github.io 作为博客域名。这样填写格式与 Github 内部结构的具体联系还需要再研究下。若有大神围观,望指教下

2. 配置 Github Pages

终端执行如下命令:

$ cd octopress
$ rake setup_github_pages

该命令会要求我们输入 Github 仓库的 URL 。复制粘贴下我们新建仓库的 SSH 或 HTTPS URL 即可。(例如:git@github.com:username/username.github.io.git),注意此处有坑,若是新手,选择了SSH后面会出现要求配置SSH Key问题,可能会导致很麻烦,所以我选择了HTTPS

记录下:这两种方式的主要区别在于:使用https url克隆对初学者来说会比较方便,复制https url然后到git Bash里面直接用clone命令克隆到本地就好了,但是每次fetch和push代码都需要输入账号和密码,这也是https方式的麻烦之处。而使用SSH url克隆却需要在克隆之前先配置和添加好SSH key,因此,如果你想要使用SSH url克隆的话,你必须是这个项目的拥有者。否则你是无法添加SSH key的,另外SSH默认是每次fetch和push代码都不需要输入账号和密码,如果你想要每次都输入账号密码才能进行fetch和push也可以另外进行设置。

那么这里 rake setup_github_pages 做了什么呢?
用户(users)的 Github Pages 使用 master 分支作为 Web 服务(web server)的公开目录,为我们的 Pages url (http://username.github.io)
提供内容文件。因此,我们会有这样的需求,source 分支用来做与博客源码相关的事(存放全部博客源码),master 分支上 commit 生成的博客内容供 Web 访问。而 Octopress 帮我们把这件事给搞定了,就是通过这行代码。

通过这样就会将 Octopress 生成的静态站点与 GitHub 进行绑定了。

3. 创建第一篇文章:

终端执行指令:

$ rake new_post["title"]    #title为你的文章名,可随意更改

生成的新文章在source/_post/目录下,文件名构成为时间和标题的拼音。我们可以用Markdown编辑器对文章进行修改。
打开新建的 markdown 文件(我目前用的 Mou 打开),会发现头文件有如下内容(千万不要删除这段信息):

---
layout: post             #post代表是一篇博文
title: "hello world"
date: 2015-10-14 19:59:22 +0800
comments: true         #是否允许评论
categories:             #分类
---

在最后面的 --- 下面就可以开始我们的正文啦~

正文写完后,终端执行如下指令即可生成静态站点,:

$ sudo rake generate

如果你想预览本地的站点,可以执行终端指令:

$ rake preview

此时,可以使用浏览器打开 localhost:4000 查看效果。如果没有问题可以将静态站点同步到 GitHub 远程仓库中,终端执行指令:

$ sudo rake deploy

你会发现我们的静态站点已经被 push 到 GitHub仓库的 master 分支上。稍等几分钟,访问博客地址 username.github.io ,就会发现你的个人博客站的第一篇blog已创建成功了。

如果你还想把自己的本地资源文件(如Markdown文件等内容)也同步到 GitHub 中,可以执行以下指令:

$ git add .
$ git commit -m "comment"  #comment可随意更改
$ git push origin source

这样我们的资源文件就会同步到 GitHub 的 source 分支了。

注意:rake preview 会自动监视文件的变化,重新生成静态页面。因此修改markdown文件后,只需要在浏览器里刷新一下页面,就立刻可以看到效果。不过如果修改了_config.yml的话,则需要Ctrl+C终止,用 rake generate 重新生成,才能看到效果。

OK,现在我们完成了个人博客的初级搭建,足够满足我们的基本需求。之后,我们需要进一步了解关于更换主题theme、定制博客站Style等内容,详情请参见我的下一篇文章--个性化我们的Octopress博客

原文地址:GitHub+Octopress搭建自己的博客

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

推荐阅读更多精彩内容