如何搭建一个自己的博客(一)

CzrTuringB：

2023年5月10日：笔者喜欢一边学习一边做笔记，这样既可以梳理清楚知识间的脉络层次关系，也可以在遗忘后及时复习、查缺补漏。我一直希望能有一款笔记软件能够兼顾简洁、免费、云同步、专业公式编辑等优点，但是市面上的软件总体表现都差强人意。正好，趁着近期毕业闲来无事，想着搭建一个属于自己的博客网站，在网站上发表一些自己的学习记录。

系列文章

第一部分 环境需求[1]

  • 环境需求：

    • nodejs
    • @hexo：博客框架
    • @git：将hexo生成的html相关文件部署到服务器上

第一章 nodejs的安装

  • 进入Node.js — 在任何地方运行 JavaScript (nodejs.org)这个页面，选择对应自己电脑系统(windows或mac)的安装包进行下载与安装。

  • 测试安装成功与否：

    1
    2
    3
    #查看版本信息
    npm -v
    node -v

  • 在Nodejs安装目录下新建两个目录node_global和node_cache，并在以管理员身份打开命令行窗口：

    1
    2
    3
    #路径需要根据自己实际情况自行更改
    npm config set prefix "D:\Environment\NodeJs\node_global"
    npm config set cache "D:\Environment\NodeJs\node_cache"

  • 配置环境变量：

    1. 在系统变量中新建：变量名：NODE_PATH 变量值：D:\Environment\NodeJs\node_global\node_modules

    2. 编辑用户变量中的Path：将默认的 C 盘下【 AppData\Roaming\npm 】修改成 【node_global】的路径

    3. 在系统变量中的Path下添加：%NODE_PATH%

    4. 测试：

      **CzrTuringB：**这里我出现了报错，需要将node_global目录和node_cache目录的权限设置为完全控制

      1
      2
      #安装express模块查看其安装路径
      npm install express -g

第二章 git工具的安装

  • git的安装：

    • 使用后面的地址下载git工具Git - Downloading Package (git-scm.com)

    • 默认安装即可，安装完成后打开gitBush：

      1
      2
      3
      4
      5
      6
      git config --global user.name "ChenZR"
      git config --global user.email "ChenZR20010509@outlook.com"
      git config user.name
      git config user.email
      #创建SSH
      ssh-keygen -t rsa -C "ChenZR20010509@outlook.com"

第二部分 项目创建

第一章 博客创建

  • nodejs安装hexo-cli插件：

    1
    npm install hexo-cli -g

  • 确定好自己的博客路径：

    1
    2
    3
    4
    5
    cd #自己的博客路径
    hexo init Blog	#hxeo初始化：在自己的路径下创建博客的基本运行文件
    cd Blog
    npm install	
    hexo server	#hexo生成本地网页，当源文件进行更改时，刷新网页即可

第二章 工程目录

  • Blog：

    • node_modules
    • scaffolds
    • source：存放博客markdown文件
    • themes
    • _config.yml：项目配置文件

第三章 博客部署

  • 服务器：轻量级腾讯云服务器

  • 架构：x86_64

  • 系统：ubuntu 24.04.2LTS

  • 内核：6.8.0-51-generic

  • 切换到root用户：

    • 安装环境：

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      apt install nginx
      apt install build-essential
      apt install openssl
      apt install libssl-dev
      apt install zlib1g
      apt install zlib1g.dev
      apt install libtool
      apt install nodejs npm
      	nodejs --version
      	npm -v
      apt install git

    • 安装PCRE：

      1
      2
      3
      4
      5
      6
      7
      8
      cd /usr/local/
      wget http://downloads.sourceforge.net/project/pcre/pcre/8.37/pcre-8.37.tar.gz
      tar -xvf pcre-8.37.tar.gz
      cd pcre-8.37
      ./configure
      make && make install
      #查看版本信息
      pcre-config --version

    • 配置nginx：

      1

  • 切换到博客的用户(blog)：

    • 若没有可以自行创建：

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      #在root下进行操作

      #1、创建用户并进行权限配置
      adduser blog

      #2、配置czr的权限能力
      chmod 740 /etc/sudoers
      #配置sudo命令使得czr用户可以使用sudo命令
      	## Allow root to run any commands anywhere 
      	root	ALL=(ALL) 	ALL
      	#在下面一行添加：使得git用户可以以超级用户的身份执行任何命令
      	czr 	ALL=(ALL) 	ALL
      #将sudoers文件的权限设置为【r-- --- ---】
      chmod 400 /etc/sudoers

      #3、创建完成后切换到czr用户
      su czr

    • 配置SSH密钥：

      1
      2
      3
      4
      5
      6
      cd ~
      mkdir .ssh
      cd .ssh
      vim authorized_keys
      chmod 600 ~/.ssh/authorized_keys
      chmod 700 ~/.ssh

    • 配置git：

      1
      2
      3
      4
      5
      6
      7
      8
      cd ~
      git init --bare blog.git
      #打开此文件
      vim ./blog.git/hooks/post-receive
      #在文件中添加
      git --work-tree=/home/website --git-dir=/home/blog/blog.git checkout -f
      #添加文件权限
      chmod +x ./blog.git/hooks/post-receive

    • 创建博客网页：

      1
      2
      3
      cd /home
      sudo mdkir website
      sudo chmod 777 /home/website

  • 在自己的电脑中进行：

    • 测试ssh链接：

      1
      ssh 刚才创建的用户名称@云服务器公网IP

    • 使用IDE项目并编辑项目配置文件，在其中添加部署信息：

      1
      2
      3
      4
      5
      deploy:
        type: git
        #repo: 刚才创建的用户名称@云服务器公网IP:刚才创建的仓库
        repo: blog@43.138.32.12:/home/blog/blog.git
        branch: master

    • Hexo部署：

      1
      2
      3
      4
      5
      #安装hexo git插件
      npm install hexo-deployer-git --save -g
      #部署
      hexo clean
      hexo g -d

  • 切换至云服务器的root用户：

    • 查看/home/website下是否有内容：

      1
      2
      cd /home/website
      ls

    • 配置nginx：

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      vim /etc/nginx/sites-enabled/default
      #在其中找到root /var/www/html;并注释掉
      #添加下面的内容：
      root /home/website;
      #配置完成后重启nginx
      #启动
      service nginx start
      #停止
      service nginx stop
      #重启
      service nginx reload

    • 在浏览器中输入自己服务器的公网IP，查看博客是否显示正常

参考

  1. Hexo搭建个人博客——系列教程_哔哩哔哩_bilibili ↩︎