文/北媽

閱讀本文需要 3.5分鐘

一

直接入正題，先看北媽個人博客地址：http://www.guoxiaobei.com

微信不允許加入外鏈，你只能復(fù)制去外部瀏覽器打開，或者看完文章在底部的?“閱讀原文”，可以直接進去。

這個時代，普通人擁有自己的獨立博客或網(wǎng)站有多么重要不用再說了，更不用說我們是程序員。

很久之前答應(yīng)過大家，點贊超過200，就放出獨立博客教程，結(jié)果那篇文章直接到了300贊，沒法逃了。

而且也足以證明，大家是多么渴望擁有一個自己的網(wǎng)站。

但傳統(tǒng)意義上，建立網(wǎng)站是需要花錢的，服務(wù)器、數(shù)據(jù)庫等，而且價格還不菲呢，那怎么辦？

聰明人早有辦法，那就是利用github + 自動生成程序+幾句命令直接組建網(wǎng)站，其實網(wǎng)絡(luò)有很多配置教程了。

如果覺得北媽寫的不好，可以自行搜索，大同小異，只不過我寫的更為清晰、易懂。

先看下我的博客在github的 開源地址：
https://github.com/xiaobei666/xiaobei666.github.io.git

由于這個屬于教程系列，涉及到一系列命令、代碼、配置，由于在微信公眾號不好展示，長篇也說不明白。

所以我把這個【5分鐘 0元搭建獨立博客系列】分為3篇，今天先放出“一”。

希望大家多多轉(zhuǎn)發(fā)和收藏，好東西千萬不要捂著。

二

說明條件：Github Pages +?Hexo + Node.js。

系統(tǒng)環(huán)境：我是MAC電腦的OSX系統(tǒng)，所以截圖和命令都是mac的，但和windows一樣，這個不用擔(dān)心。

大體流程：其實簡單，就是命令

擁有一個github pages

在本地電腦里配置hexo的環(huán)境（hexo與github pages綁定，寫博文修改博文等，生成靜態(tài)博客)

綁定自己的域名（也可以不用綁定，github pages有二級域名，只不過綁有一個屬于自己的域名，才算真正的個人網(wǎng)站）

這是一篇有關(guān)如何使用Github Pages和博客程序 Hexo搭建自己獨立博客的入門詳細教程，里面介紹了如何將Hexo部署到自己的Github項目中，并且可以獨立訪問。

第一篇，先介紹?Github Pages +?Hexo 是什么，并且安裝命令和配置，達到本機訪問。

第一步：關(guān)于Github、Github Pages建立倉庫

一、Github的優(yōu)點

• GitHub是基于git實現(xiàn)的代碼托管。理論上可以建立無限個網(wǎng)站。

• GitHub可以免費使用，并且快速穩(wěn)定。

• Github上面很多開源庫，所以你懂得。

二、什么是Github Pages

Github Pages可以被認為是用戶編寫的、托管在github上的靜態(tài)網(wǎng)頁。

它是github官方提供的，靜態(tài)解決方案，就是為了讓你展示自己的文檔和網(wǎng)頁效果

三、為什么要使用Github Pages

• 可以綁定你的域名(但暫時貌似只能綁定一個)。

• 簡單快捷，使用Github Pages可以為你提供一個免費的服務(wù)器，免去了自己搭建、購買服務(wù)器和寫數(shù)據(jù)庫的麻煩。

• 所以，這個Github Pages 其實就是傳統(tǒng)意義的放網(wǎng)頁的服務(wù)器，明白了么？

---

三
不用多問，按步驟開始

1、建立你的?Github Pages 倉庫

創(chuàng)建Github Pages比較簡單，只要你有一個github賬號在創(chuàng)建一個倉庫就行了，但是這個倉庫是有規(guī)則的，其格式必須為：你的名字.github.io

比如我的：xiaobei666.github.io

然后根據(jù)提示一直下一步就行，非常簡單。

如果你連github 賬戶都沒有、不會創(chuàng)建，那么請你先去熟悉下github，不然我們沒法往下玩兒了。

如果你沒聽過github，我覺得你可以退出程序員行業(yè)了。

2、安裝 Hexo

前提：必須安裝Node.js?，也就是要用npm命令來安裝。如果你身為2019年的前端，連npm 命令都沒用過，我請你趕緊學(xué)習(xí)了。

我這里默認你安裝了node.js，如果我還交你怎么安裝nodejs，是不是還要交你怎么開機？

Hexo介紹

Hexo 是一個快速、簡潔且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在幾秒內(nèi)，即可利用靚麗的主題生成靜態(tài)網(wǎng)頁。

Hexo的安裝網(wǎng)上有很多教程，但很多都是粘貼復(fù)制，過時、過期的命令，而且版本不同，命令也有差異，所以最好的還是參考Hexo官方的安裝教程來一步一步走。

Hexo安裝

安裝命令：$ npm install -g hexo-cli

打開你的系統(tǒng)終端，windows系統(tǒng)可以鼠標(biāo)右鍵點擊Git Bash Here，輸入npm命令即可安裝。

mac系統(tǒng)的不用介紹了吧。

npm install hexo-cli -g npm install hexo-deployer-git --save

第一句是安裝hexo。

第二句是安裝hexo部署到 git page的deployer，兩個都需要安裝。

創(chuàng)建Hexo文件夾

安裝Hexo完成后，根據(jù)自己喜好建立目錄（如F:\Blog\Hexo），直接進入F:\Blog\Hexo文件夾下右鍵鼠標(biāo)，點擊Git Bash Here，進入Git命令框，執(zhí)行以下操作。

$ hexo init

$ npm install

安裝 Hexo 完成后，Hexo 將會在指定文件夾中新建所需要的文件。整個過程都是自動化的。

執(zhí)行? $ npm install 后，會根據(jù) package.json 里的信息，自動安裝插件，所有過程不用管。

這時候，其實hexo已經(jīng)在你的機器上了，也就是我們常說本地開發(fā)版。

如果你想看本地效果，就這樣。

執(zhí)行下面語句，執(zhí)行完即可登錄 localhost:4000 查看效果

hexo generate hexo server

到這里，篇幅已經(jīng)很長了，所以今天第一篇到這里結(jié)尾。

已經(jīng)實現(xiàn)了，讓你看到廬山真面目，只不過這個“廬山” ，還沒有正式對外發(fā)布。

但你已經(jīng)可以在本地服務(wù)器，通過傳統(tǒng)的?localhost:4000 查看并且修改了。

至于怎么寫博客，你先看下這個hexo的官方說明記錄，先了解個大概，后面第二篇，很快上來。

hexo 中文官方文檔：?https://hexo.io/zh-cn/docs/setup.html

三

每天金句：“哪里有人喜歡孤獨，只不過不亂交朋友罷了，那樣只能落得失望”

老規(guī)矩，是平時不開贊賞，月底統(tǒng)一交租，但不耽誤你點?[好看]。

但今天，因為寫的好，而且寫的超級累，并且讓你擁有了真正意義上的獨立博客。

所以，今天我要開贊賞！

最后，今天有三篇文章，別忘了看嗯嗯。

延伸閱讀：

1.?年底了，小心這些現(xiàn)象。別再無動于衷

2.?找工作如何避免培訓(xùn)機構(gòu)騙局
3.?我為何一直強調(diào)外包公司別去

每天只想聽你們說：小北最帥！

長按掃碼關(guān)注我

前端你別鬧

總結(jié)

以上是生活随笔為你收集整理的5分钟 0元搭建个人独立博客网站（一）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。