5分钟 0元搭建个人独立博客网站（二）
文/北媽
閱讀本文需要 5.1分鐘
一
接著第一篇 5分鐘建立獨立網站系列，戳這里：《5分鐘 0元搭建個人獨立博客網站（一）》
這個Hexo、GitPages系列，其實網絡很多教程，但都不夠易懂甚至很亂，這個系列沒什么技術含量，但對步驟的合理梳理，卻要求很高。所以，我應粉絲要求，抽空出一個這個系列。
本系列分為三篇（說明一下：此系列，寫的很詳細、也很累，比網絡其他教程都清晰易懂，所以每篇都會打破我，每月底才開一次贊賞的規矩，這幾篇我都會開贊賞，O(∩_∩)O）。
第一篇，我簡要介紹了如何在本機安裝、運行、預覽 hexo博客系統；還有和github的關系，github起了什么作用。不明所以的，請去回顧第一篇，這里不在闡述，
今天是第二篇，主要講解如何一鍵、一行命令發布到github、gitpages；如何實現真正的外網訪問，也就是讓地球所有的人都能搜到你的網站。
第三篇講解，如何美化自己的博客頁面，畢竟“丑”，是我們絕對不能容忍的；還有如何在靜態博客 ，一鍵添加 評論功能；而且不用你去開發；再加一個SEO 建議。
廢話不說，開始。下圖是我執行本機命令?
hexo init，npm install， hexo g ， hexo s 的本地演示結果
hexo init ?// 這個是：hexo自動初始化配置文件、包括所有paceage.json依賴包
npm install // 這個不用北媽解釋吧！安裝所有paceage.json里的包
hexo g ?// 這個作用是：自動將md文件，生成靜態html、css文件
hexo s ?// 啟動本地hexo 服務器 http://localhost:4000/
然后打開，http://localhost:4000 ?就出現了下圖本地樣式。
當然了，默認的網站title是 Hexo。我把它改了，改成了我的標簽，作為例子。
至于在哪里改，下面會講解一個配置文件，一目了然，一看就明白應該。
二
認識目錄
如果你在第一篇的教學命令，都執行正常后，你本地hexo文件目錄應該是這樣。
先來介紹下幾個重要目錄作用，不然你會一臉懵比。
其中?_config.yml?這個很關鍵。是你博客的全局配置文件，包括和github上傳鏈接，都要在這里配置。
還有，我剛才說的網站title標題，就是在這里
而下圖這里， _posts 下面則是你要用makedown語法，寫的博客文章源文件。
看到了嗎？我本地第一篇文章標題是：
然后，在我本地的hello world.md里是對應的。我寫什么，他就更新什么，美不美？而且他會自動刷新。
寫完，在命令行輸入執行?hexo g 之后，都會自動生成靜態文件 到 public 文件夾。然后在本地他會自動生成文章列表。
三
本地直接上傳到Github
還記得北媽在第一篇讓你在gayhub，建立的那個 xxx.github.io.倉庫嗎
這里就要起到作用了，它要作為你免費的服務器，來存你的博客文件了。
現在免費的服務器有了，那么我們寫完了文檔，怎么從本地直接上傳呢？不可能一個文件一個文件的去上傳吧？
有方法，按我的配置好后，一行命令就可以自動上傳到 git倉庫了。
1、執行命令?安裝 deploy git 插件
npm install hexo-deployer-git --save
// 這個是：hexo 和git自動對接上傳的關鍵組件
WARN 不用管它，那是建議，出現下面的提示，包就是安成功了。
2、在主題配置文件_config.yml中修改倉庫地址。
拉倒??_config.yml 最下面一行。配置
deploy: ?type: git ?repository: ? ?github: git@github.com:<username>/<username>.github.io.git
?branch: master
下圖這是我的 地址
3、配置提交 github 認證方式
注意這里，執行hexo d，會直接提交github倉庫，如果你沒有認證github和本地的關系，會提示你輸入用戶名、密碼，已驗證你的身份。
我是推薦SSH公鑰方式認證，但其實https 方式也行。只不過每次你往上更新，可能要輸入你github 的用戶名、密碼。
就像這樣?
如果不想每次更新都輸入，那你就要學會配置SSH全局公鑰了。至于怎么配置全局ssh，我這里本來不想講解了，就從其他地方直接放個鏈接吧，你們按照這個走就行了。
在 github 上添加 SSH key 的步驟：
https://www.cnblogs.com/ayseeing/p/3572582.html
配置好你倉庫地址和認證方式后，請執行?hexo d?這個命令是把你本地的hexo博客靜態文件，一鍵上傳到github倉庫。
如果成功 會是這樣，生成一堆。
也就是把我本地的 http://localhost:4000/ 的文件，發布到xiaobei666.github.io 倉庫。
本來這個倉庫剛建立是空的。然后執行 hexo d并且成功后，刷新后是這樣的。
那么ok，這里大家伙都熟悉了，就是常用的 css html img這些，純凈的靜態資源。
里面有一個index.html.那么這個就是你主頁的訪問地址。現在你和其他人在瀏覽器輸入 ：https://xiaobei666.github.io (當然是你自己建立的名字)?
就可以直接在線訪問，自己的博客了。
四
這里說明一下：
其實?GitHub Pages? 這個服務，是github官方給大家的福利，只要你建立的倉庫 名稱符合 xxxx.github.io 這個規則名字，就默認開啟?GitHub Pages。
然后你這個倉庫，只要有index.html 命名文件，理論上都可以通過? https：//xxxx.github.io 直接訪問到，懂了嗎？
至于為何繞這么大一圈，介紹那么多命令和hexo，那是因為hexo 可以直接美化頁面（下篇講），還有支持最便捷的makedowm 語法，一件生產靜態文件，最主要能一鍵提交到github，你想想省了你多少時間？
彩蛋操作～ 配置真正的域名
現在默認的域名還是?xxx.github.io，是不是很沒有感覺？想不想也像我一樣有一個專屬域名呢？
北媽個人博客地址：
www.guoxiaobei.com
1、首先你需要去域名注冊商（阿里云騰訊云等）買一個域名，看你個人了。反正價格都差不多。
3、本機先ping github.io ，得到真實的IP地址。
然后前往域名控制臺解析此域名到github.io的數字 ip 地址，即185.199.109.153
以我的阿里云域名為例，如下圖所示，添加兩條解析記錄：添加 A 記錄指向?185.199.109.153?即可。
按我的記錄，自行添加即可。
3、去根站點下source目錄中添加名稱為?CNAME 的文件。就叫做CNAME，這里不能錯.
文件內容是你剛才購買的域名guoxiaobei.com，不要添加www、不要添加www、不要添加www。
4、命令行執行hexo d發布站點到 GitHub 庫，這時在 Git 庫應該就能看到 CNAME 文件，至此自定義域名設置完畢，過個幾分鐘，使用xxx.com即可訪問站點。
ok，這篇到這里就齊活了，完美實現了 訪問 xxx.com讓全世界的人都能看到你了。你如果還不會，請仔細研究吧。
北媽累死了，我想你應該知道怎么做。
五
每天金句：“孤獨一人也沒關系，只要能發自內心地愛著一個人，人生就會有救。哪怕不能和他生活在一起。”
老規矩，是平時不開贊賞，月底統一交租，但不耽誤你點?[好看]。
但，因為這個系列寫的好，而且寫的超級累，并且讓你擁有了真正意義上的獨立博客。
所以，今天我還要開贊賞！
延伸閱讀：
1.?有些人真是帶不動...在強調一次，基礎的重要性！
2.?5分鐘 0元搭建個人獨立博客網站（一）
3.?年底了，小心這些現象。別再無動于衷
每天只想聽你們說：小北最帥！
長按掃碼關注我
前端你別鬧
總結
以上是生活随笔為你收集整理的5分钟 0元搭建个人独立博客网站（二）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 能源15A1,A2燃烧学期末试题2018
- 下一篇： 第 4 节：前端面试指南 — JavaS