前言
好的博客主頁不僅能夠分享自己的技術知識,更能夠展示博主的技術實力。
本文將結合作者的實踐,爲讀者講解如何在GitHub
上利用Hexo
,快速搭建一個可以在互聯網上自由訪問的博客主頁。
作者的博客主頁:https://jiangjiaheng.github.io/ 。
技術棧
1.GitHub
:允許用戶在自己的代碼倉庫創建一個博客主頁。
2. Git
:代碼倉庫管理技術,連接GitHub
與本地代碼。
3. Nodejs
:搭建博客主頁的技術基礎,本地創建運行博客主頁。
4. Hexo
:基於nodejs
的一個博客框架,可以快速生成博客主頁。
大綱
- 技術環境準備。
- 創建
GitHub
博客倉庫。 Hexo
生成博客主頁。Git
上傳博客主頁。- 訪問
GitHub
博客主頁。
實例講解
1. 技術環境準備
1. GitHub、Git
首先你需要在GitHub上註冊一個賬號,然後通過Git建立連接,具體操作過程請參考這篇文章。
2. nodejs、hexo
進入nodejs
的官網https://nodejs.org/en/download/,選擇自己電腦適合的版本下載即可。
安裝完成後,在命令行中輸入node -v
查看nodejs是否安裝成功。
安裝完nodejs後,在命令行中輸入以下命令,安裝hexo。
npm install -g hexo
安裝完成後,輸入hexo
查看是否安裝成功。
完成上述準備工作後,我們就可以開始搭建自己的博客了。
2. 創建GitHub
博客倉庫
在GitHub中創建新項目。
在項目中輸入項目名稱:Owner+.github.io
,例如你GitHub
註冊名稱爲Zhangsan
,那麼你這個項目名稱就是:zhangsan.github.io
。
GitHub
會自動檢測到github.io
,並識別爲博客主頁。
填寫完項目信息後,點擊創建,生成博客主頁。
這個時候,你就可以直接在瀏覽器輸入:https://zhangsan.github.io
進行訪問了。
3. Hexo
生成博客主頁
在電腦中新建一個空白文件夾,在該文件夾下打開命令行,輸入:hexo init
生成hexo項目。
輸入:hexo s
開啓本地運行,打開瀏覽器訪問 http://localhost:4000 即可看到內容。
4. Git
上傳博客主頁
接下來,我們要做的就是把hexo生成的主頁上傳到GitHub上,打開_config.yml
文件。
如圖所示配置git
信息,也就是把GitHub
的博客主頁倉庫配上去,就可以了。
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repository: [email protected]:zhangsan/zhangsan.github.io.git
branch: master
這個文件中還有其他的配置信息,例如名稱、主題等等,可以自己慢慢去探索,這裏不多說了。
完成配置後,執行npm裏面的配置命令。
- clean:刷新項目,清除生成的文件;
- build:生成上傳文件;
- server:開啓本地預覽服務;
- deploy:上傳生成的文件到GitHub上。
依次執行:clean
、build
、deploy
命令即可完成hexo博客主頁上傳。
5. 訪問GitHub
博客主頁
上傳成功後,直接訪問自己的博客地址,就可以了。
結語
以上就是本文的全部內容了,感謝你的閱讀,文中部分技術要點受限於文章篇幅,並沒有展開講解,如果你有什麼疑問或者建議,歡迎你隨時留言,互相討論。
最後,祝工作順利,生活幸福。