美文网首页kk
使用hexo+nginx搭建静态页面博客

使用hexo+nginx搭建静态页面博客

作者: SavingUnhappy | 来源:发表于2019-05-04 17:14 被阅读48次

前言

找工作两个月了,面试了大大小小近十家,面试机会真的是太少了,我以为可以一天面两家的,哈哈,又不怕累,但是并没有给我这个机会。

在投简历的过程中,发现好多jd上都建议附个人博客的地址,算是加分项,反观自己17年9月开始工作,大大小小的问题遇到的不少,却没有这方面的积累,应该说是直接没有这种想法。

还好,不算晚,我还年轻。

为什么使用Hexo来搭建博客

当然作为一个后端程序员,还是python开发,一开始想着的是自己用Django框架可以快速的写一个简单的博客。确实很快,博客列表和详情一早上就搞定了,前端使用的一个简单的模板,修修改改,样式不是很喜欢,但是可选项不多,谁让我自己不会设计,不会写前端呢。没事,可以用就好了,博客最重要的是内容,又不是外表,只能这么安慰自己。

然后求职过程中接到了一个外包,博客就搁浅了,好多想要的功能还没开始写,还是要把接到的任务放在第一位的,毕竟要吃饭的嘛。

写完任务之后,心态有点变了,我在找工作,我还要吃饭,至少工作没稳定之前没有那么多时间,就决定使用现有的博客系统来完成,然后就查一些优劣,应该选择哪种方案,参考了以下文章。

准备自己建一个个人博客,有什么好的框架推荐?

个人博客平台的选择

结合自己目前的需求,最后选择了Hexo。

效果可以看看我的博客:https://zz.zzs7.top/

Hexo

分为介绍和部署两部分。

介绍部分内容在文档中都有,我只是按流程做一个简单的教程,以及遇到的问题,详细的建议仔细阅读官方文档。

介绍

Hexo是由中国人写的,有着中文文档的支持。

hexo中文官网是这么介绍的:

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

安装

依赖

  • node.js(需要6.9版本以上)

    根据自己的系统环境安装,官网有对应的安装包,Linux可以直接通过命令行安装。

  • git

    Windows:下载并安装 git.

    Mac:使用 Homebrew, MacPorts :brew install git;或下载 安装程序 安装。

    Linux:使用对应的Linux的发行版本的安装命令安装。

安装Hexo

npm install -g hexo-cli

命令很简单,但是在我运行的时候报错了,报错两次。(讲道理这种情况比较少出现)

  • 第一次是报/usr/lib/node_modules/的操作权限。
sudo chown -R `whoami` /usr/local/lib/node_modules
  • 第二次是在创建/usr/bin/hexo软链接的时候报错了。

可以选择自己手动创建软链接,或者直接使用sudo命令安装,我选择sudo。(网上不建议这么做,怕安装的npm还是node环境多了有奇怪的异常,但是我是python开发啊,应该不会安装太多的这些环境)。

初始化

我要在/home/zhi/hexo下创建一个博客站点。

cd /home/zhi/hexo # hexo文件夹是我自己新建的,方便管理所有使用hexo创建的站点。目前是空的。
# 初始换
hexo init blog # blog是我需要创建的站点名字,会在当前目录下生成
ls
blog # 生成了对应名字的文件夹

blog目录里面生成了需要的文件

.
├── _config.yml # 我们主要会做修改的配置文件
├── db.json
├── node_modules
├── package.json
├── package-lock.json
├── public # 生成的静态页面会在这
├── scaffolds # 模板
├── source # 生成的md文章
└── themes # 主题

新建文章

新建test的文章

hexo new test

在source下会生成名为test.md的文件,编写自己的博客内容。

配置

hexo的配置文件为_config.yml,根据自己的需要进行配置。建议阅读hexo的文档,就不在这里赘述了。

部署

官方文档提供了几种不同的部署方式,较多的人部署在了github上面。由于github在国外,访问速度大多数情况下比较感人,如果有自己的服务器的话,可以选择部署在自己的服务器上。

我在这里选择使用nginx作为服务器,部署在了阿里的云服务器中,学生机比较实惠。

方案

虽然可以将public中的内容复制到服务器中,使用nginx代理静态文件,但是过程肯定是比较繁琐的,我们需要本地修改了,然后可以同步到服务器中.

image

环境准备

