作為一個(gè)多年的iOS開(kāi)發(fā)者悯辙,而且喜歡自己沒(méi)事的時(shí)候?qū)扅c(diǎn)東西以供他人分享,都想要有一個(gè)屬于自己的迎吵、網(wǎng)址上帶有自己名字的博客躲撰,有的人用簡(jiǎn)書(shū)或者GitHub來(lái)寫(xiě)文章,不過(guò)那些都是第三方平臺(tái)击费,不是自己的拢蛋,只有屬于自己的一個(gè)博客才會(huì)顯得很酷很裝逼有沒(méi)有??,OK接下來(lái)咱們開(kāi)始搭建吧蔫巩!
一谆棱、前言
該博客用的是Hexo框架,基于Node.js圆仔,搭建博客首先需要有一個(gè)GitHub賬號(hào)并且配置了SSH Keys(申請(qǐng)步驟這里就不介紹了垃瞧,網(wǎng)上教程很多),然后在GitHub里創(chuàng)建一個(gè)名為username.github.io的倉(cāng)庫(kù)坪郭,還需要安裝Git个从、安裝Node.js、安裝Hexo
二歪沃、準(zhǔn)備工作
1信姓、創(chuàng)建GitHub倉(cāng)庫(kù)
創(chuàng)建一個(gè)名為username.github.io的倉(cāng)庫(kù)
在GitHub中新建倉(cāng)庫(kù)相信你們都會(huì),點(diǎn)擊New repository創(chuàng)建绸罗,注意:倉(cāng)庫(kù)名稱一定是username.github.io
這種格式,username替換一個(gè)你喜歡的名字豆瘫。
2珊蟀、安裝Git
如果已安裝可跳過(guò)
方法一、通過(guò)HomeBrew來(lái)安裝
先安裝HomeBrew(如果已安裝可跳過(guò))
終端執(zhí)行命令 $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
然后安裝git $ brew install git
方法二、你也可以通過(guò)下載安裝程序來(lái)安裝
驗(yàn)證:執(zhí)行
git --version
如果輸出類(lèi)似git version 2.15.0
說(shuō)明安裝成功了
3育灸、安裝Node.js
先安裝nvm腻窒,這是Node.js版本管理器,可以輕松切換Node.js版本磅崭。 這里有兩種方式安裝儿子。如果使用curl的方式安裝,安裝完成之后一定要重啟終端砸喻。
方法一柔逼、通過(guò)HomeBrew來(lái)安裝(推薦)
$ brew install node
方法二、curl安裝方式
$ curl https://raw.github.com/creationix/nvm/master/install.sh | sh
安裝完成后割岛,重啟終端并執(zhí)行下列命令即可安裝 Node.js
$ nvm install stable
驗(yàn)證:執(zhí)行
npm --version
如果輸出類(lèi)似5.5.1
說(shuō)明安裝成功了
4愉适、安裝Hexo
所有必備的應(yīng)用程序安裝完成后,即可使用 npm 安裝 Hexo
$ npm install -g hexo-cli
三癣漆、建站
1维咸、創(chuàng)建資源
安裝 Hexo 完成后,在你喜歡的目錄下新建一個(gè)文件夾命名為username
(替換成你喜歡的名字)惠爽,然后cd到username文件夾下
$ cd username
$ hexo init
$ npm install
執(zhí)行完畢后你將看到在你剛創(chuàng)建的文件夾下會(huì)有很多資源
2癌蓖、基礎(chǔ)配置
接下來(lái)打開(kāi)username下的_config.yml
文件(上圖中的第一個(gè)文件),修改一下里面幾個(gè)關(guān)鍵的信息婚肆,修改完記得保存租副,注意:冒號(hào)后面要有空格。
title: my_楊哥 //你博客的名字
author: Li Yang //你的名字
language: zh-Hans //語(yǔ)言-簡(jiǎn)體中文
上面這3個(gè)字段是關(guān)鍵信息旬痹,如需修改其他信息請(qǐng)參考配置
3附井、主題安裝
username下的themes
文件夾中存放的是主題,默認(rèn)的是landscape主題两残,如果你不喜歡可以安裝其他主題永毅。
NexT主題是一套簡(jiǎn)約的主題,是目前使用最火的一個(gè)主題人弓,下面我們安裝一下該主題沼死,你也可參考安裝NexT。
Hexo還有更多主題供你選擇
- 安裝NexT主題:
$ cd username //進(jìn)入到username文件夾下 $ git clone https://github.com/iissnan/hexo-theme-next themes/next
- 啟用NexT主題:
打開(kāi)username下的_config.yml
文件(上圖中的第一個(gè)文件)崔赌,找到theme
字段將其值更改為next
- 驗(yàn)證主題:
注意:每次切換主題之后意蛀、驗(yàn)證主題之前都要清除 Hexo 的緩存
開(kāi)始驗(yàn)證:?jiǎn)?dòng)Hexo本地服務(wù)器$ hexo clean //清除緩存
然后你將會(huì)看到終端輸出$ hexo s
這行的意思是說(shuō)你用瀏覽器打開(kāi) http://localhost:4000 便可看到你的博客了,這只是本地的測(cè)試健芭,如果測(cè)試沒(méi)問(wèn)題就執(zhí)行Ctrl+C退出去县钥,此時(shí)該地址就不能訪問(wèn)了。INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.
OK慈迈,現(xiàn)在若贮,你已經(jīng)成功安裝并啟用了 NexT 主題。接下來(lái)就是對(duì)該主題的一些設(shè)置,詳細(xì)可參考NexT主題設(shè)定
四谴麦、寫(xiě)作
以上所有的工作都完成了蠢沿,并設(shè)置了一套你自己喜歡的主題樣式,接下來(lái)就可以寫(xiě)博客了匾效。
1舷蟀、新建一篇文章
$ hexo new layout title
layout:模板,如果不寫(xiě)將使用默認(rèn)模板面哼,一般不寫(xiě)野宜,直接$ hexo new title
title:文章標(biāo)題,如果標(biāo)題包含空格的話精绎,請(qǐng)使用引號(hào)括起來(lái)速缨。
新建的文章將會(huì)存在username/source/_posts
中,_posts
就是默認(rèn)模板代乃,文章文件名稱將會(huì)是title.md
旬牲,接下來(lái)就可以打開(kāi)該文件進(jìn)行編輯寫(xiě)你的文章了。
2搁吓、生成靜態(tài)文件
寫(xiě)完文章之后執(zhí)行原茅,來(lái)生成靜態(tài)網(wǎng)頁(yè)文件
$ hexo g //hexo generate的縮寫(xiě)
3、啟動(dòng)本地服務(wù)器
$ hexo s //hexo server的縮寫(xiě)
本地服務(wù)器啟動(dòng)完之后就如同上面驗(yàn)證主題一樣堕仔,訪問(wèn) http://localhost:4000 來(lái)驗(yàn)證一下你寫(xiě)的文章預(yù)覽效果擂橘。
4、部署網(wǎng)站
安裝部署工具
$ npm install hexo-deployer-git --save
安裝完畢后打開(kāi)username下的_config.yml
文件摩骨,翻到最底部找到deploy節(jié)點(diǎn)編輯如下:
deploy:
type: git
repository: https://github.com/YoungerLi/youngerli.github.io.git
branch: master
其中https://github.com/YoungerLi/youngerli.github.io.git
就是你GitHub中創(chuàng)建的倉(cāng)庫(kù)地址通贞,在這復(fù)制即可
最后,部署網(wǎng)站
$ hexo d //hexo deploy的縮寫(xiě)
第一次執(zhí)行這一步的時(shí)候會(huì)讓你輸入你的GitHub的用戶名及密碼恼五,輸入正確無(wú)誤后執(zhí)行完畢昌罩,任何人就可以訪問(wèn) https://youngerli.github.io 進(jìn)入你的博客了。
以后每次寫(xiě)完文章之后依次執(zhí)行以下命令就可以發(fā)布更新了
$ hexo clean // 清除緩存 $ hexo g // 生成靜態(tài)網(wǎng)頁(yè)文件 $ hexo d // 將本地博客發(fā)布到github
五灾馒、更多
經(jīng)過(guò)一番不懈的努力茎用,我們終于搭建好了一個(gè)屬于自己的博客,并且還安裝了一個(gè)Next主題睬罗,但是我們的博客一開(kāi)始還是很簡(jiǎn)陋的轨功,我們需要把她裝修一下,怎么裝修呢容达?來(lái)看看Hexo的Next主題詳細(xì)配置