前言
其實大四實習那會就有搭建個人技術部落格的想法了,然後還是懶,擱置了很久。前陣子在掘金髮了幾篇之前寫過的文章,收穫了不少贊和閱讀量,有點小小的成就感,所以這點動力驅使自己動手了~有些人會覺得搭建個人部落格需要購買域名,需要花錢,其實不是的,Github就可以幫助我們免費生成靜態網址,這一點後面會提到的。
什麼是Hexo
Hexo 是一個快速、簡潔且高效的部落格框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。此處附上Hexo中文官網。下面我們詳細介紹搭建步驟。
安裝Git Bash
Git Bash是Windows系統下git的命令列工具。
- 下載地址
- 安裝步驟:雙擊下載好的exe檔案,一路next就可以
- 確認成功:執行
git version
,控制檯列印出對應git版本就說明安裝成功了。
安裝Node
Hexo是基於Node環境的靜態部落格,npm工具是必不可少的。
- 下載地址
- 安裝步驟:基本操作,這裡就不贅述了。
- 確認成功:執行
node -v
,控制檯列印出對應Node版本就說明安裝成功了。
安裝Hexo
- 先建立本地存放blog的資料夾,然後
cd
到對應目錄下。 - 安裝命令:
npm i -g hexo
(建議用cnpm
安裝,會相對快一些) - 確認成功:
hexo -v
- 初始化:
hexo init
,之後開啟的資料夾如下圖:
- 簡單解釋下資料夾的作用
node_modules:依賴包
scaffolds:命令生成文章等的模板
source:用命令建立的各種文章
themes:主題
_config.yml:整個部落格的配置
package.json:專案所需模組專案的配置資訊
搭橋到Github
- 沒賬號的建立賬號(程式猿不應該吧~),有賬號的看下面步驟:
- 回到gitbash,配置github賬號資訊(YourName和YourEail都替換成你自己的)
- 建立SSH,在gitbash輸入:
ssh-keygen -t rsa -C "youremail@example.com
,生成ssh,然後按照下圖找到id_rsa.pub
- 將獲取的ssh放到github中:
臨門一腳
- 用編輯器開啟blog專案,修改
_config.yml
檔案的一些配置(記得冒號後必須有空格,不然配置不生效,這是Hexo的一個坑!)
deploy:
type: git
repo: https://github.com/YourgithubName/YourgithubName.github.io.git
branch: master
複製程式碼
- 進入blog專案,分別執行以下命令:
hexo clean
hexo generate
hexo server
複製程式碼
- 開啟瀏覽器輸入:
http://localhost:4000
,見證奇蹟的時刻到了~
上傳到Github
- 需要先安裝Hexo上傳倉庫的工具,執行
npm install hexo-deployer-git --save
,這樣你寫好的文章才能部署到github伺服器。 - 執行命令(建議每次都這樣做,先清除、再編譯上傳)
hexo clean
hexo generate
hexo deploy
複製程式碼
- 在瀏覽器輸入
http://yourgithubname.github.io
,這樣你就可以看到自己的線上部落格了~
優化部落格
有些童鞋一開始看到這部落格,哇,好醜~大家都有經驗的,預設的主題都是不好看的,這裡有Hexo主題網址,目前有195個主題任你選,每週換一個都可以換三年~(當然你能這麼折騰我也服了~)具體怎麼安裝主題,點進去對應的地址都有詳細說明,這裡就不贅述了。這裡秀一波我的個人部落格地址,有空過來刷刷PV也是很ok的~
寫部落格
最後的最後,怎麼寫部落格?
- 新建文章:
hexo new '文章名'
,然後在blog的source資料夾就可以看到了。 - 寫內容:支援markdown語法,所以我自己現在是用掘金自帶的markdown編輯器寫完後把文章複製過來的,完美相容~
- 本地看過沒問題就上傳到github,步驟前面也說了,一般上傳後github伺服器會有點延遲,十分鐘後重新整理應該就有最新的blog了。