怎么快速搭建一个美观实用的博客？

博客使用静态网站生成技术生成，静态网站生成是指静态生成网站的过程，即生成HTML文件，例如，在本地计算机中，然后将网站文件上载到服务器，该服务器在被请求时向用户提供服务。相比动态网站，有以下优点：

• 内容存储为平面文件，因此不需要数据库
• 静态网站不需要动态服务器端处理
• 静态网站比动态网站超快，因为它们不需要服务器端处理或数据库访问
• 静态网站比任何动态网站都更安全，因为可以利用的安全漏洞更少
• 缓存静态文件比缓存动态页面更有效

目前网上主流的静态站点生成器有三个，分别为Jekyll、Hugo、Hexo。
其中Jekyll由Github用Ruby语言构建，您可以免费使用Github Pages来托管您的静态网站，并使用CNAME文件轻松将其与您的自定义顶级域名链接。
它的主要弱点为随着网站内容的增长，构建过程变得非常慢。
另外，Hugo是一个用Go构建的静态站点生成器。它被宣传为“世界上最快的网站构建框架”。它最近与Jekyll相比，但在人气方面迅速增长。
它的主要缺点为可扩展性差和插件少。
而Hexo是基于Node的开源静态生成器，可在MIT许可下使用。借助Node.js平台，Hexo允许您在几秒钟内生成数百个静态文件。
主要有以下优点：

• 快速而令人难以置信的速度
• 使用一个部署命令部署到Github页面或任何其他主机
• 强大的Markdown支持
• 高度可扩展
• 可用的免费和开源主题
• 可用的免费插件

而且它的缺点是：Hexo有一个相对较大的社区，但大多数是非英语人士（来自中国），这个缺点从我们的角度来看就是优点啊。

根据以上分析，我采用的总体方案为：采用Hexo进行博客创建，其中使用Next主题进行配置，将生成的博客静态网站部署在自己搭建的vps服务器上，最后采用dnspot对域名进行解析。具体细节见下文。

Hexo环境搭建

1. 安装
   参照https://hexo.io/zh-cn/docs/ 网站，主要包括Node.js、Hexo和Git安装，Node.js、Git可以直接下载安装包安装，Hexo可以在Git Bash命令行里面安装：

   $ npm install -g hexo-cli
   

2. 建站
   环境搭建好后就可以开始建站了，同样在Git Bash里面输入命令行进行：

   $ hexo init <folder>
   $ cd <folder>
   $ npm install hexo --save
   

   其中folder为你要建立的博客的文件夹。

3. 相关命令
   站点建立好后，就可以开始写文章了，可以使用sublime编辑软件打开刚刚建好的folder博客文件夹，找到source/_posts目录即为要写的文章地址。
   涉及到的一些命令如下：

   #新建文章
   $ hexo new [layout] <title>
   #生成静态文件
   $ hexo generate
   #启动服务器
   $ hexo server
   #部署网站
   $ hexo deploy
   #生成完成后部署
   hexo g -d
   #清除缓存文件 (db.json) 和已生成的静态文件 (public)
   $ hexo clean
   

Next主题

1. 下载使用
   进入之前建好的博客文件夹根目录，打开Git Bash，使用git命令进行Next源代码下载：

   $ git clone https://github.com/iissnan/hexo-theme-next themes/next
   

   Git怎么使用子模块？
   通过在 git submodule add 命令后面加上想要跟踪的项目 URL 来添加新的子模块：

   git submodule add https://github.com/iissnan/hexo-theme-next themes/next
   #查看
   cat .gitmodules
   #保持更新
   git submodule update --init --recursive
   

2. 配置使用
   关于Next主题的配置使用，直接看官网就好。

Hexo本地配置

1. 主题配置
   打开站点配置文件_config.yml，位于跟目录下，可以选择使用Next作为主题，参照官网进行配置就好。

2. 部署配置
   部署其实就是怎么把生成的静态网站上传到服务器端，把部署方式和地址说明一下，我这里采用的是自己搭建的git服务器，也可以是github（那就要在github上新建 blogname-github-io 仓库）

   deploy: 
   type: git
   repo: git@你的服务器IP:/home/git/blog.git
   branch: master
   

VPS搭建Hexo博客

作为自己搭建服务器来说，这部分是重点了。

1. 什么是vps？
   VPS（Virtual Private Server 虚拟专用服务器）技术，将一台服务器分割成多个虚拟专享服务器的优质服务。比如搬瓦工VPS是一款性价比较高的便宜VPS主机，且适合入门级网友学习Linux、建站和软件调试用途。搬瓦工VPS目前有洛杉矶MC、洛杉矶QN、凤凰城、佛罗里达、荷兰这8个数据中心，对中文速度较好的是洛杉矶和凤凰城。

2. 基本原理
   在服务器上搭建一个Git仓库。在本地Hexo执行deploy后，博客文件会被push到这个Git仓库，然后这个仓库又会通过一个git-hooks的功能把文件同步到VPS的网站根目录，经过Nginx代理服务把网站展现给用户。参考下图

   
   image

3. Git服务器设置
   在.git/hooks文件夹中创建一个钩子文件：post-receive，注意没有后缀.sample，这样每当git仓库接收到内容的时候，就会自动调用这个钩子，把内容同步到网站根目录。需要修改post-receive权限使其可执行，chown git:git -R post-update/chmod +x post-update。

   
   image
   

   debug需要注意的地方，实际问题通过git push origin master返回log查看即可。

