倒騰了2天算是把小窩安頓下來了,下面我就傻瓜式地講解:如何免費搭建自己的博客.
(HEXO + Github + Mac)
在開始之前先弄清楚幾個概念,因為畢竟我(們)是小白.
相關(guān)概念
Hexo是什么
Hexo一款博客框架,一款支持Markdown的可拓展性框架.(簡而言之,寫博客只需要編輯.md文件,Hexo幫你解釋成HTML前端頁面)
Markdown是什么
一種可以使用普通文本編輯器編寫的標記語言,通過簡單的標記語法,它可以使普通文本內(nèi)容具有一定的格式。(Markdown有自己的語法,按照語法進行博客編輯即可)
Github是什么
軟件項目的托管平臺.(這里我們需要將hexo搭建的博客部署到github,這樣別人就能訪問了)
在開始之前,你需要一個賬號,去https://github.com注冊一個自己的github賬號吧,開啟新世界的大門.
那么,下面我們開始:
配置環(huán)境
1.安裝Node(必須)
作用:用來生成靜態(tài)頁面的. 到Node.js官網(wǎng)下載相應(yīng)平臺的最新版本,一路安裝即可。
2.安裝Git(必須)
如果你有xcode那么恭喜你已經(jīng)安裝好Git.如果沒有,那么去Git安裝教程.(Git是免費、開源的分布式版本控制系,svn是經(jīng)典的集中式版本控制系統(tǒng)).
3.正式安裝HEXO
Node和Git都安裝好后,可執(zhí)行如下命令安裝hexo :(打開終端直接輸入)
$ sudo npm install -g hexo
創(chuàng)建本地博客
上面已經(jīng)安裝好必要的環(huán)境配置,下面開始創(chuàng)建你的博客.
1.初始化
創(chuàng)建一個文件夾,如:Blog,cd到Blog里執(zhí)行hexo init的。命令:
hexo init
那么,恭喜你,你的本地博客至此已經(jīng)創(chuàng)建好了.(納尼???)
是的沒錯,可是,我的本地博客在哪里呢?閑話少說,我們繼續(xù)~~
2.生成靜態(tài)頁面
打開終端,cd到你的Blog目錄下,執(zhí)行如下命令:
hexo generate (hexo g 也可以)
3.本地啟動
仍然在你的Blog目錄下.
啟動本地服務(wù),進行文章預覽調(diào)試,執(zhí)行如下命令:
hexo server
瀏覽器輸入http://localhost:4000(這就是你的本地博客了~~)
雖然很簡陋,但好歹有了一個屬于自己的小窩了。本地已經(jīng)簡單的設(shè)置好了,但是現(xiàn)在域名和服務(wù)器都是基于自己的電腦,接下來需要跟github進行關(guān)聯(lián)。
配置Github
1.建立Repository
建立與你用戶名對應(yīng)的倉庫,倉庫名必須為【your_user_name.github.io】,固定寫法 (your_user_name 替換成你的 Github賬戶的 username)
2.和本地建立關(guān)聯(lián)
然后建立關(guān)聯(lián),終端cd到你的Blog目錄下,文件有以下:
Blog
|
|-- _config.yml
|-- node_modules
|-- public
|-- source
|-- db.json
|-- package.json
|-- scaffolds
|-- themes
現(xiàn)在我們需要_config.yml文件,來建立關(guān)聯(lián),雙擊打開該文件,并翻到最下面,增加如下配置:(注意: : 后面要有空格.切記切記!!!這里曾經(jīng)坑了我)
deploy:
type: git
repository: https://github.com/your_username/your_username.github.io.git (your_username替換成你的Github賬戶名)
branch: master
修改完成后記得保存_config.yml文件.
3.將本地Blog部署到Git
然后執(zhí)行如下命令才能使用git部署:
npm install hexo-deployer-git --save
最后,執(zhí)行部署命令:
hexo deploy
至此,你的本地Blog已經(jīng)部署到git了,然后在瀏覽器中輸入http://your_username.github.io/就行了
(your_username替換成你的Github賬戶名).
每次部署的步驟,可按以下三步來進行。
hexo clean
hexo generate
hexo deploy
寫在最后
這里為了避免混淆,并沒有介紹如何發(fā)布博客,修改主題等等配置相關(guān)的部分.
Tips
Hexo語法與使用 官網(wǎng):https://hexo.io
Markdown 基本語法 Cmd Markdown 簡明語法手冊
Windows10搭建Hexo: 簡書 http://www.itdecent.cn/p/3f2fe426edff
本文內(nèi)容源自:簡書 http://www.itdecent.cn/p/465830080ea9