GitHub Pages + Hexo 我的網頁搭建過程

前言

首先不用購買服務器，小白能夠搭建，只須要按照步驟配置，炒雞簡單。

• 瞭解GitHub pages 和 Hexo

換個角度講：

咱們經過github pages 搭建咱們的主頁服務，而後經過hexo挑一個博客框架嵌套進去。這樣就完成了咱們的我的主頁。

• 個人博客：gitkyne.com

整個過程分三部分：

1. 啓動GitHub pages的我的主頁服務；
2. 配置Hexo；
3. github pages 和 Hexo 合二爲一

1、啓動GitHub pages的我的主頁服務

1. 註冊GitHub帳號
   • 地址：github.com/
   • 看好本身的useranme
2. 開啓GitHub pages服務
   • 新建倉庫（create a new repository） 倉庫名字要注意：username.github.io

     

   • 在倉庫下的setting中找到GitHub Pages部分 Choose a theme 選擇一個主題樣式

     

     

   • 保存以後即完成 打開: KyneMaster.github.io （username.github.io）

2、配置Hexo

• 這一部分須要先配置兩個環境： node.js 、 Git
• 不一樣操做系統不一樣安裝方法，自行查閱網上教程

1. 安裝node.js

   安裝成功測試 終端輸入node -v 輸出版本及安裝成功

2. 安裝git

   安裝成功測試 終端輸入git version 輸出版本及安裝成功

3. 安裝hexo

   npm install hexo-cli -g
   hexo init blog(生成的博客文件夾的名字，自定義,會自動在對應執行該語句的路徑生成對應的文件)
   cd blog
   npm install
   複製代碼

   新建完成後，指定文件夾的目錄以下：

   .
   ├── _config.yml
   ├── package.json
   ├── scaffolds
   ├── source
   |   ├── _drafts
   |   └── _posts
   └── themes
   
   複製代碼

   安裝成功測試 終端輸入hexo -v 輸出版本及安裝成功

4. 運行hexo

   hexo g (編譯)
   hexo s（啓動服務）
   複製代碼

   而後會提示你打開 http://localhost:4000 以下：

   

   到這裏基本hexo已經配置完畢

5. 配置主題

   那麼接下來就是更換主題。地址：hexo.io/themes/

   點擊喜歡的主題名，跳轉到GitHub代碼，下載或者克隆代碼。完成以後，找到剛纔hexo安裝完成文件目錄中的themes文件夾，將主題文件粘貼到此處。

   此處注意兩個配置文件，一個是hexo安裝完成的目錄中的_config.yml和下載主題中的_config.yml.

   在hexo的_config.yml找到themes，將後面代碼改爲下載主題的名稱。

   而後編譯啓動，能夠本地localhost:4000查看此主題。

   到此完成該部分。

3、合二爲一

那麼最後一步就是將GitHub的線上主頁同咱們下載配置的hexo博客主題合二爲一。
複製代碼

• 找到hexo中的配置文件_config.yml ——> 打開 ——> 找到Deployment部分

  deploy:
      type: git
      repository: https://github.com/KyneMaster/KyneMaster.github.io.git (此連接改成本身的)
      branch: master
  複製代碼

  而後執行：

  hexo clean （清除掉編譯出來的public文件）
  hexo g     （編譯）
  hexo d     （部署到GitHub）
  複製代碼

  稍等片刻，打開線上username.github.io，便可見證奇蹟。

PS.

1. _config.yml配置文件包含導航攔、連接、頭像等各類配置，方便自定義。

2. 點擊個人kynemaster.github.io能夠發現，我跳轉到了 gitkyne.com。這裏我購買了域名。

   • 你能夠在阿里雲https://wanwang.aliyun.com/domain/searchresult#/?keyword=&suffix=com 購買域名，能夠先查閱相關攻略
   • 購買完成以後須要進行解析

     

     

   • 而後在GitHub setting那找到GitHub pages

     

   • save 完成

3. 寫文章

   文章地址：

   

   也能夠經過cmd命令建立hexo new demo.md 上傳一樣進行三步走

   hexo clean （清除掉編譯出來的public文件）
   hexo g     （編譯）
   hexo d     （部署到GitHub）
   複製代碼

4. 部署次數多了你會發現，每次都須要調整域名 在上圖source文件下新建CNAME文件，文件內容爲你的域名，這樣每次不會被重置