4. Nginx设置
   web服务器选择Nginx，Nginx与Apache比较，有如下优点：

   • Nginx轻量级，占用资源少，负载均衡，高并发处理强，静态内容处理高效。
   • Apache拥有丰富的模块组件支持，稳定性强，BUG少，动态内容处理强。

   常见命令：

   #安装Nginx
   yum install -y nginx
   #启动Nginx服务
   service nginx start
   #测试Nginx配置文件
   nginx -t
   

   重点说一下Nginx的配置部分

   #配置之前备份一下
   cp /etc/nginx/nginx.conf /etc/nginx/nginx.conf.bak
   #修改默认端口号
   vi /etc/nginx/conf.d/default.conf
   #修改配置文件
   vim /etc/nginx/nginx.conf
   

   image

   这样配置好后就可以通过 http://vps服务器地址:端口号 来访问站点了。

域名解析

最后一步，也是最难理解的一步，将服务器地址解析到域名。首先得买一个域名，通过一些相关的设定后，以后直接通过访问域名来访问站点了。

1. 概念解读
   需要了解一些常识，什么叫DNS？
   DNS（域名系统）是一个庞大的服务器网络，包含地球上最大的数字数据库。该数据库由多个互联网机构维护，管理和监管，包括IANA（互联网号码分配机构）和ICANN（互联网名称与数字地址分配机构）。
   DNS是互联网的中央数据库，如果没有它，互联网将不会像现在一样存在。
   它一般处理的数据包括：

   • 名字(name)：指的是域名
   • 资源(resource)：包括A(主机地址，一般就是主机的IP)、NS(域名服务器记录（Name Server），返回保存下一级域名信息的服务器地址。该记录只能设置为域名，不能设置为IP地址。)、CNAME(规范名称记录（Canonical Name），返回另一个域名，即当前查询的域名是另一个域名的跳转)、MX(邮件记录（Mail eXchange），返回接收电子邮件的服务器地址)、TXT(任意字符串)等等。

   基本处理原理见下图，下面会结合具体例子进行解读：

   
   image

   另外处理数据里面包含的NS指的是什么呢？它是名称服务器，是安装有DNS软件的Web服务器，特别是由Web主机管理的服务器，该主机专门用于管理与所有主机提供商的帐户关联的域名。

2. dnspot设置
   使用dnspos进行设定，注册账号就可以，这就是一个dns服务器，在国内，解析的比较快，设定如下：

   
   image
   

   由于我是用godaddy购买的域名，还要在godaddy里面告诉它我使用了第三方的dns服务器，不使用dodaddy自带的了，因为自带的服务器在国外，解析肯定会慢些。

   
   image

3. 深扒dns
   可能你还是不理解什么叫dns，它是怎么工作的？我们使用dig工具来深入解读一下域名nephen.cn是怎么解析出它具体的服务器地址的？
   如果你使用的是linux系统，本身就自带了dig命令，如果是windows系统，使用网页版工具diggui就好了。
   输入如下：
   

   image
   得出输出结果：
   image
   再一一解读一下：

• 计算机查找相应IP地址的第一个位置是其本地DNS缓存，该缓存存储计算机最近检索到的信息，如果没有则进行DNS检索查询。
• dig问8.8.8.8：根区域的名称服务器是什么？
  8.8.8.8回复：名称服务器为a.root-servers.net...
  dig随机挑选了k.root-servers.net并解析为193.0.14.129，端口号为53
• dig问193.0.14.129：nephen.cn的地址是多少？
  193.0.14.129回复：我不知道，你可以问下cn.名称服务器，他们是a.dns.cn. ... f.dns.cn.
  dig随机选择了e.dns.cn，解析地址为203.119.29.1，端口号为53
• dig问203.119.29.1：nephen.cn的地址是多少？
  203.119.29.1回复：我不知道，可以问下nephen.cn名称服务器，他们是f1g1ns1.dnspod.net.，f1g1ns2.dnspod.net.
  dig随机选择了f1g1ns1.dnspod.net，解析地址为58.247.212.36，端口号为53
• dig问58.247.212.36：nephen.cn的地址是多少？
  58.247.212.36回复：23.106.149.209
  如果使用的是nephen.github.io托管网页，那这里会回答为CNAME为nephen.github.io，重新进行递归查找真正的地址
• 递归服务器8.8.8.8从权威名称服务器检索dyn.com的A记录，并将记录存储在其本地缓存中，缓存TTL时间更新一次。
  如果有其他人请求nephen.cn的主机记录，递归服务器将已经有了答案，不需要再次进行查找过程
  DNS解析器在查询DNS服务器之前始终检查本地缓存，包括当前DNS解析器缓存内容和从Hosts文件预加载的条目
  相关命令：C:> ipconfig /displaydns、C:> ipconfig /flushdns
• 递归服务器会将A记录返回给您的计算机。您的计算机将记录存储在其缓存中，从记录中读取IP地址，然后将此信息传递给您的浏览器。

当然windows也有自带的nslookup可以查询，直接就能查出解析后的地址，其中208.67.222.222为手动选择的递归服务器，跟上面例子中的8.8.8.8是一个性质的。

image

还可以使用一些别的网络工具，随便推荐几个：

• https://dnslookup.online/
• https://network-tools.com
• https://www.whatsmydns.net

以上就是建站的整个过程，夹杂了一些对问题的思考，希望对你有所启发，每一个技术问题背后其实有很多东西需要弄明白的，当我们搞清楚以后心里才会觉得更加踏实，从另一个层面来讲，弄清楚了底层的技术原理，对出现问题也能更加快速的定位，对出现新的技术也能触类旁通。

• 本文作者： nephen
• 本文链接： http://nephen.cn/2018/11/23/怎么快速搭建一个美观实用的博客？/
• **版权声明： **本博客所有文章除特别声明外，均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处！