有朋友會問我自己怎么搭個博客，復(fù)不復(fù)雜云稚，已經(jīng)有了域名應(yīng)該怎么搞隧饼。其實當(dāng)時我自己弄的時候，雖然照著網(wǎng)友寫的步驟静陈，但還是折折騰騰的燕雁，出了問題也是一頭霧水。所以窿给，考慮自己寫一篇這種文章贵白，盡量能寫的清楚一些。我會假設(shè)你對這方面沒什么了解崩泡，盡量給你解釋你的每一步操作都做了什么禁荒，會有什么影響。當(dāng)然時間緊促角撞，如果你有什么建議呛伴，非常希望你能告訴我勃痴，我會盡快修改。
簡單說一下要講的事情
Hexo是這樣一個東西热康，它有很多工具能幫你快速搭建一個網(wǎng)站沛申，也有很多的主題可以選擇。有了這個東西姐军，你只需要做一些簡單的配置铁材，就可以有一個組織良好的網(wǎng)站以及不錯的界面。特別適合寫寫博客等奕锌。
其實網(wǎng)站也可以理解為一大堆組織良好的頁面文件著觉，平時說的上網(wǎng)，可以理解成在瀏覽器打開了別人電腦上的文件惊暴。此處的別人電腦饼丘，就是我們平時說的服務(wù)器。借助Hexo搭建了自己的站點之后辽话，你也需要這么一個服務(wù)器肄鸽，一直運(yùn)行著，提供訪問服務(wù)油啤。
你當(dāng)然可以將自己的電腦作為服務(wù)器連到外網(wǎng)一直開著典徘。但所幸不用這么麻煩，有些網(wǎng)站免費(fèi)提供托管服務(wù)村砂，你把生成的網(wǎng)站內(nèi)容放到他們的服務(wù)器上(這個動作我們稱之為部署**)烂斋，大家就能通過他們的服務(wù)器訪問了。提供這種服務(wù)的础废，主要有兩個：
- 最出名的就是
Github Pages汛骂，所有的xxx.github.io都是使用的這種方式。 - 國內(nèi)的
Coding Pages评腺，訪問速度要更好帘瞭，所有的xxx.coding.me都是使用的這種方式。我這篇文章也是使用這種方式蒿讥。
當(dāng)我們把通過Hexo搭建的站點部署上去后蝶念，我們就可以通過xxx.github.io或是xxx.coding.me訪問我們使用Hexo搭建的站點了。
這時芋绸，你可能會想媒殉，要是能使用自己的域名就更好了，畢竟一個域名現(xiàn)在也不貴摔敛，便宜點幾塊錢就能拿下廷蓉。到這里就涉及到域名解析的問題了，簡單說就是達(dá)到輸入我的域名马昙，顯示你的內(nèi)容的效果桃犬。
主要就是這些東西刹悴。
文章主要內(nèi)容有：
- 安裝
Hexo - 寫文章
- 配置主題
- 托管到
Coding Pages - 自定義域名
- 日常的使用流程
安裝Hexo
安裝Hexo，需要依賴Node.js和Git這兩個東西攒暇，這里提供了目前在Hexo使用穩(wěn)定較新的版本土匀，請先點擊下載安裝。
安裝上邊的兩個軟件之后形用，接下來在終端命令行執(zhí)行下邊的命令（Windows的CMD窗口）安裝Hexo
npm install -g hexo-cli
建站
初始化Hexo工作的目錄就轧，你的站點文件也會在這里面：
- 先找一個合適的目錄
- 使用命令行切換到這個目錄，可以使用
Shift+鼠標(biāo)右鍵選擇"在此處打開PowerShell窗口"田度。 -
hexo init <folder>钓丰，將<folder>替換為你要創(chuàng)建的文件夾名稱，初始化該目錄每币。約定一下，之后我就用<folder>代表這個你新建的目錄了琢歇。 -
cd <folder>進(jìn)入該目錄兰怠，其實這時候已經(jīng)可以運(yùn)行了。但是穩(wěn)妥起見李茫，還是先執(zhí)行完下一步揭保。 -
npm install安裝Node的依賴模塊，就是文件夾node_modules中的東西魄宏，是Hexo的一些依賴模塊秸侣。
安裝完成以后，先來簡單看看這個目錄有什么：
-
_config.yml宠互，這個就是網(wǎng)站的配置信息了味榛，網(wǎng)站的標(biāo)題之類的。以及之后我們要設(shè)置主題予跌、設(shè)置外網(wǎng)托管(部署)都是在這里搏色。 -
source，源目錄悠菜，你的文件就是保存在這里面的撞鹉，你的主題會根據(jù)你的源文件偷仿，生成統(tǒng)一樣式的界面。 -
themes航邢，主題。剛安裝完Hexo只有一個landspace骄蝇，這是默認(rèn)主題膳殷。怎么換主題我們之后再說。
運(yùn)行一下試試看：
命令行定位到
<folder>位置乞榨，輸入hexo s -g秽之，這個命令的意思是当娱，先(-) 執(zhí)行 生成(g) 再 啟動服務(wù)器(s)。然后你就可以在瀏覽器打開localhost:4000考榨，應(yīng)該能看到如下頁面跨细。
寫篇文章？
這里不推薦官方的那種了河质，說說我平時怎么用的吧冀惭。
還記得之前分析目錄時提到的那個source目錄么，就是<folder>/source掀鹅，打開它之后能看到一個_posts目錄散休，打開_posts，我們就在這里面編輯文件（寫乐尊、改戚丸、刪）了。
在這里面扔嵌，你可以寫Markdown限府、HTML都可以，你的主題會根據(jù)你的內(nèi)容生成樣式豐富的文檔痢缎。但是和一般的Markdown胁勺、HTML不一樣的是，在文件的開頭需要配置一些東西独旷。打開你的Hello-world.md文件看一看署穗，它的開頭有這樣一些東西。
---
title: Hello World
---
上面的內(nèi)容就是說嵌洼，我這篇文章案疲，發(fā)布的時候，標(biāo)題(title)是Hello World麻养。這里注意一個細(xì)節(jié)络拌，你的文件標(biāo)題其實是Hello-world。發(fā)現(xiàn)了么回溺？它是按照你的配置信息去生成最終文檔的春贸。
這里劃個重點，不管是修改
_config.yml遗遵，還是在這里萍恕，選項值(比如這里的Hello World)前面 必須加空格！ 你可以把空格去掉試試看车要。
貼一個我一般使用的配置項允粤，配置名字、時間、還有多個標(biāo)簽：
---
title: 關(guān)于Socket
date: 2018-01-12 20:11:00
tags:
- 計算機(jī)網(wǎng)絡(luò)
- Socket
- C#
- Python
---
更多詳細(xì)的配置信息可以查看Hexo文檔/Front-matter类垫。
想換個主題司光？
可以查看自己喜歡的主題，選擇時除了美觀還應(yīng)該考慮到以下幾點：
- 自適應(yīng)悉患，是否提供移動端UI
- 是否需要評論残家、統(tǒng)計等功能，該主題有沒有考慮到售躁，如果已經(jīng)集成的話會很省事坞淮。
以NexT主題為例
NexT是一個比較出名的主題，這里我們以它作為例子陪捷。
通過搜索引擎搜索Hexo NexT可以找到主題的相關(guān)信息回窘，比如這里我就找到了NexT的文檔。
首先市袖，獲取NexT主題
目的是將NexT主題放到<folder>/themes文件夾下啡直，和landscope平級。
在命令行輸入以下指令
cd <folder>
git clone https://github.com/iissnan/hexo-theme-next themes/next
第一條指令進(jìn)入<folder>目錄苍碟，第二條指令將NexT的文件從Github克隆到了themes/next文件夾付枫。
現(xiàn)在你的themes文件夾下應(yīng)該有了一個next文件夾，接下來我們就來使用它驰怎。
接下來，應(yīng)用NexT主題
打開<folder>目錄下的_config.yml二打，找到theme: landscope條目县忌，將landscope換成next，即剛才創(chuàng)建的目錄名（注意分號后跟空格）继效。最終就是theme: next這樣症杏。
現(xiàn)在，我們重新生成并啟動服務(wù)器：
hexo s -g
打開localhost:4000觀察一下：
Wow瑞信，大變樣厉颤！
之后需要更多主題相關(guān)的配置，可以去查看該主題的文檔或者從搜索引擎搜索該主題凡简。不一樣的主題逼友，都有些自己特殊的配置。這里就不仔細(xì)說了秤涩。
想要外網(wǎng)訪問帜乞？
首先，由誰來托管筐眷？
github.io是很出名很好的選擇黎烈，但是在我看來，對大部分人來說coding.me或許是更好的選擇。Coding處于國內(nèi)照棋，網(wǎng)絡(luò)訪問比起Github也要順暢很多资溃。
也可以兩個一起用，我剛開始就是這樣的烈炭，但是后來發(fā)現(xiàn)使用github.io完全沒必要溶锭，并且后邊如果需要提交站長平臺或是做統(tǒng)計，還要做針對性的工作梳庆。我就放棄了github.io暖途。另外那種說國外訪問github.io，國內(nèi)訪問coding.me膏执，對我來說驻售，國外訪問coding.me無非多了幾十毫秒的延遲。另外更米，還有一個小問題欺栗，真的有外國人看你的中文博客么......
所以，我這次就使用Coding做演示征峦，我也建議你使用Coding迟几。如需要使用Github，這一塊也可以查一下別的教程栏笆。網(wǎng)上已經(jīng)有大量的Github Pages的內(nèi)容类腮。
Coding Pages
注冊
首先，去Coding注冊一個賬號蛉加。這里需要注意的是起名字蚜枢，如果之后不打算買域名的話，就要使用{yourname}.coding.me這樣的域名了针饥。
創(chuàng)建項目
參考自Coding Pages
- 點擊「創(chuàng)建新項目」
- 項目起名
{yourname}.coding.me厂抽，并勾選「使用README.md初始化項目」 - 通過倉庫中的「Pages 服務(wù)」菜單進(jìn)入設(shè)置頁面，在部署來源中選擇「master 分支」丁眼，保存后您的 Pages 已啟動運(yùn)行
- 這時打開
{yourname}.coding.me筷凤，會是404頁面，因為倉庫里什么都沒有苞七。這時如果在倉庫根目錄添加一個index.html藐守，再次打開網(wǎng)址就是顯示的這個頁面了。(倉庫更新后有延遲蹂风，多刷新幾遍)吗伤。
這里我們就不用自己去寫網(wǎng)頁了，我們把自己剛才使用Hexo搭建的網(wǎng)站硫眨，想辦法搬到{yourname}.coding.me(其實就是放到你的倉庫中去)就可以了足淆。稱為Hexo部署巢块。
Hexo部署
我們先設(shè)置一下部署選項，把Coding的信息添加到配置中巧号。還是在那個配置文件里族奢，_config.yml
文件最后面有deploy這一項，如果沒做修改的話丹鸿，它是這樣子的
deploy:
type:
空空如也越走，我們做一下修改：
deploy:
type: git
repository:
coding: {address}
branch: master
把{address}替換成你的倉庫地址就可以了。
想要得到你的倉庫地址靠欢，參看下圖廊敌，先點擊「HTTPS」，然后點擊后面的「復(fù)制」按鈕就得到地址了门怪。
修改完畢骡澈，保存，接下來我們使用一條命令掷空，生成并部署：
hexo d -g
這條命令的意思是：先(-) 執(zhí)行 生成(g) 肋殴，之后執(zhí)行 部署(d)
如果遇到了這個錯誤：
ERROR Deployer not found: git
這是因為需要安裝一個模塊hexo-deployer-git，用于git的部署坦弟，需要執(zhí)行的命令是
npm install hexo-deployer-git --save
安裝完畢护锤，我們再嘗試部署。
這次會彈框酿傍，讓你輸入你的賬號名和密碼烙懦。
都沒問題的話最后會顯示：
INFO Deploy done: git
這時，你再去Coding的網(wǎng)站打開你的倉庫赤炒，就會發(fā)現(xiàn)一大堆東西氯析，都是Hexo自動幫你創(chuàng)建的。
另外可霎，這也就意味著，你可以打開{yourname}.coding.me查看效果了宴杀。
想用自己的域名癣朗？
首先，不管是阿里云萬網(wǎng)還是什么別的地方旺罢，挑一個喜歡的域名旷余。
買完后，進(jìn)入控制臺扁达，點擊這個域名的「解析」正卧，進(jìn)入解析界面。像我已經(jīng)設(shè)置過了的就像下面的樣子跪解。
比如我有三條解析規(guī)則炉旷，最重要的是我用熒光筆圈出來的兩個屬性。
結(jié)合我的域名(kwok.ink)解釋一下這兩個屬性：
- 主機(jī)記錄
cloud，記錄值balabala.cc窘行。簡單理解為饥追，當(dāng)你在瀏覽器輸入cloud.kwok.ink時，展示balabala.cc的界面罐盔。 - 主機(jī)記錄
www但绕，記錄值gazebo.coding.me。簡單理解為惶看，當(dāng)你在瀏覽器輸入cloud.kwok.ink時捏顺，展示gazebo.coding.me的界面。 - 主機(jī)記錄
@纬黎，意思是空幅骄，相應(yīng)的訪問地址就是kwok.ink。后面我就不說了莹桅。
知道了這些昌执，那接下來我想要輸入test.kwok.ink就顯示name.coding.me的界面，你大概已經(jīng)知道怎么做了诈泼。
之后打開test.kwok.ink懂拾，發(fā)現(xiàn)還是有問題。
是這樣的铐达，你需要在你的Coding倉庫的「Pages 服務(wù)」中將「自定義域名」設(shè)置一下岖赋。
之后再打開test.kwok.ink就有內(nèi)容了。
只是你會發(fā)現(xiàn)瓮孙，第一次啟動的時候會有一個Coding Pages的宣傳頁唐断，感覺很不好。其實是這個東西：
我的做法是杭抠，在主題的配置信息里脸甘，底部信息加上了Coding Pages。效果的話偏灿，就是這樣子：
然后點擊上邊的「已放置」丹诀，審查一兩天就會通過。通過后就沒有了翁垂。
關(guān)于HTTPS和HTTP
注意到「Pages 服務(wù)」頁面有一個「強(qiáng)制HTTPS訪問」铆遭，建議啟用。
啟用后有時候會遇到一個問題沿猜，就是如果要引用外站的非HTTPS(http)資源(圖片什么的)會被拒絕枚荣。解決方法就是把這個資源換成HTTPS的，或是資源下載下來啼肩，放到倉庫中或者圖床(專門放置圖片的)等地方再使用橄妆。
日常使用流程
- 打開
<folder>/source/_post - 寫一個
HTML或Markdown - 在文本開始的位置前面加上
title衙伶、tags、date等信息 - 回到
<folder>目錄 - 執(zhí)行
hexo s -g呼畸，生成并在localhost:4000查看效果痕支。確保沒問題，有問題再改蛮原。 - 執(zhí)行
hexo d部署到云端卧须。
命令
創(chuàng)建目錄和初始化這些東西，剛開始的時候用一次儒陨，之后就基本用不到了花嘶。
日常常用的命令大概有這些：
hexo g-> 生成
hexo s-> 啟動本地服務(wù)器，可以在localhost:4000來做個預(yù)覽
hexo d-> 部署到云端蹦漠，可以外網(wǎng)訪問
最重要的是我們之前演示過的組合使用：
hexo s -g-> 先生成椭员，再啟動服務(wù)器，用于修改后的預(yù)覽
hexo d -g-> 先生成笛园，再部署到云端
寫的比較匆忙隘击，如果有疑問或是建議，非常歡迎告知研铆，我會及時修改埋同。謝謝你的閱讀，希望能有所幫助棵红。
