用 GitHub + Hexo 建立你的第一個博客

作為一個程序員,擁有一個自己的博客,平時記錄一下,分享點技術文章,還是挺有必要的。建立博客的通常渠道包括:

  1. 在博客平台上註冊,比如 博客園、CSDN、新浪博客 等。

  2. 利用博客框架搭建,如 WordPress、Jekyll、hexo 等。

  3. 自己用代碼寫一個。

其中,第一種最簡單,也最受限,說不定還會被刪帖刪號。第二種稍複雜,另外需要自己找部署的伺服器,但可定製化較高,是很多程序員的選擇。最後一種,是在重複造輪子,不過從另一個方面來看,倒是鍛煉編程能力的好方式。

下面我們就來看下第二種搭建博客的方式。由於內容較多,會分為幾篇內容,今天是第一篇:

  1. github+hexo 建立你的第一個博客

  2. Hexo(2)-部署博客及更新博文 - Crossin的編程教室 - 知乎專欄

  3. Hexo(3)-安裝自己喜歡的主題

  4. Hexo(4)-安裝多說評論框

  5. Hexo(5)-購買並綁定域名

感謝本文作者 大懶蟲 同學的投稿。

前言

其實呢,建立博客是非常簡單的(哈哈,不管什麼東西,你會的就覺得簡單,不會的怎樣都難),我來給大家說說如何使用 GitHubPages 和 Hexo 建立自己的博客。

這個有一點難度,但是不要怕,我會一步一步的給大家完成指導的,如果有任何問題也可以隨時聯繫我,我會儘力給大家解決的!

下面先介紹為何選擇 GitHubPages 和 Hexo 來搭建博客,然後介紹搭建博客的詳細過程。

Why GitHub Pages and Hexo

因為 GitHub 的存在,我們得以簡單快速地搭建個人博客。

GitHub

GitHub,是一個代碼託管網站和社交編程網站。這裡聚集了世界上各路技術牛叉的大牛,和最優秀的代碼庫。把你的博客託管在這裡,還有什麼不放心的呢O(∩_∩)O。

GitHub Pages

GitHub Pages,是用來託管 GitHub 上靜態網頁的免費站點,那 GitHub Pages具體有哪些功能呢:

  • 有足夠的免費空間(1G),資料自己管理,保存可靠;

  • 享受 GitHub 的便利,上面有很多大牛,眼界會開闊很多;

  • 可以使用很多現成的博客框架,搭建過程簡單快速。

HEXO

Hexo 是一個簡單、快速、強大的靜態博客框架,出自台灣大學生 tommy351 之手。我也看過使用 Jekyll、Octopress 搭建個人博客的過程,確實要繁瑣許多。相比之下 Hexo 更輕便更快捷,下面是其官網強調的四大特點:

  1. 極速生成靜態頁面

  2. 一鍵部署博客

  3. 豐富的插件支持

  4. 支持 Markdown

相信大家對 GitHub Pages 和 Hexo 有了一定的了解,下面進入正題。

使用 GitHub Pages 建立博客站點

註冊 GitHub

訪問 GitHub,註冊十分簡單,一定要記住註冊時使用的郵箱,因為 GitHub 上很多通知都是通過郵箱的。如下圖所示:

申請成功後,在 GitHub 官網上登錄,並驗證郵箱即可。

在 GitHub 上建立倉庫

與 GitHub 建立好連接之後,就可以方便的使用它提供的 Pages 服務,GitHub Pages 分兩種,一種是用你的 GitHub 用戶名建立的 username.github.io 這樣的用戶&組織站點,另一種是依附項目的 Pages。

想建立個人博客是用的第一種,形如 username.github.io 這樣的可訪問的站點,每個用戶名下面只能建立一個。如下圖所示:

關於 Github 的使用,我的老師 Crossin先生 也寫了一篇通俗易懂的教程,大家可以去看看

極簡 Github 上手教程

安裝軟體

Node.js

Node.js 下載

下載完成後根據提示一步一步安裝就好,這個沒有什麼需要特別說明的。

GitHub for Windows

GitHub Desktop 下載

這裡有一點說明,下載這個 github 時因為是先從官網下載下來了一個下載器,然後再在本地下載,因為是外網,可能有點卡,所以下載好了全部並整理好了離線版本,你下載這個直接就自動安裝了:

GitHub 離線版 下載 密碼:olr2

下載並安裝下面兩個軟體,一直點擊下一步即可。

使用 GitHub for Windows 登錄 GitHub

配置 SSH

我們如何讓本地 git 項目與遠程的 GitHub 建立聯繫呢?方法是用 SSH。打開命令行,輸入以下命令:

ssh -T git@github.com

如圖:

如果是下面之類的反饋(或者顯示 Hi xxx):

The authenticity of host github.com (207.97.227.239) cant be established. RSA key fingerprint is 16:27:ac:a5:76:28:2d:36:63:1b:56:4d:eb:df:a6:48. Are you sure you want to continue connecting (yes/no)?

不用緊張,輸入 yes 之後,看到下圖的結果,就配置成功了。

使用 Hexo 創建博客框架

Hexo 安裝

打開命令行,依次輸入以下命令:

cd /npm install hexo-cli -g

如圖:

提示:cd / 作用是返回根目錄,Git Shell 默認裝在 C 盤,啟動時默認路徑為 C:Usersxxx(用戶名)DocumentsGitHub,輸入 cd / 命令後就返回到了 C 盤根目錄下,需不需要使用 cd / 看個人習慣(下同)

Hexo 部署

Hexo 的部署可採用如下方法,輸入命令:

hexo init [文件名]。

打開控制台,依次輸入以下命令:

cd /hexo init Hexo

回車後出現該提示則表示正確:

部署成功之後,Hexo 會自動在目標文件夾建立博客網站所需要的所有文件。此時可以通過輸入以下命令在本地進行預覽(在剛才創建的文件夾里):

hexo generate hexo server

系統可能會出現提示,請點擊允許。如下圖所示則表示正確:

此時打開瀏覽器,在瀏覽器地址欄輸入 localhost:4000/ (默認埠為4000), 便可以看到最原始的博客了。以後發表博文想先預覽,也可以通過 hexo server 在本地先跑起來,看看效果。

效果如下圖所示:

恭喜,到目前為止個人博客的雛形已經有了。

在 Git Shell 中按 Ctrl + C 並輸入 y 可以停止該服務。

其他文章及回答:

想用 Python 做數據分析?先玩玩這個再說 - Crossin的文章 - 知乎專欄

用 Python 實現你的量化交易策略 - Crossin的文章 - 知乎專欄

學習編程的過程中可能會走哪些彎路,有哪些經驗可以參考? - Crossin 的回答

你是如何自學 Python 的? - Crossin 的回答

編程初學者如何使用搜索引擎 - Crossin的文章 - 知乎專欄

如何直觀地理解程序的運行過程?- Crossin的文章 - 知乎專欄

如何在 Python 中使用斷點調試 - Crossin的文章 - 知乎專欄

Python 抓取網頁亂碼原因分析 - Crossin的編程教室 - 知乎專欄

極簡 Github 上手教程 - Crossin的編程教室 - 知乎專欄

Crossin的編程教室

微信ID:crossincode

論壇:Crossin的編程教室

QQ群:521603553


推薦閱讀:

Hexo(2)-部署博客及更新博文
VI:GitHub + Hexo (3):安裝主題
Ⅰ.GitHub + Hexo (1):在 OS X 下建立你的第一個博客——史上最靠譜教程
hexo 怎麼創建 404 頁面?
hexo文章發布到github後部分文件404了?

TAG:Hexo | 独立博客 | GithubPages |