BOMB: Birth Of My Blog

用于记录我的博客的诞生

Step 0.1: 安装 `Hugo`

安装 Git: 用于和 GitHub 仓库的交互（如上传本地网页和下载主题或软件）

brew install git

Git is a distributed version control system.

安装 Go: 下载安装包安装即可

Go is a statically typed, compiled high-level programming language.

安装 Dart Sass: 有些主题（如TeXify3）的渲染需要用到

brew install sass/sass/sass

Sass is a preprocessor scripting language that is interpreted or compiled into CSS.

完成之后会在 myblog 文件夹创建两个名为 node_modules 和 resources 的文件夹和两个 json 文件

遇到的报错：

问题参考这里，解决：先

 rm -rf "/usr/local/Homebrew/Library/Taps/homebrew/homebrew-core"

Error: Cannot find module 'autoprefixer'，解决：需要先安装 node.js 和 npm
- node.js: 下载安装包安装即可，或 brew
- npm: 有些包需要用 npm 而不是 brew 安装（如autoprefixer，大概一共遇到了两三个）
```
brew install npm
npm install autoprefixer
```

Node.js is a cross-platform, open-source JavaScript runtime environment.

npm is a package manager for the JavaScript programming language.

安装 Hugo:

brew install hugo

Hugo is a static site generator written in Go.

Step 0.2: 本地网页

参考：your-first-hugo-blog-a-practical-guide

创建 Hugo Site

hugo new site myblog

会在home目录创建一个名为myblog的文件夹，用于存放整个博客

选择主题，可以在Hugo上选择自己喜欢的主题（逛超市），比如参考里面推荐的ghostwriter，下载完成后放在 ~/myblog/themes 中，打开会看到有一个 ExampSite 文件夹，把里面 content 文件夹里的 Page 和 Post 文件夹复制到 ~/myblog/content 中，并且修改配置文件 hugo.toml 为

baseURL = "/"
theme = "ghostwriter"

创建本地网页，先 cd 到 myblog，然后

hugo server

输入网址 http://localhost:1313/ 即可访问

Step 1: 部署上线

Step 1.1: 远程登陆服务器

直接 ssh

ssh @server_ip

Step 1.2: 安装 `nginx`

参考：How To Install Nginx on Ubuntu 20.04 + Nginx 学习笔记

先更新 apt 并安装开发者工具包

sudo apt update 
sudo apt install build-essential

否则会报错：E: Unable to locate package nginx，然后安装 nginx

sudo apt install nginx

Nginx is a reverse proxy web server.

Step 1.3: 防火墙设置

安装防火墙管理程序 ufw 并查看

sudo apt install ufw
sudo ufw app list

应该看到

Output
Available applications:
    ...
    Nginx Full
    Nginx HTTP
    Nginx HTTPS
    ...

如果没有就

sudo ufw allow 'Nginx HTTP'

Step 1.4: 测试

测试网站

curl -4 icanhazip.com

输入网址 http://server_ip 将会看到 Welcome to nginx!

Step 1.5: 上传本地网页

将本地网页打包

hugo --theme='theme_name' --baseURL="server_ip" --buildDrafts

会在 myblog 下创建一个名为 public 的文件夹，然后使用 scp 命令上传到服务器

scp -r local_public_path user_name@server_ip:server_public_path

在参考2中 server_public_path = /var/www/domain_name/ ，为避免权限问题，可以

sudo chown -R www-data: /var/www/domain_name

配置 `Nginx`

参考：如何在 Ubuntu 20.04 上设置 Nginx 服务器配置块

创建配置文件

cd /etc/nginx/sites-available/
touch domain_name
vim domain_name

写入配置文件

server {
    listen 80;

    server_name domain_name;

    root /var/www/domain_name/public;

    index index.html;
}

listen 80: Nginx 默认监听端口为80

server_name domain_name: 匹配服务器配置块的域名

root /var/www/domain_name/public: 服务器中网页文件(public)路径

index index.html: 网页

创建一个从配置文件到 sites-enabled 目录的符号链接，这个目录将会在 Nginx 启动时被读取

sudo ln -s /etc/nginx/sites-available/domain_name /etc/nginx/sites-enabled/

检查配置文件语法是否正确

sudo nginx -t

如果正确将会看到

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

之后重启 Nginx

sudo systemctl restart nginx

退出服务器，ping一下域名是否能够连接

ping domain_name

如果可以，输入网址 http://domain_name 就能看到博客辣！

$\ddot{\smile}$

Step 0.1: 安装 Hugo#

Step 0.2: 本地网页#

Step 1: 部署上线#

Step 1.1: 远程登陆服务器#

Step 1.2: 安装 nginx#

Step 1.3: 防火墙设置#

Step 1.4: 测试#

Step 1.5: 上传本地网页#

配置 Nginx#