个人PC

在之前的过程中,安装了hexo,还需要安装部署插件。

npm install hexo-deployer-git --save

服务器环境

我的服务器系统环境是Centos7.4.

安装Git

yum install git -y

新建 Git 用户

useradd -m git

设置 gituser 的密码

passwd git

配置ssh免密登录服务器

  1. 生成ssh密钥。
ssh-keygen
  1. 将公钥添加到服务器上。user为用户,host为服务器公网IP。
ssh-copy-id -i ~/.ssh/id_rsa.pub user@host
  1. 验证是否成功
ssh user@host

初始化一个Git仓库。

新建 /var/repo 目录(位置并不是必须在这),并在该目录下,使用 git init --bare 创建一个名为 blog.git(名字可以自己修改,将以下的对应的内容都做修改就好) 裸仓库,并改变该目录的所有者为 git 用户。

mkdir -p /var/repo
cd /var/repo
git init --bare blog.git
chown -R git:git blog.git

看看生成的blog.git内的内容

blog.git
├── branches
├── config
├── description
├── HEAD
├── hooks # 接下来需要在此处进行一些配置
├── index
├── info
├── objects
└── refs

配置Git hooks

进入上面生成的hooks目录,新建名为post-receive的文件,写入下面内容。

#!/bin/sh
git --work-tree=/home/www/hexo --git-dir=/var/repo/blog.git checkout -f

将post-receive设置为可执行。

chmod +x /var/repo/blog.git/hooks/post-receive

安装nginx

yum install nginx

创建需要代理的文件夹,就是你问博客内容需要放在哪。

mkdir -p /home/www/hexo      //创建目录
chown -R git:git /home/www/hexo   //更改目录所有者

修改配置文件/etc/nginx/nginx.conf中以下的内容。将root对应的文件夹改为你上面创建的文件夹。

    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
        root         /home/www/hexo;

        include /etc/nginx/default.d/*.conf;

        location / {
        }

        error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }

配置_config.yml文件。找到deploy选项进行修改。

# Deployment
deploy:
- type: git
  repo: your_user_name@HostIP:/var/repo/blog.git
  branch: master
  message:

发布自己的博客。

hexo clean && hexo d -g

欢迎来我的博客与我交流:SavingUnhappy

相关文章

  • 使用hexo+nginx搭建静态页面博客

    前言 找工作两个月了,面试了大大小小近十家,面试机会真的是太少了,我以为可以一天面两家的,哈哈,又不怕累,但是并没...

  • 使用hugo搭建静态博客网站

    使用hugo搭建静态博客网站 hugo是使用go语言编写的快速搭建静态博客的工具。 安装我使用的系统是Ubuntu...

  • HEXO 趟坑笔记

    我的blog 如何使用Hexo在github上搭建静态博客 如何使用Hexo在github上搭建静态博客 感冒两天...

  • 【js】实现一个简易mvvm库的实现

    基于``github page``和``github api``搭建的单页面静态博客,页面风格仿照 ECMAScr...

  • 使用CHCA搭建静态博客

    [toc] chca是一个使用golang开发的静态博客生成器,简单、方便、快捷,抛弃每次都需要使用命令编译文件,...

  • 使用Hexo搭建静态博客

    未完待续..... 前言 作为一个有技术追求的程序员,没有一个独立域名的技术博客,还怎么在业内混(zhuang)呢...

  • 使用Hugo搭建静态博客

    经过一番折腾,自己的博客总算上线了,也顺便做了个的程序员博客主题 Hugo介绍 Hugo是由Go语言实现的静态网站...

  • 迁移博客到阿里云

    起因 去年在AWS上搭建的博客已经过去一年多了,之前在使用Hexo搭建个人静态博客这篇文章中提到,使用AWS可以免...

  • 180605-Linux下Crontab实现定时任务

    Linux下Crontab实现定时任务 基于Hexo搭建的个人博客,是一种静态博客页面,每次新增博文或者修改,都需...

  • Hexo博客搭建详细笔记(Win10+Gitee)

    目录 1、为什么要搭建个人博客 2、搭建个人博客的多种选择 (1)动态博客搭建 (2)静态博客搭建 3、先简要介绍...

网友评论

    本文标题:使用hexo+nginx搭建静态页面博客

    本文链接:https://www.haomeiwen.com/subject/pcqfoqtx.html