Hexo+github搭建个人博客-环境搭建篇
一、概述
我們使用Hexo + Github搭建個人博客,我們自然不能錯過,事不宜遲,我們現在立馬來認識一下,他們究竟是何方神圣吧。
1.1 關于 GitHub
1.1.1 Github
接觸編程一段時間后,相信大家都會開始了解到版本控制,如SVN、HG。是的,Github是一個知名的 分布式版本控制系統 以及 開源代碼庫。
在本次博客搭建中,也是需要大家能夠具備一定的Git版本控制知識的。大家放心,后文會對必須用到的命令進行講解,但如果你想要對它有更詳細的認知,可以在空余的時候參考以下鏈接:
鏈接: github
1.1.2 Github Pages
在Github里面,每一個項目都擁有它的一個主頁,列出項目的源文件,但是對于新手來說,看到那么多的源代碼,只會讓人感到頭暈腦脹,無從下手,他更希望的是,該項目有一個簡明易懂的頁面,告訴他每一步要怎么去做。
因此,Github就設計了Github Pages這個功能,允許用戶自定義項目首頁,用來替代默認的源碼列表。所以,Github Pages可以被認為是用戶編寫的、托管在github上的靜態網頁。
有的用戶說,我前端渣渣,這個功能對我來說,并沒有什么卵用,還不如用個記事本寫好上傳給大家看。Github似乎早就考慮到了這一點,設計了幾個漂亮的模版供用戶直接選擇使用。
鏈接:點擊訪問
而我們也正是利用了Github Pages這一個特性,去搭建屬于我們的個人博客。
1.2 關于 Hexo
按照官網的說法,Hexo是一個快速、簡潔且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。
鏈接:hexo
1.3 Hexo + Github
通過上面的介紹,大家對Hexo和Github已經有了大概的了解。
沒錯,我們的方式就是,利用Markdown進行博客的編寫,通過Hexo這個框架解析生成靚麗的靜態頁面,然后部署到Github上供大家瀏覽。
這種方法具備好處是:
- 免費,無限流量。
- 享受git的版本管理功能,不用擔心文章遺失。
- 專注于我們自己的博客內容,其他諸如服務器管理的事情交給Github即可
當然啦,萬事有利有弊。這種方式也有它的弊端:
- 有一定技術門檻,你必須要懂一點git和網頁開發。
- 生成的是靜態網頁,添加動態功能必須使用外部服務,比如評論功能我們使用多說。
- 不適合大型網站,因為沒有用到數據庫,每運行一次都必須遍歷全部的文本文件,網站越大,生成時間越長。
但是,這已經基本滿足我們的基本需求了。
二、環境搭建
說了那么多,終于到正文啦!
本文將以 windows系統 和 Hexo 3.1.1 為例進行講解。
2.1 環境搭建 - Git
下載地址: 點擊下載
如圖,根據你的系統點擊下載相應平臺的Git進行安裝,這里我們以windows系統 為例,自然選擇的是windows
下載并且安裝完成后,打開終端執行以下命令進行驗證
$ git --version如果終端輸出類似下面的內容,說明安裝成功了
git version 2.3.2 (windows Git-55)2.2 環境搭建 - NodeJS
下載地址: 點擊下載
如圖,根據你的系統點擊下載相應平臺的NodeJS進行安裝,在release中選擇相應的版本安裝
windows中安裝比較簡單,會自動的設置好環境變量,所以只要把下載下來的安裝包解壓,運行.exe文件安裝即可!
2.3 環境搭建 - Hexo
1> 執行以下命令進行Hexo框架的基本安裝
$ npm install hexo-cli -g2> 安裝便于自動部署到Github上的插件
$ npm install hexo-deployer-git --save3> 安裝atom生成插件,便于感興趣的小伙伴們訂閱
$ npm install hexo-generator-feed --save4> 安裝博客首頁生成插件
$ npm install hexo-generator-index --save5> 安裝歸檔生成插件
$ npm install hexo-generator-archive --save6> 安裝tag生成插件
$ npm install hexo-generator-tag --save7> 安裝category生成插件
$ npm install hexo-generator-category --save8> 安裝Sitemap文件生成插件
$ npm install hexo-generator-sitemap --save9> 安裝百度Sitemap文件生成插件,因為普通的Sitemap格式不符合百度的要求
$ npm install hexo-generator-baidu-sitemap --save2.4 hexo環境升級
//以下命令分別執行即可 npm install -g npm-check //安裝npm-check npm-check //查看系統插件是否需要升級 npm install -g npm-upgrade //安裝npm-upgrade npm-upgrade //更新package.json //在執行npm-upgrade命令后會要求輸入yes或者no,直接輸入Yes或Y即可 npm update -g //更新全局插件 npm update --save //更新系統插件2.5 linux環境與mac互通
1、通過git,將mac上的博客源碼push到倉庫;
2、linux對倉庫進行pull,拉取博客源碼;
3、linux安裝hexo環境;
4、后臺運行hexo生成命令:
- 輸入命令:nohup hexo g &;
- 回車后臺運行,使用ps -ef | grep hexo 或 top 查看是否運行;
- 輸入命令:exit,退出終端,可一直在后臺運行。
5、將生成的public和源碼上傳到git倉庫;
6、mac拉取更新;
7、使用阿里云oss進行上傳更新博客。
三、結束語
至此,關于利用Hexo + Github 搭建個人博客所需要的基本環境已經準備完畢。
最后,如果大家想要查看通過Hexo + Github搭建的博客的最終效果的話,可以訪問:http://ouyangsihai.cn
總結
以上是生活随笔為你收集整理的Hexo+github搭建个人博客-环境搭建篇的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: maven私服-详细部署搭建笔记
- 下一篇: Hexo+github搭建个人博客-博客