ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)


ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

你是ITer嗎?你有自己的博客嗎?


IT的文檔輸出效率

作為一個在IT這個江湖混跡這麼多年的ITer,我輸出的文檔真心不少,從最開始的TEXT文檔到後面的WORD,再到後面的Markdown,也發生的微妙的變化。其中Markdown徹底改變了我文檔上付出的時間,因為我想在輸出文檔時:

  • 不限排版,各種段落之間,文字粗細變化,浪費時間
  • 不想拉圖,插入圖片各種拉拽,浪費時間
  • 不想著色,插入代碼塊還要做底紋,浪費時間

認識了markdown,徹底改變了我寫代碼的效率,這個時候,你只需要一個工具,就可以在寫文檔上快的飛起。

除開寫文檔之外,還需要輸出博客,當然了,博客系統很多啦,針對IT專業的也不少,但是你需要負責到博客的專業編輯器,然後又是各種排版,太浪費時間了,這個時間放在現在,我都可以發佈兩篇文檔了!

因此,推薦大家使用markdown來輸出文檔,然後通過github+hexo+next來輸出博客,輸出的東西排版很好,有目錄,整個風格也很好看,特別是,你會了我們今天這個方式,你可以變著法子來,做不一樣風格的博客,而卻代碼啥的,都是自己可控的!主要是免費,免費,免費且無限制!當然這個無限制是相對的!

接下來介紹下如何通過GITHUB+HEXO+NEXT來構建博客的方法,分為上下篇。上面介紹安裝,下篇介紹優化等內容!

註冊GITHUB

註冊github, 並建立repo,注意repo的名字是你博客地址的URL, 以後你訪問的時候,就是https加上你的URL就完事兒!


ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

在github上註冊賬號,建立repo

本地環境構建

這個是在本地操作,首次使用的時候是麻煩點,不過辛苦一次就好了,再說,你的電腦也不是經常換,而且配置可以備份!

本地可以在Windows,Linux, MacOS平臺搭建,思路差不多,我這兒以RedHat Enterprise LInux 7.6為例!

<code>[hexo@localhost ~]$ cat /etc/redhat-release 
Red Hat Enterprise Linux Server release 7.6 (Maipo)/<code>

NodeJS的安裝

使用Hexo+Next做博客時,需要Nodejs環境的支持

下載Nodejs for LTS,下載地址:https://nodejs.org/en/download/

ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

下載什麼版本,看你想部署在哪兒

安裝NodeJS,下載的軟件放到服務器下hexo的家目錄

<code>[hexo@localhost ~]$ tar xf node-v10.13.0-linux-x64.tar.xz 
[hexo@localhost ~]$ rm -rf node-v10.13.0-linux-x64.tar.xz
[hexo@localhost ~]$ mv node-v10.13.0-linux-x64 nodejs
[hexo@localhost ~]$ vim .bashrc /<code>
<code># .bashrc
export PATH="$PATH:/home/hexo/nodejs/bin"\t\t\t#這行內容是加的
# Source global definitions
if [ -f /etc/bashrc ]; then
. /etc/bashrc
fi/<code>

這時,npm命令將可以直接調用

git環境搭建

若是本地服務器,使用光盤,找到git的rpm包,安裝git客戶端,實在不行,可以找個yum源來下載!

<code>[hexo@localhost ~]$ rpm -qa | grep git-
git-1.8.3.1-20.el7.x86_64/<code>

對接github

Windows平臺,你可以使用賬號密碼,或者使用小烏龜啥的,都可以, linux我們建議使用ssh,省時省力,工具適合就行,方式都一樣的。

建立key

<code>[hexo@localhost ~]$ ssh-keygen -t rsa -C "[email protected]"\t\t\t#是github註冊賬號郵箱地址, 然後一路回車完事兒
[hexo@localhost ~]$ ll ./ssh\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t#製作完成key之後是這樣的
-rw-r--r-- 1 hexo hexo 1675 May 31 09:38 id_rsa
-rw-r--r-- 1 hexo hexo 408 Nov 5 11:50 id_rsa.pub
/<code>

記事本打開公鑰密碼, 複製下來,等下需要用的

在github上導入

在設置裡面找到SSH and GPG keys,然後粘貼進去保存

ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

在github上粘貼你產生的id_rsa.pub中的內容

測試連通性

<code>[hexo@localhost ~]$ ssh -T [email protected]
The authenticity of host 'github.com (xx.xx.xx.xx)' can't be established.
RSA key fingerprint is SHA256:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.
RSA key fingerprint is MD5:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.
Are you sure you want to continue connecting (yes/no)? yes
Warning: Permanently added 'github.com,xx.xx.xx.xx' (RSA) to the list of known hosts.
Hi yxz11! You've successfully authenticated, but GitHub does not provide shell access.\t\t\t\t#表示沒啥問題了
/<code>

git賬戶配置

<code>[hexo@localhost ~]$ git config --global user.name "xxxxxx"
[hexo@localhost ~]$ git config --global user.email "[email protected]"\t\t#github賬戶
[hexo@localhost ~]$ git config user.name
yxz11
[hexo@localhost ~]$ git config user.email
[email protected]
/<code>

hexo安裝配置

hexo純粹就是命令行安裝了,按照下面的目錄一步一步來就行

<code>[hexo@localhost ~]$ npm install -g hexo-cli/<code>
ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

安裝hexo-cli

<code>[hexo@localhost ~]$ mkdir yxz11\t\t\t\t\t#工作目錄,站點目錄
[hexo@localhost ~]$ cd yxz11
[hexo@localhost yxz11]$ hexo init/<code>
ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

工作站點目錄創建

<code>[hexo@localhost yxz11]$ ls
_config.yml node_modules package.json package-lock.json scaffolds source themes
[hexo@localhost yxz11]$ npm install\t\t#這一步是解決hexo所需要的的依賴/<code>

啟動hexo服務

<code>[hexo@localhost yxz11]$ hexo generate 

[hexo@localhost yxz11]$ hexo server/<code>

啟動完成,可以通過本地的瀏覽器,如Chrome,Firefox等進行本地訪問: http://localhost:4000


ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

這個是hexo的默認主題

Next主題安裝配置

使用穩定版本: https://github.com/theme-next/hexo-theme-next/releases

你可以不用next主題,只是我覺得next主題挺好看的!

解壓主題包

進入/home/hexo/yxz11/themes/, 並將next解壓到此目錄, 並命名為next

<code>[hexo@localhost themes]$ pwd
/home/hexo/yxz11/themes
[hexo@localhost themes]$ ls
landscape next/<code>

啟用next主題

<code>[hexo@localhost yxz11]$ pwd
/home/hexo/yxz11
[hexo@localhost yxz11]$ vim _config.yml /<code>
<code>title: 征程
subtitle: 踏上一條不歸路
description: devops, aiops, dba, ops
keywords: Linux,Python,Oracle,MySQL,Docker,kubernetes
author: yxz11
language: zh-CN
timezone: Asia/Chongqing
......
theme: next #啟用next主題/<code>

驗證主題生肖

<code>[hexo@localhost yxz11]$ hexo server
或者
[hexo@localhost yxz11]$ hexo s/<code>

再次訪問,看下效果:http://localhost:4000


ITer基於GITHUB構建自己的博客(HEXO+NEXT)(上)

next的默認主題

現在看起來還是略為"簡單",但是NEXT默認主題是有三個的,我們可以來激活更換不同的風格,我們可以在後面的章節中來增加使用方式


分享到:


相關文章: