「山禾說成長」：手把手教你搭建一個徹底屬於本身的技術博客

搭建前的準備

在咱們正式開始搭建一個徹底屬於咱們本身的博客以前，咱們首先要作好一些事前的準備（固然，若是你沒有作好準備也沒有關係，下面會一步一步的教你搞定這些）

1. 服務器一臺 or github 帳號一個（二選一）
2. 域名一個（可選）
3. node.js（建議10.0以上版本）
4. git

域名和服務器的購買我這裏就不在文章中進行講解了，各大雲廠商都還不錯，你們能夠自行搜索進行購買～

基礎架構

這裏我選用的博客方案是較爲成熟的 Hexo 靜態博客進行操做的

下面來說解一下上面須要準備的東西都有什麼用，分別是三種部署方式

1. 若是你有一臺服務器，能夠選擇把博客部署到本身的服務器，這樣的好處是國內訪問速度快，在進行百度搜索SEO的方便（由於百度貌似把github的站點屏蔽掉了），可是比較麻煩，須要有必定命令行的基礎（固然若是你沒有也沒有關係，畢竟像我這樣貼心的人確定是手把手的教）

2. 若是沒有服務器，咱們能夠使用 Github Pages 服務，這樣的作的好處是方便，最快五到十分鐘就能夠搭建一個出來大體的樣子出來，可是因爲GitHub的服務器在國外，國內的訪問速度上就會收到必定影響。

3. 和第二種相差無幾，咱們能夠選擇把博客部署到 GitLab Pages 服務上，和第二種方法有一些小的區別，可是也很方便～

固然，像我這麼貼心的博主，確定是三種方法都教給你，由你本身去作出選擇，看到這裏我以爲就能夠交出你的三連（關注+點贊+轉發）了～

image-20200705184424589

準備工做

####申請GitHub帳號

1. 打開註冊網址

   image-20200705173041053

2. 填寫相關信息後便可完成註冊

安裝NodeJS

1. 打開下載地址

2. 選擇合適的版本，傻瓜式安裝便可～

3. 打開命令行，輸入node -v，看到以下圖所示的版本信息即爲成功～

####安裝Git

1. 打開 下載地址

2. 選擇合適的版本，傻瓜式安裝便可～

3. 打開命令行，輸入git --version，看到以下圖所示的版本信息即爲成功～

截止這裏，咱們要作的前置工做就能夠告一段落了，下面咱們開始

####本地hexo安裝

不管哪種方法，都離不開這第一步，在咱們本地的電腦中安裝 hexo

npm install hexo-cli -g
$ hexo init blog && cd blog
npm i
hexo s

按照上面的順序進行操做，最後在瀏覽器中輸入 localhost:4000便可看到效果～

方法一：部署在本身的服務器上（建議有必定編程基礎的人員服用）

在服務器上安裝 git

1. 若是在咱們的服務器上輸入 git --version毫無反應，說明該服務器鏡像上沒有預裝git，就須要咱們去手動安裝～
2. 安裝git

yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel perl-devel
yum install -y git

3. 建立用戶

useradd git
passwd git

4. 切換到該用戶去建立倉庫

su git
cd /home/git/
mkdir blog
mkdir repo
cd repo
git init --bare blog.git

5. 建立鉤子

cd blog.git/hooks
vi post-receive
// 輸入內容
#!/bin/sh
git --work-tree=/home/git/blog --git-dir=/home/git/repo/blog.git checkout -f

6. 賦權

chmod +x post-receive
exit // 退出到 root 登陸
chown -R git:git /home/git/repos/blog.git // 添加權限

7. 測試

git clone git@server_ip:/home/git/blog/blog.git

若是能夠拉取成功，就說明咱們的服務器配置已經搞定了～

在服務器上安裝 nginx

1. 安裝nginx

cd /usr/local/src
wget http://nginx.org/download/nginx-1.16.1.tar.gz
tar xzvf nginx-1.16.1.tar.gz
cd nginx-1.16.1
./configure
make && make install
alias nginx='/usr/local/nginx/sbin/nginx'

2. 配置nginx

cd /usr/local/nginx/conf
mkdir vhost & cd vhost
vi myblog.conf

server{
     listen    80;
     root /home/git/shanhe/blog/;
     index index.html index.php;
     location /{
     }
}

vim ../nginx.conf

// 在http下引入便可
include /etc/nginx/vhost/*.conf;

至此nginx的配置便告一段落～

部署到服務器上

1. 安裝推送工具

npm install --save hexo-deployer-git

2. 修改 _config.yml文件

deploy:
  type: git
  repo: git@server_ip:/home/git/repo/blog.git
  branch: master

3. 在本地的博客文件夾下輸入 deploy命令，並輸入帳號密碼便可～

hexo clean && hexo generate --deploy

4. 輸入你的服務器IP，便可訪問查看效果啦～

方法二：部署到GitHub Pages上（建議新手服用）

和第一種方法相比，這種方法無疑是簡單了許多，若是熟練的話，能夠在五分鐘以內便可完成，強烈建議新手使用！

1. 建立名稱爲xxx.github.io的倉庫（xxx是你的github帳號）

2. 找到倉庫地址

3. 修改 _config.yml文件

deploy:
  type: git
  repo: git倉庫地址
  branch: master

4. 在本地的博客文件夾下輸入 deploy命令，並輸入帳號密碼便可～

hexo clean && hexo generate --deploy

綁定我的域名

1. 在咱們的博客根目錄下添加CNAME文件，裏面寫上咱們的域名

shanhe.show

2. 而後在域名解析分別解析指到咱們服務器的ip或者xxx.github.io。
3. 將本地的項目從新deploy一遍便可輸入域名查看效果
4. 域名如今都須要備案，不然沒法訪問（備案我會單獨寫一篇教程，折騰了我很久。到我寫這篇文章也沒備案好）

下篇教你配置主題，打造博客，預覽圖片以下：