作為一個程序員,如果沒有自己的專屬技術博客钮呀,豈不是一大不幸?于是不久前在jonyfang
的詳細教程下完成了在Mac上使用Github+ Octopress
搭建屬于自己的博客,十分的感謝凡蚜!所以我把搭建博客的過程記錄總結下來。附原文地址:Jony Fang
一吭从、Octopress 與 Jekyll & Github Pages 的關系
Octopress 是基于 Jekyll 的靜態(tài)博客框架朝蜘。
GitHub Pages 這里用于顯示托管在 GitHub 上的靜態(tài)網(wǎng)頁,是 GitHub 提供的一項服務涩金。
總的來說也就是我們使用基于 Jekyll 的 Octopress 生成本地的靜態(tài)網(wǎng)站谱醇,然后將靜態(tài)的網(wǎng)站托管到 Github 為我們提供的 Github Pages 服務上。最后訪問 博客地址 就可以顯示我們的個人博客網(wǎng)站了步做。
二副渴、安裝環(huán)境:
我使用的是 Mac OS X 系統(tǒng)
安裝
Ruby
,由于我之前安裝了CocoaPods全度,所以已經有Ruby煮剧,一般來說,Mac OS X都是自帶Ruby的
但還是記錄下Ruby安裝教程
(1) 打開終端,執(zhí)行如下命令轿秧,安裝 RVM
中跌,同時也會安裝最新的 Ruby:
$ curl -L https://get.rvm.io | bash -s stable --ruby
(2) 安裝完,執(zhí)行如下命令菇篡,查看 Ruby 版本 (-v = --version)
$ ruby -v
如果你的 Ruby 版本不低于 1.9.3漩符,可直接跳下一步進行安裝 RubyGems。否則需要執(zhí)行如下命令:
$ rvm install 2.0.0
$ rvm use 2.0.0
現(xiàn)在我們再執(zhí)行命令查看 Ruby版本驱还,會看到現(xiàn)在已經是 2.0.0
了嗜暴。
$ ruby -v
(3) 安裝 RubyGems:
$ rvm rubygems latest
OK,環(huán)境準備工作搞定了
三议蟆、本地安裝 Octopress
1. 將 Octopress 的項目 clone 到本地闷沥,終端執(zhí)行如下命令:
$ git clone git://github.com/imathis/octopress.git octopress
進入 octopress 目錄:
$ cd octopress
2. 安裝 Octopress 所需要的依賴庫(dependencies)
安裝過程中可能會遇到權限問題,我們需要在命令前面加上 sudo 再執(zhí)行咐容,并輸入登錄密碼舆逃。
注:
sudo
全稱是:super user do
,也就是以 root 用戶身份來執(zhí)行
$ sudo gem install bundler
$ bundle install
這里在不翻墻的情況下戳粒,可能會遇到一個問題:sudo gem install bundler
執(zhí)行后路狮,一直沒有響應。這是由于國內網(wǎng)絡原因(你懂的)蔚约,導致rubygems.org存放在 Amazon S3 上面的資源文件間歇性連接失敗奄妨。所以你會遇到gem install rack
或bundle install
的時候半天沒有響應的情況。
但好消息是國內某大神幫我們解決了這一心頭大患苹祟,我們可以用淘寶的Ruby鏡像來替換原來的鏡像砸抛。只需終端執(zhí)行下面的命令即可:
$ gem sources -a https://ruby.taobao.org/ -r https://rubygems.org/
然后執(zhí)行如下命令查看切換后結果
$ gem sources -l
然后會看到這樣的輸出:
*** CURRENT SOURCES ***
https://ruby.taobao.org
這就說明我們切換到淘寶的 Ruby 鏡像了,再次安裝 Octopress 所需要的依賴庫就會發(fā)現(xiàn)成功啦树枫。
當然還有另外兩種方法:
比較原始的方法 -> 動更改:打開
octopress/Gemfile
文件 -> 將source "https://rubygems.org"
改為source "https://ruby.taobao.org"
就可以了-
相對方便點直焙,因為我們使用的是 Gemfile,所以我們可以用 Bundler 的 Gem 源代碼鏡像命令团赏,這樣我們就不用改 Gemfile 的 source 了箕般。命令如下:
$ cd octopress
$ bundle config mirror.https://rubygems.org https://ruby.taobao.org
3. 安裝下默認主題:
終端執(zhí)行下面的命令,即可安裝默認主題舔清,當然也可在這里就安裝第三方主題丝里,不過一會再安裝也是一樣的,所以留在后面說吧体谒。
$ rake install
注:rake 全稱為:
ruby make
4. 預覽效果
OK杯聚,經過上面的流程,我們已經在本地搭建了一個簡易版的 Octopress 博客抒痒。于是讓我們來看看效果吧幌绍。在終端執(zhí)行命令:
$ sudo rake preview
然后打開瀏覽器,輸入 http://localhost:4000/
就可以看到效果了。雖然比較簡陋傀广,但讓人挺高興的颁独,哈哈哈
至此我們算是結束了本地安裝過程
四、本地的 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
創(chuàng)建。
注意:創(chuàng)建完后不要添加任何內容耻警,另外自己過程中產生了兩個疑問
- 1.為什么用
github.io
而不是github.com
隔嫡? - 2.為什么是
Repository name
一定要按照username.github.io
填寫?
第一個問題甘穿,簡而言之畔勤,使用了github.io
是為了安全。
第二個問題扒磁,和 Github 內部的結構有關,其次后面會通過 URL 截取填寫的 username.github.io
作為博客域名式曲。這樣填寫格式與 Github 內部結構的具體聯(lián)系還需要再研究下妨托。若有大神圍觀,望指教下
2. 配置 Github Pages
終端執(zhí)行如下命令:
$ cd octopress
$ rake setup_github_pages
該命令會要求我們輸入 Github 倉庫的 URL 吝羞。復制粘貼下我們新建倉庫的 SSH 或 HTTPS URL 即可兰伤。(例如:git@github.com:username/username.github.io.git
),注意此處有坑钧排,若是新手敦腔,選擇了SSH后面會出現(xiàn)要求配置SSH Key問題,可能會導致很麻煩恨溜,所以我選擇了HTTPS
記錄下:這兩種方式的主要區(qū)別在于:使用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 生成的靜態(tài)站點與 GitHub 進行綁定了。
3. 創(chuàng)建第一篇文章:
終端執(zhí)行指令:
$ rake new_post["title"] #title為你的文章名谍珊,可隨意更改
生成的新文章在source/_post/
目錄下治宣,文件名構成為時間和標題的拼音。我們可以用Markdown編輯器對文章進行修改砌滞。
打開新建的 markdown 文件(我目前用的 Mou 打開)侮邀,會發(fā)現(xiàn)頭文件有如下內容(千萬不要刪除這段信息):
---
layout: post #post代表是一篇博文
title: "hello world"
date: 2015-10-14 19:59:22 +0800
comments: true #是否允許評論
categories: #分類
---
在最后面的 --- 下面就可以開始我們的正文啦~
正文寫完后,終端執(zhí)行如下指令即可生成靜態(tài)站點贝润,:
$ sudo rake generate
如果你想預覽本地的站點绊茧,可以執(zhí)行終端指令:
$ rake preview
此時,可以使用瀏覽器打開 localhost:4000
查看效果打掘。如果沒有問題可以將靜態(tài)站點同步到 GitHub 遠程倉庫中华畏,終端執(zhí)行指令:
$ sudo rake deploy
你會發(fā)現(xiàn)我們的靜態(tài)站點已經被 push 到 GitHub倉庫的 master 分支上。稍等幾分鐘尊蚁,訪問博客地址 username.github.io
亡笑,就會發(fā)現(xiàn)你的個人博客站的第一篇blog已創(chuàng)建成功了。
如果你還想把自己的本地資源文件(如Markdown文件等內容)也同步到 GitHub 中横朋,可以執(zhí)行以下指令:
$ git add .
$ git commit -m "comment" #comment可隨意更改
$ git push origin source
這樣我們的資源文件就會同步到 GitHub 的 source 分支了仑乌。
注意:
rake preview
會自動監(jiān)視文件的變化,重新生成靜態(tài)頁面琴锭。因此修改markdown文件后晰甚,只需要在瀏覽器里刷新一下頁面,就立刻可以看到效果祠够。不過如果修改了_config.yml的話压汪,則需要Ctrl+C
終止,用rake generate
重新生成古瓤,才能看到效果止剖。
OK腺阳,現(xiàn)在我們完成了個人博客的初級搭建,足夠滿足我們的基本需求穿香。之后亭引,我們需要進一步了解關于更換主題theme、定制博客站Style等內容皮获,詳情請參見我的下一篇文章--個性化我們的Octopress博客焙蚓。