利用hexo来配合nginx来打造属于自己的纯静态博客系统

什么是静态网站生成器？顾名思义，就是以最快的速度生成一个高可用的web页面，我们知道Django作为一款非常流行的框架被广泛应用，但是部署起来实在是太麻烦了，各种命令各种配置，动态页面必然要涉及数据库的配置和操作，另外只要涉及数据库操作，你就不得不考虑sql注入等一系列的安全因素。而纯静态页面则没有这个烦恼，如果我们只需要一个简单的站点，一些简单的功能和页面，比如博客，我们只想以极简的方式用markdown语法写下文字或者代码，让服务器访问纯静态页面，这就是静态网站生成器可以提供给我们的好处。

为啥选择hexo？

适用于搭建个人blog、公司主页、help等网站，是一种小型的CMS系统。静态站点的好处就是快速、安全、易于部署，方便管理。

　丰富的站点迁移工具，可以将wordpress，Ghost，Jekyll，DokuWiki，Blogger轻松迁移至 Hugo

    超详细的文档
    活跃的社区
    更加自由的内容组织方式
    丰富的主题模板，可以让你的网站更加炫目多彩

文档为Markdown格式,语法超简单

hexo安装命令：

• npm install hexo-cli -g
• hexo init blog
• cd blog
• npm install
• hexo server

这就是一个初始化的博客页面了

hexo serve：启动服务r

hexo generate：打包静态页面

hexo new post "<post name>"  ：创建文章

hexo clean ：清楚缓存

hexo server -s :运行静态页面

有些特殊符号不能使用所以只能使用替换的字符：

! ! — 惊叹号 Exclamation mark
” " &quot; 双引号 Quotation mark
# # — 数字标志 Number sign
$ $ — 美元标志 Dollar sign
% % — 百分号 Percent sign
& & &amp; Ampersand
‘ ' — 单引号 Apostrophe
( ( — 小括号左边部分 Left parenthesis
) ) — 小括号右边部分 Right parenthesis
* * — 星号 Asterisk
+ + — 加号 Plus sign
< < &lt; 小于号 Less than
= = — 等于符号 Equals sign
- - &minus; — 减号
> > &gt; 大于号 Greater than
? ? — 问号 Question mark
@ @ — Commercial at
[ [ --- 中括号左边部分 Left square bracket
\ \ --- 反斜杠 Reverse solidus (backslash)
] ] — 中括号右边部分 Right square bracket
{ { — 大括号左边部分 Left curly brace
| | — 竖线Vertical bar
} } — 大括号右边部分 Right curly brace

 还有一些hexo的语法命令:

标签插件和 Front-matter 中的标签不同，它们是用于在文章中快速插入特定内容的插件。

引用块
在文章中插入引言，可包含作者、来源和标题。

别号： quote

{% blockquote [author[, source]] [link] [source_link_title] %}
content
{% endblockquote %}
样例
没有提供参数，则只输出普通的 blockquote

{% blockquote %}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque hendrerit lacus ut purus iaculis feugiat. Sed nec tempor elit, quis aliquam neque. Curabitur sed diam eget dolor fermentum semper at eu lorem.
{% endblockquote %}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque hendrerit lacus ut purus iaculis feugiat. Sed nec tempor elit, quis aliquam neque. Curabitur sed diam eget dolor fermentum semper at eu lorem.

引用书上的句子

{% blockquote David Levithan, Wide Awake %}
Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy.
{% endblockquote %}
Do not just seek happiness for yourself. Seek happiness for all. Through kindness. Through mercy.

David LevithanWide Awake
引用 Twitter

{% blockquote @DevDocs https://twitter.com/devdocs/status/356095192085962752 %}
NEW: DevDocs now comes with syntax highlighting. http://devdocs.io
{% endblockquote %}
NEW: DevDocs now comes with syntax highlighting. http://devdocs.io

@DevDocstwitter.com/devdocs/status/356095192085962752
引用网络上的文章

{% blockquote Seth Godin http://sethgodin.typepad.com/seths_blog/2009/07/welcome-to-island-marketing.html Welcome to Island Marketing %}
Every interaction is both precious and an opportunity to delight.
{% endblockquote %}
Every interaction is both precious and an opportunity to delight.

Seth GodinWelcome to Island Marketing
代码块
在文章中插入代码。

别名： code

{% codeblock [title] [lang:language] [url] [link text] %}
code snippet
{% endcodeblock %}
样例
普通的代码块

{% codeblock %}
alert('Hello World!');
{% endcodeblock %}
alert('Hello World!');
指定语言

{% codeblock lang:objc %}
[rectangle setX: 10 y: 10 width: 20 height: 20];
{% endcodeblock %}
[rectangle setX: 10 y: 10 width: 20 height: 20];
附加说明

{% codeblock Array.map %}
array.map(callback[, thisArg])
{% endcodeblock %}
Array.map
array.map(callback[, thisArg])
附加说明和网址

{% codeblock _.compact http://underscorejs.org/#compact Underscore.js %}
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]
{% endcodeblock %}
_.compactUnderscore.js
_.compact([0, 1, false, 2, '', 3]);
=> [1, 2, 3]
反引号代码块
另一种形式的代码块，不同的是它使用三个反引号来包裹。

``` [language] [title] [url] [link text] code snippet ```

Image
在文章中插入指定大小的图片。

{% img [class names] /path/to/image [width] [height] [title text [alt text]] %}
Link
在文章中插入链接，并自动给外部链接添加 target="_blank" 属性。

{% link text url [external] [title] %}

Vimeo
在文章中插入 Vimeo 视频。

{% vimeo video_id %}

hexo就会把你的站点生成纯静态页面，然后打包到public文件夹

将public上传到阿里云服务器的root目录下

修改nginx配置文件

vim /etc/nginx/conf.d/default.conf

　　

 监听80端口，并且项目目录指定/root/public

server {
    listen       80;
    server_name  localhost;

    access_log      /root/md_vue_access.log;
    error_log       /root/md_vue_error.log;

    client_max_body_size 75M;

    location / {

        root /root/public;
        index index.html;

    }

    error_log    /root/md_vue/error.log    error;

}

　　

重启nginx systemctl restart nginx.service 然后访问一下

这是hexo的官方文档：https://hexo.io/zh-cn/docs/

这里面有语法以及很多主题的选择

这就是我的hexo私人博客：有兴趣的可以访问以下：https://v7d.cn/