个人博客（本站）

Tue, 01 Sep 2026 13:05:00 +0800

项目概述

你现在看到的这个网站，就是我的第一个完整独立部署的 Web 项目。

从域名备案、服务器采购，到站点搭建、HTTPS 证书、自动化部署，全流程独立完成。除了站点本身，还为它写了一套配套的本地工具：notes-ui 笔记工作台——把「写完的 Markdown 笔记 → 线上文章」的全流程做成了浏览器界面，拖拽上传、自动处理图片、分步构建部署。

架构

flowchart LR
 UI["notes-ui 本地笔记工作台
（Flask · 127.0.0.1）"] -->|"解析 / 图片归位 / 元数据"| SRC["本地 Markdown 源码
（本仓库）"]
 SRC -->|"hugo 构建（毫秒级）"| BUILD["静态 HTML / CSS / JS"]
 BUILD -->|"tar 打包 + scp 上传 + 原子替换"| SRV["腾讯云服务器
Nginx 托管"]
 SRV -->|"Let's Encrypt HTTPS"| USER["访客
zeseanblog.top"]

技术栈

组件	选择	说明
静态站点生成器	Hugo	单二进制，构建速度极快
主题	Stack	卡片式设计，简洁美观
Web 服务器	Nginx	HTTP/2、gzip、静态资源缓存
HTTPS	Let’s Encrypt	免费证书，certbot 自动续期
部署	自研脚本	构建 → 打包 → 上传 → 原子替换
本地工具	notes-ui（Flask）	笔记上传 / 图片处理 / 分步发布 / 文章管理

配套工具：notes-ui 笔记工作台

写笔记在本地编辑器，发布却要手工做一堆机械活：建目录、拷图片、改路径、拼 front matter、构建、部署、提交。notes-ui 把这条链路做成了只监听本机的 Web 界面：

导入：拖拽 .md 文件或整个笔记文件夹（图片自动带上），也可直接粘贴文本；自动剥离笔记自带的 front matter 并预填表单
图片处理：按正文引用自动匹配、拷入页面包 images/、统一改写路径，缺失的图片列清单可补传
发布流水线：生成页面包 → 构建验证 → 部署上线（二次确认、原子替换可回滚）→ 线上抽查（页面与图片 200 检查）→ git 提交，每步独立日志、可停在中途
文章管理：列出全部文章，支持编辑元数据、草稿开关、改 slug、本地预览（托管 hugo server -D）、删除进回收站
工程细节：零前端框架的原生单页界面；slug 实时查重；分类/标签全站自动补全；发布时间自动与最新文章错开

技术上是一个单文件 Flask 应用（Python 标准库风格，唯一的第三方依赖就是 Flask 本身），通过 subprocess 编排 hugo / 部署脚本 / git，前端为原生 HTML/JS/CSS 单页，无构建步骤。

项目状态

已上线并稳定运行，持续更新学习笔记中；笔记发布日常已通过 notes-ui 完成。

如何更新这个博客

Sat, 15 Mar 2025 11:30:00 +0800

这是一篇备忘录，记录本博客的日常更新流程。现在有两种方式：**本地笔记工作台（推荐）**和手工流程。

1. notes-ui 本地工作台（推荐）

仓库里的 tools/notes-ui/ 是一个只监听本机的 Web 工具，双击 start.bat 启动后浏览器自动打开 http://127.0.0.1:8091 ：

导入笔记：拖拽 .md 文件或整个笔记文件夹（图片会自动带上），也可以直接粘贴文本
检查元数据：标题、描述、分类、标签、发布时间都会自动预填，slug 实时查重；右侧图片清单能看到正文引用的图片是否齐全，缺的可补传
生成页面包：图片自动拷入 images/、正文路径自动改写、front matter 按站内规范生成
本地预览：弹窗内嵌真实主题渲染（含公式和 Mermaid）
分步发布：构建验证 → 部署上线（二次确认）→ 线上抽查 → git 提交，每步独立日志，出问题可停在中途

「文章管理」页还能改历史文章的元数据、切换草稿、改 slug、删除（进本地回收站）。

2. 手工流程（备用）

不用工具时，流程如下。

写新文章

在 content/post/ 目录下新建页面包 my-new-post/index.md（图片放同目录 images/），或单文件 my-new-post.md：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13


---
title: "文章标题"
date: 2025-03-15T11:30:00+08:00
slug: my-new-post
draft: false
description: "文章摘要，会显示在首页卡片上。"
categories:
 - 分类名
tags:
 - 标签
---

正文从这里开始，支持标准 Markdown。

把 draft 设为 true 可以存草稿，构建时不会发布。注意 front matter 的 date 不要写成未来时间，否则 Hugo 默认不构建该文章。

本地预览（可选）

1

hugo server -D

浏览器打开 http://localhost:1313 实时预览，Ctrl+C 退出。

构建并部署

1
2


# 在博客根目录执行一键部署脚本（构建 + 上传 + 原子替换）
bash deploy/deploy.sh

部署完成，访问 https://zeseanblog.top 即可看到新文章。

3. 让 AI 助手代劳

直接说一句「帮我发布新文章」即可——本文件夹的 AGENTS.md 里记录了完整的环境信息和部署流程。

4. 提交代码（备份）

1
2
3


# 只提交这篇 文章 的路径，避免带上工作区其他未完成的改动
git add content/post/my-new-post
git commit -m "post: 新文章标题"

Hugo on Zesean 的博客