了解githubPages hexo搭建部落格的原理

2021-07-27 12:11:30 字數 3219 閱讀 3289

之前用githubpages+hexo搭建了乙個自己的部落格:sunshine940326.github.io(就是你現在看到的部落格),當時還不知道怎麼使用git和github,所以只是跟著網上的教程在一步一步操作,現在了解了git知道怎麼使用之後才慢慢明白其中的原理。

什麼是github pages

github是專案託管**,列出了專案的原始檔,所以github 有乙個pages功能,可以自定義主頁,用來代替預設的列出源列表的這個頁面

所以,github pages可以被認為是使用者編寫的、託管在github上的靜態網頁。

下面是github pages 官方文件:

github提供兩種型別的主頁(

我們建立的部落格屬於個人頁面(也可以建立為專案主頁,不過預設的網域名稱不一樣,個人理解)

使用個人或組織頁面

使用個人或組織頁面,需要先建立乙個和你的賬號同名的倉庫,比我我的github賬號是sunshine940326,那麼我需要建立乙個名為sunshine940326.github.io的repo,然後在master上提交你的專案**,這樣就可以通過**:來訪問我的個人部落格。

使用專案主頁的方法如下

user pages只有乙個, project pages可以有多個, 對於個人部落格而言, 兩種方式都可以.如果使用者申請了自己的網域名稱, 還可以使用cname檔案自定義domain name, 這樣訪問你的網域名稱就自動訪問到github上的頁面. 使用者也可以自定義404頁面.

說完了githubpages,繼續來說一下什麼是hexo

1. 什麼是hexo

google的第一條結果的解釋是這樣的

點開這個鏈結就是中文版的官網了,強烈建議大家多看看官方教程,比看其他的教程有用多了

對於windows使用者來說,建議使用安裝程式進行安裝。安裝時,請勾選add to path選項。

安裝node是需要配置環境變數的

安裝完成之後開啟命令列,輸入 node -v,如果有返回版本號,即說明安裝成功

4. 安裝hexo

當你安裝好了git和node之後,就可以安裝hexo了,好激動有沒有,先不要激動的太早,這才剛開始= =

只需要輸入下面的**就可以安裝hexo

在任意位置新建乙個資料夾名為hexo

$ cd d:/hexo

$ npm install hexo-cli -g

$ hexo init blog

$ cd blog

$ npm install

$ hexo g # 或者hexo generate

$ hexo s # 或者hexo server可以在http://localhost:4000/ 檢視

至此,你可以在瀏覽器輸入http://localhost:4000/,預覽你的部落格了,通常都是一篇hello world= =

然後我們就需要將我們的專案部署到github上

首先需要明白所謂部署到github的原理。

之前步驟中在github上建立的那個個人專案的repo(sunshine940326.github.io)乙個最大的特點就是其master中的html靜態檔案,可以通過鏈結http:// .github.io來直接訪問。

hexo -g 會生成乙個靜態**(第一次會生成乙個public目錄),這個靜態檔案可以直接訪問。

需要將hexo生成的靜態**,提交(git commit)到github上。

然後我們需要配置_config.yml配置檔案

目前我安裝所用的本地環境如下:(可以通過hexo -v檢視)$ hexo -v

要想部署到github,我們需要作如下配置(貌似不同版本的hexo配置不同,主要是hexo2.0和hexo3.0,所以你需要先檢視自己安裝的hexo版本)

注意type:後面有乙個空格

將repository後面的鏈結換成你的部落格名字# deployment

docs:

deploy:

type: git

repository:

然後在執行

$ hexo clean

$ hexo g

$ hexo s

$ hexo d

5. 命令解釋:

至此,已經完成了github pages+hexo搭建部落格的步驟,現在需要裝飾你的部落格

1. hexo 主題配置

就和當時我們用的qq空間一樣,我們可以直接用寫好的主題,然後我們就只需要寫文章就好

這裡以主題next為例進行說明。

2. 安裝主題$ hexo clean

$ git clone themes/next

3. 啟用主題

修改hexo目錄下的_config.yml配置檔案中的theme屬性,將其設定為next。

4. 更新主題

$ cd themes/next

$ git pull

$ hexo g # 生成

$ hexo s # 啟動本地web伺服器

現在開啟http://localhost:4000/ ,會看到我們已經應用了乙個新的主題。

你可以在themes·hexo上選擇你的主題,我使用的next主題

參考next官方文件,內容十分詳盡

了解for迴圈

for var i 0 i 10 i for迴圈非常靈活,樣式不固定 for 是關鍵字,括號裡面三個語句用兩個分號隔開,裡面是迴圈體 例如列印十個a for var i 0 i 10 i 執行順序如下 1 var i 0 2 if i 10 把條件判斷放到 if 裡面,條件判斷成立,就執行 中間的執...

Redis持久化機制!!!了解了解

redis是我們常用的key value資料庫,其中可持久化的特性也是被各路開發者喜愛。接下來,我們來簡單聊聊redis的兩種持久化機制rdb和aof。一 rdb 1 rdb持久化是指在指定的時間間隔內將記憶體中的資料集快照寫入磁碟,實際操作過程是fork乙個子程序,先將資料集寫入臨時檔案,寫入成功...

了解了解堆排序的順序儲存

a 構建乙個堆分為兩步 1 建立一棵完全二叉樹 2 調整為乙個堆 b 演算法描述 建立一棵完全二叉樹 while 有雙親 c 時間複雜度為 o nlogn 空間複雜度為 o 1 是不穩定排序!auther yangchao date 2019 7 31 堆排序思想 完全二叉樹的定義 前 h 1 層為...