「山禾说成长」:手把手教你搭建一个彻底属于本身的技术博客

搭建前的准备

在咱们正式开始搭建一个彻底属于咱们本身的博客以前,咱们首先要作好一些事前的准备(固然,若是你没有作好准备也没有关系,下面会一步一步的教你搞定这些)php

  1. 服务器一台 or github 帐号一个(二选一)
  2. 域名一个(可选)
  3. node.js(建议10.0以上版本)
  4. git

域名和服务器的购买我这里就不在文章中进行讲解了,各大云厂商都还不错,你们能够自行搜索进行购买~html

基础架构

这里我选用的博客方案是较为成熟的 Hexo 静态博客进行操做的node

下面来说解一下上面须要准备的东西都有什么用,分别是三种部署方式nginx

  1. 若是你有一台服务器,能够选择把博客部署到本身的服务器,这样的好处是国内访问速度快,在进行百度搜索SEO的方便(由于百度貌似把github的站点屏蔽掉了),可是比较麻烦,须要有必定命令行的基础(固然若是你没有也没有关系,毕竟像我这样贴心的人确定是手把手的教)git

  2. 若是没有服务器,咱们能够使用 Github Pages 服务,这样的作的好处是方便,最快五到十分钟就能够搭建一个出来大体的样子出来,可是因为GitHub的服务器在国外,国内的访问速度上就会收到必定影响。github

  3. 和第二种相差无几,咱们能够选择把博客部署到 GitLab Pages 服务上,和第二种方法有一些小的区别,可是也很方便~web

固然,像我这么贴心的博主,确定是三种方法都教给你,由你本身去作出选择,看到这里我以为就能够交出你的三连(关注+点赞+转发)了~npm

image-20200705184424589
image-20200705184424589

准备工做

####申请GitHub帐号编程

  1. 打开注册网址vim

    image-20200705173041053
    image-20200705173041053
  2. 填写相关信息后便可完成注册

安装NodeJS

  1. 打开下载地址

  2. 选择合适的版本,傻瓜式安装便可~

  3. 打开命令行,输入node -v,看到以下图所示的版本信息即为成功~

####安装Git

  1. 打开 下载地址
  1. 选择合适的版本,傻瓜式安装便可~

  2. 打开命令行,输入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
  1. 建立用户
useradd git
passwd git
  1. 切换到该用户去建立仓库
su git
cd /home/git/
mkdir blog
mkdir repo
cd repo
git init --bare blog.git
  1. 建立钩子
cd blog.git/hooks
vi post-receive
// 输入内容
#!/bin/sh
git --work-tree=/home/git/blog --git-dir=/home/git/repo/blog.git checkout -f
  1. 赋权
chmod +x post-receive
exit // 退出到 root 登陆
chown -R git:git /home/git/repos/blog.git // 添加权限
  1. 测试
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'
  1. 配置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
  1. 修改 _config.yml文件
deploy:
  type: git
  repo: git@server_ip:/home/git/repo/blog.git
  branch: master
  1. 在本地的博客文件夹下输入 deploy命令,并输入帐号密码便可~
hexo clean && hexo generate --deploy
  1. 输入你的服务器IP,便可访问查看效果啦~

方法二:部署到GitHub Pages上(建议新手服用)

和第一种方法相比,这种方法无疑是简单了许多,若是熟练的话,能够在五分钟以内便可完成,强烈建议新手使用!

  1. 建立名称为xxx.github.io的仓库(xxx是你的github帐号)
  1. 找到仓库地址
  1. 修改 _config.yml文件
deploy:
  type: git
  repo: git仓库地址
  branch: master
  1. 在本地的博客文件夹下输入 deploy命令,并输入帐号密码便可~
hexo clean && hexo generate --deploy

绑定我的域名

  1. 在咱们的博客根目录下添加CNAME文件,里面写上咱们的域名
shanhe.show
  1. 而后在域名解析分别解析指到咱们服务器的ip或者xxx.github.io。
  2. 将本地的项目从新deploy一遍便可输入域名查看效果
  3. 域名如今都须要备案,不然没法访问(备案我会单独写一篇教程,折腾了我很久。到我写这篇文章也没备案好)

下篇教你配置主题,打造博客,预览图片以下:

相关文章
相关标签/搜索