作為一個技術宅，
一定要有一個專屬於自己的個人博客。
CSDN？博客園？知乎？簡書？
雖然是你自己的號，但畢竟是別人的地盤。
廣告插入多、審核時間長、不準插外鏈、不準貼二維碼……
自己沒有充分的話語權，總有一種在人家屋簷下的感覺。
不夠自由，不夠灑脫，不夠爽！
況且，好像大佬們一般都有自己的個人博客。
稚暉小站[1]
陳博士的博客[2]
NiklasRoy的博客[3]
騎驢玩兒漂移[4]
Mculover666[5]
我不是大佬，但也悄咪咪搭了一個。
我自己的小站[6]
一個完全屬於自己的博客，
可以隨意發內容，
記錄生活，
在自己的地盤寫自己的項目，
邁向成為大佬的第一步！
看起來好像還不錯的樣子，但是我不是程序員，搭這個費事麼？
說實話，我之前搗鼓了將近一週的時間
不過，總結下自己走過的彎路，今天，大家完全可以在1個小時之內，搭建出一個真正屬於自己的博客！
而且，
完！全！免！費！
而且，你只需要下面兩樣東西：
- 一個GitHub賬號
- 一顆愛折騰的心
主要步驟
- 安裝Git
- 安裝Node.js
- 安裝Hexo
- 給Hexo換一個自己喜歡的皮膚主題
- 註冊GitHub
- 將Hexo部署到GitHub
熱身準備
今天的主角叫Hexo（簡單理解為一個博客框架），安裝 Hexo 相當簡單，只需要先在電腦裡安裝下列應用程序即可：
- Git
- Node.js (Node.js 版本需不低於 8.10，建議使用 Node.js 10.0 及以上版本)
如果你的電腦中已經安裝上述必備程序，那麼恭喜！你可以直接前往安裝 Hexo 步驟。
如果你的電腦中還沒安裝所需要的程序，那麼先和我一起來安裝它們。
安裝 Git
Git下載地址：https://git-scm.com/download/
進入git官網，點擊download
網站會自動檢測你的系統，並推薦最新的發行版本給你下載。
一般選擇64位，安裝
一直next，然後開始安裝
完成安裝
這個時候，在桌面點擊鼠標右鍵（也不一定在桌面），你會發現多了個git bash here
點擊git bash here
鍵盤輸入git --version,可以看到git的版本號。
顯示git的版本
下載慢的話，可以用淘寶鏡像源地址：https://npm.taobao.org/mirrors/git-for-windows/
第一小步，完成！
安裝 Node.js
安裝地址：https://nodejs.org/en/download/
鏡像源：https://npm.taobao.org/mirrors/node
直接到官網下載
下載好之後進入安裝界面
勾選協議，直接一路“Next”
完成安裝
右鍵點擊git bash here
輸入node -v 按回車,可以看見當前node的版本
顯示安裝的版本號
至此，我們熱身完畢！
已經完成了安裝hexo的前期準備工作！
安裝 Hexo
重頭戲來了！
兩個必備的應用程序安裝完成後，我們用使用 npm 安裝 Hexo。
選擇你要安裝的盤，新建一個文件夾，我這邊名字就取“blog”，進入“blog”，（這個“blog”以後就是你博客根目錄了）右鍵空白處，點擊git bash here
輸入npm install -g hexo-cli
<code>npm install -g hexo-cli/<code>
安裝hexo
完成安裝
輸入hexo -v,可以看到hexo的版本。
接下來，我們輸入hexo init,初始化我們的博客站點
初始化站點
OK,安裝好了
這個文件夾，就是你博客站點的根目錄！
然後，我們輸入npm install,安裝相關的依賴。
文件夾裡面應該會有這些東西：
博客的目錄結構
以後發佈文章什麼的，我們都在這個根目錄下操作，可以直接在這裡右鍵git bash here。
我們來試試。
輸入hexo s
允許訪問
出現了一個鏈接
選中打開
OK，我們的博客已經在本地搭建成功了！
成功！
不過界面很醜，沒有大佬們的那麼好看。
我們想辦法美化一下它。
更換博客的主題
接下來就是換皮膚環節。
我們以黃工的這個博客為列子，他用的主題叫做Next，這個風格很簡約，我們來看看是怎麼換的。
首先，在博客的根目錄裡頭找到_config.yml這個文件，
由於我是在虛擬機中運行的，沒有合適的軟件，所以我選擇用記事本打開，（也可以下載一個Visual Studio Code軟件打開）
Visual Studio Code
滑到最後，找到theme,這裡顯示的是我們的默認主題：landscape，太醜了，我們換一個。
公眾號後臺回覆Next，給大家準備好了Next主題壓縮包，大家解壓縮到這個叫做themes的文件夾裡面。
已經看到主題了。
接下來我們複製這個文件夾的名字：hexo-theme-next-master（當然你可以直接重命名成next）
然後替換掉剛才的默認主題：landscape
保存。
然後退回博客的根目錄下
依次輸入：hexo clean,hexo g,hexo s
常用命令簡寫中文含義hexo serverhexo s本地啟動hexo generatehexo g生成靜態文件hexo deployhexo d部署網站hexo clean
清除緩存和已經生成的靜態文件
一般情況，我們先依次輸入hexo clean、 hexo g 、 hexo s ，沒問題再 hexo d就行。
打開網址，next主題修改成功！
至於風格為什麼不一樣，是因為next主題下還有四種不同的風格。
細心的可能會發現，在hexo-theme-next-master文件裡面，還有一個_config.yml文件，這個就是主題的配置文件，而前面一個叫這個的是博客站點的配置文件，大家不要搞混了。
想要修改成黃工的那個風格，可以在主題的配置文件修改，有興趣的可以自己琢磨，這裡先不多說了。（怕改錯的可以先備份）
- 小提示
這裡也提供了我自己博客的主題，回覆butterfly可以下載，同樣的操作，解壓到主題文件夾下，在博客站點的配置文件_config.yml裡面修改主題為：hexo-theme-butterfly。
這個主題比較花，用到了一些插件，所以先需要運行npm install hexo-renderer-pug hexo-renderer-stylus
安裝完後，再依次運行hexo clean,hexo g,hexo s
效果展示：
這個主題支持手機端的黑夜模式，繁簡體切換，還可以根據需求調大調小字號，手機端適配做的非常不錯。
Next主題手機端顯示是這樣的：
更多主題，可以參考：https://hexo.io/themes/
那麼問題來了，你的為什麼能在手機上顯示！
剛剛我們只是在本地部署，別人並不能看到我們的博客，做博客當然是想分享出去，讓更多的人看到。
所以，接下來我們講講怎麼樣發佈出去。（其實就是放到github上面，很簡單）
註冊github賬號
輸入網站：https://github.com/
這裡有一個注意事項！
這邊你的用戶名會直接影響到後續你博客網站的名字，比如，前面可以看到我測試的這個博客地址是https://dfrobotcommunity.github.io/,是因為我github的賬號名字就是DFRobotCommunity，所以，如果想白嫖，請考慮好你的名字。（當然後續我們也可以花錢買域名，自定義網址）
一步一步正常走下來。
註冊成功記得驗證郵箱！
創建我們的博客倉庫
這裡我們選擇創建倉庫
記得這條網址，可以複製下來。
還記得我們主題是在哪裡修改的麼？
站點配置文件裡！
打開站點配置文件_config.yml，找到這一行：
改成這個 保存
裡面的https://github.com/DFRobotCommunity/DFRobotCommunity.github.io.git,改成你自己的那串地址就行了。
然後又是熟悉的，在博客根目錄下，打開git bash here
想要把我們電腦上的文件推送到剛在github上建立的倉庫裡，我們需要安裝hexo-deployer-git
輸入：
npm install hexo-deployer-git --save
再輸入：hexo d，就是hexo deploy的簡寫（部署的命令）
會提示讓你輸入郵箱和姓名，安裝他的格式輸入就行。
輸完敲回車，會出現讓你登錄你的github的界面，直接輸入就好。
顯示已經部署到倉庫了！
刷新一下我們剛剛的github頁面：
已經成功推送到倉庫端
現在，你的博客已經可以在網上看到了！
我們看看你的博客網站是什麼。
找到setting
一直往下拉，這個就是你的博客的地址了：
點擊訪問！
寫一篇文章
你寫的文章都是以.md的格式來儲存的，hexo會把你的文章轉成html，然後我們看到了你的博客上的展示的樣子。
文章的位置在這：
Mac上結構顯示清楚一些
你可以有兩種方式寫博客。
1、直接選擇在博客根目錄下git bash here,然後輸入hexo new "你的文章名字",你會在_posts文件夾裡看到你創建的md文件，然後打開，編輯。
2、直接寫文章，以md格式保存到_posts文件夾（建議參考hello-world.md的格式。）
至於markdown的語法，這裡不過多介紹了，大家可以自己百度學習一下。
重要的是，我們社區是支持markdown語法的，意味著你用markdown寫了一個項目後，可以發到你的個人博客上，也可以花一分鐘時間輕鬆發到社區！
點這個小M
直接粘過來，不過前面那段最好去掉。
解放生產力，專注做項目！
後記
第一次寫教程類文章，大家有什麼意見或者建議，歡迎反饋。
建博客容易，維護博客難。
由於本身沒有很好的基礎，前段時間自己也搗鼓了挺長時間的。
遇到問題，找hexo官方文檔，找百度，找谷歌，其實一般都能解決。
最後，歡迎大家交流遇到的問題，
如果大家搭好了自己的博客，也歡迎在評論區秀出來！
[1]稚暉小站: http://www.pengzhihui.xyz/
[2]陳博士的博客: http://dinochen.com/
[3]NiklasRoy的博客: http://www.niklasroy.com/
[4]騎驢玩兒漂移: http://www.yoyojacky.com/
[5]Mculover666: http://www.mculover666.cn/
[6]我自己的小站: https://blog.yirenliu.cn/
閱讀更多 DFRobot智造星球 的文章
