From 2c9f4cbf6743db0a1420a51099084845ce3d2765 Mon Sep 17 00:00:00 2001 From: Chen Gu Date: Tue, 10 Mar 2026 00:54:41 +0800 Subject: [PATCH] feat(val-blog): scaffold containerized Hugo dev flow with compose and starter content --- org/cases/val_blog/Dockerfile | 4 + org/cases/val_blog/RUNBOOK.md | 21 + org/cases/val_blog/docker-compose.yml | 9 + org/cases/val_blog/docs/01-charter.md | 191 +++++++++ org/cases/val_blog/docs/02-architecture.md | 377 +++++++++++++++++ .../val_blog/docs/03-content-pipeline.md | 390 ++++++++++++++++++ org/cases/val_blog/docs/04-milestones.md | 209 ++++++++++ org/cases/val_blog/site/assets/css/main.css | 3 + org/cases/val_blog/site/config.toml | 15 + org/cases/val_blog/site/content/_index.md | 11 + .../site/content/journey/first-dream.md | 10 + .../site/layouts/_default/baseof.html | 13 + .../site/layouts/_default/single.html | 7 + org/cases/val_blog/site/layouts/index.html | 9 + org/cases/val_blog/site/static/css/main.css | 3 + 15 files changed, 1272 insertions(+) create mode 100644 org/cases/val_blog/Dockerfile create mode 100644 org/cases/val_blog/RUNBOOK.md create mode 100644 org/cases/val_blog/docker-compose.yml create mode 100644 org/cases/val_blog/docs/01-charter.md create mode 100644 org/cases/val_blog/docs/02-architecture.md create mode 100644 org/cases/val_blog/docs/03-content-pipeline.md create mode 100644 org/cases/val_blog/docs/04-milestones.md create mode 100644 org/cases/val_blog/site/assets/css/main.css create mode 100644 org/cases/val_blog/site/config.toml create mode 100644 org/cases/val_blog/site/content/_index.md create mode 100644 org/cases/val_blog/site/content/journey/first-dream.md create mode 100644 org/cases/val_blog/site/layouts/_default/baseof.html create mode 100644 org/cases/val_blog/site/layouts/_default/single.html create mode 100644 org/cases/val_blog/site/layouts/index.html create mode 100644 org/cases/val_blog/site/static/css/main.css diff --git a/org/cases/val_blog/Dockerfile b/org/cases/val_blog/Dockerfile new file mode 100644 index 0000000..058d775 --- /dev/null +++ b/org/cases/val_blog/Dockerfile @@ -0,0 +1,4 @@ +FROM klakegg/hugo:ext-alpine +WORKDIR /site +EXPOSE 1313 +CMD ["server", "-D", "--bind", "0.0.0.0", "--baseURL", "http://localhost:1313"] diff --git a/org/cases/val_blog/RUNBOOK.md b/org/cases/val_blog/RUNBOOK.md new file mode 100644 index 0000000..c1d1fb9 --- /dev/null +++ b/org/cases/val_blog/RUNBOOK.md @@ -0,0 +1,21 @@ +# Val Blog 容器化开发 Runbook + +## 启动 +```bash +cd org/cases/val_blog +docker compose up -d --build +``` + +## 访问 +- http://localhost:1313 + +## 停止 +```bash +docker compose down +``` + +## 新建旅程文章 +```bash +cd org/cases/val_blog/site +# 手工创建 markdown 到 content/journey/ +``` diff --git a/org/cases/val_blog/docker-compose.yml b/org/cases/val_blog/docker-compose.yml new file mode 100644 index 0000000..79b007a --- /dev/null +++ b/org/cases/val_blog/docker-compose.yml @@ -0,0 +1,9 @@ +services: + val-blog: + build: . + container_name: val-blog-dev + ports: + - "1313:1313" + volumes: + - ./site:/site + command: ["server", "-D", "--bind", "0.0.0.0", "--baseURL", "http://localhost:1313"] diff --git a/org/cases/val_blog/docs/01-charter.md b/org/cases/val_blog/docs/01-charter.md new file mode 100644 index 0000000..2491d4c --- /dev/null +++ b/org/cases/val_blog/docs/01-charter.md @@ -0,0 +1,191 @@ +# 项目章程 | Val's Dreamscape Journal + +## 1. 项目概述 + +**项目名称**: Val's Dreamscape Journal (Val的梦幻旅程志) +**代号**: val-blog +**创建日期**: 2026-03-09 +**版本**: v0.1.0-alpha + +### 1.1 愿景陈述 +打造一个可持续更新的梦幻旅行叙事站点，记录Val的多元宇宙探险——从真实世界的隐秘角落，到异世界的魔法大陆，再到宇宙深处的星际漫游。这是一个关于想象、叙事与数字记忆的长期创作项目。 + +### 1.2 核心目标 + +| 目标层级 | 描述 | 成功指标 | +|---------|------|---------| +| **首要** | 建立Val的个人叙事品牌 | 月度内容发布 ≥4篇，持续6个月 | +| **次要** | 技术栈沉淀（可复用静态站模板） | 开源发布，获得10+ stars | +| **第三** | 构建跨平台内容同步机制 | 支持RSS、Newsletter、社交自动分发 | + +--- + +## 2. 目标受众 + +### 2.1 主要受众画像 + +``` +┌─────────────────────────────────────────────────────────────┐ +│ 探索者型读者 (Explorer) │ +│ ├── 年龄: 22-35岁 │ +│ ├── 兴趣: 科幻、奇幻、旅行、独立游戏、赛博文化 │ +│ ├── 行为: 深度阅读、收藏、分享至小众社区 │ +│ └── 期望: 沉浸式叙事、精美视觉、独特世界观 │ +├─────────────────────────────────────────────────────────────┤ +│ 创作者型读者 (Creator) │ +│ ├── 年龄: 25-40岁 │ +│ ├── 兴趣: 写作、独立开发、数字花园、博客文化 │ +│ ├── 行为: 研究技术实现、参考内容结构、建立双向链接 │ +│ └── 期望: 开源代码、写作方法论、工具链透明 │ +└─────────────────────────────────────────────────────────────┘ +``` + +### 2.2 受众需求矩阵 + +| 需求 | 探索者 | 创作者 | 实现方式 | +|------|-------|-------|---------| +| 沉浸阅读体验 | ★★★★★ | ★★★☆☆ | 夜间模式、优雅排版、图片画廊 | +| 内容可发现性 | ★★★★☆ | ★★★★★ | 标签系统、时间线、全文搜索 | +| 跨设备访问 | ★★★★★ | ★★★★☆ | 响应式设计、PWA支持 | +| 订阅与同步 | ★★★☆☆ | ★★★★★ | RSS、JSON Feed、Newsletter | + +--- + +## 3. 内容支柱 (Content Pillars) + +### 3.1 四大主题领域 + +``` + ┌──────────────────┐ + │ 梦幻旅程志 │ + │ Dreamscape │ + └────────┬─────────┘ + │ + ┌────────────────────┼────────────────────┐ + │ │ │ + ▼ ▼ ▼ +┌───────────────┐ ┌───────────────┐ ┌───────────────┐ +│ 🌍 世界漫游 │ │ 🌌 星际迷航 │ │ 🔮 异世界纪行 │ +│ World Wander │ │ Cosmic Voyage │ │ Otherworlds │ +├───────────────┤ ├───────────────┤ ├───────────────┤ +│ 真实旅行叙事 │ │ 科幻宇宙探索 │ │ 奇幻大陆见闻 │ +│ 城市漫步笔记 │ │ 星际文明观察 │ │ 魔法体系研究 │ +│ 隐秘地点记录 │ │ 深空现象记录 │ │ 种族文化考察 │ +│ 人文观察随笔 │ │ 未来考古报告 │ │ 神话传说演绎 │ +└───────────────┘ └───────────────┘ └───────────────┘ + │ + ▼ + ┌───────────────┐ + │ 🎭 思绪碎片 │ + │ Mind Fragments│ + ├───────────────┤ + │ 创作方法论 │ + │ 工具与流程 │ + │ 灵感记录 │ + └───────────────┘ +``` + +### 3.2 内容类型定义 + +| 类型 | 频率 | 长度 | 示例 | +|------|------|------|------| +| **旅程记录 (Journey)** | 每周1-2篇 | 1500-3000字 | 完整的探险叙事，含路线、见闻、感悟 | +| **速记 (Sketch)** | 每周2-3篇 | 300-800字 | 片段式记录、灵感闪现、场景速写 | +| **图志 (Gallery)** | 每月2-3篇 | 图文为主 | 摄影集、概念艺术、地图绘制 | +| **深度文 (Essay)** | 每月1篇 | 3000-5000字 | 世界观构建、方法论、专题研究 | + +--- + +## 4. 风格指南 + +### 4.1 品牌调性 + +- **核心气质**: 冷静、神秘、知性、略带疏离感 +- **叙事视角**: 第一人称，观察者而非参与者 +- **语言风格**: 简洁优美，避免过度修饰，善用隐喻 +- **情感温度**: 克制中蕴含温度，理性与诗意并存 + +### 4.2 视觉风格 + +```yaml +colors: + primary: "#2D3E50" # 深空蓝 - 主色调 + accent: "#C9A961" # 古铜金 - 强调色 + background_light: "#F7F5F0" # 羊皮纸白 + background_dark: "#1A1F2B" # 深夜蓝 + text_light: "#3D3D3D" # 墨黑 + text_dark: "#D4D4D4" # 月白 + +typography: + heading: "Noto Serif SC" # 中文标题 + body: "Noto Sans SC" # 中文正文 + code: "JetBrains Mono" # 代码/元数据 + english: "Source Serif 4" # 英文装饰 + +mood_keywords: + - 雾气弥漫的清晨 + - 古老图书馆的尘埃 + - 星舰观察舱的寂静 + - 魔法水晶的微弱光芒 + - 雨后台阶上的青苔 +``` + +### 4.3 写作原则 + +1. **开场法则**: 首句必须建立场景或情绪，避免寒暄 +2. **节奏控制**: 长短句交替，关键段落使用单句成段 +3. **感官优先**: 视觉 > 听觉 > 触觉 > 嗅觉 > 味觉 +4. **留白艺术**: 不解释一切，让读者自行填补 + +--- + +## 5. 风险与边界 + +### 5.1 风险矩阵 + +| 风险 | 可能性 | 影响 | 缓解策略 | +|------|-------|------|---------| +| 内容断更 | 中 | 高 | 建立内容缓冲池(≥4篇待发)，设置最低发布频率(月≥2) | +| 技术债务累积 | 中 | 中 | 坚持静态优先，避免过度工程，定期重构 | +| 创意枯竭 | 低 | 高 | 建立灵感收集系统，允许跨界/轻松内容 | +| 性能下降 | 低 | 中 | 图片懒加载、CDN、构建优化 | +| 数据丢失 | 低 | 高 | Git版本控制、定期备份、云端同步 | + +### 5.2 项目边界 + +**In Scope:** +- 静态博客站点开发与维护 +- 内容创作与发布流程 +- 基础SEO与社交分享 +- RSS/Feed订阅支持 + +**Out of Scope:** +- 用户评论系统（初期使用第三方如Giscus） +- 商业化功能（付费墙、广告） +- 复杂CMS后端 +- 实时协作功能 +- 多语言完整翻译（初期仅中文） + +**技术约束:** +- 优先使用成熟技术，避免实验性方案 +- 构建时间 < 2分钟 +- 首屏加载 < 1.5秒 +- 核心功能无需JavaScript亦可访问 + +--- + +## 6. 项目干系人 + +| 角色 | 姓名/代号 | 职责 | +|------|----------|------| +| 产品负责人 | 谷老板 | 战略方向、最终决策 | +| 执行负责人 | Val | 日常执行、内容创作、技术实现 | +| 技术顾问 | OpenClaw Agent Team | 技术选型、代码审查、运维支持 | + +--- + +## 7. 变更记录 + +| 版本 | 日期 | 变更内容 | 作者 | +|------|------|---------|------| +| v0.1.0 | 2026-03-09 | 初稿创建 | Val | diff --git a/org/cases/val_blog/docs/02-architecture.md b/org/cases/val_blog/docs/02-architecture.md new file mode 100644 index 0000000..e23af0e --- /dev/null +++ b/org/cases/val_blog/docs/02-architecture.md @@ -0,0 +1,377 @@ +# 技术选型与架构方案 + +## 1. 决策概览 + +### 1.1 技术栈选型 + +| 层级 | 技术选择 | 备选方案 | 决策理由 | +|------|---------|---------|---------| +| **静态生成器** | Hugo | Zola, Astro | 极速构建、成熟生态、Go模板 | +| **主题框架** | 自定义 | PaperMod, Stack | 完全可控、符合品牌调性 | +| **样式方案** | Tailwind CSS + 自定义CSS | SCSS/BEM | 原子化优先、暗色模式友好 | +| **搜索** | Fuse.js (客户端) | Pagefind, Algolia | 零后端、轻量、隐私优先 | +| **部署** | GitHub Pages + GitHub Actions | Vercel, Netlify | 简单免费、版本联动 | +| **CMS(可选)** | 本地Markdown | Decap CMS | 纯文本优先、Git版本控制 | + +### 1.2 架构原则 + +``` +┌─────────────────────────────────────────────────────────────┐ +│ 架构决策原则 │ +├─────────────────────────────────────────────────────────────┤ +│ 1. 静态优先 → 零运行时依赖，最大可靠性 │ +│ 2. 渐进增强 → 核心内容无JS亦可访问 │ +│ 3. 内容即数据 → Frontmatter驱动，结构化优先 │ +│ 4. 工具链极简 → 单一二进制(Hugo)，减少依赖 │ +│ 5. 版本控制 → Git为中心，内容+代码统一 │ +└─────────────────────────────────────────────────────────────┘ +``` + +--- + +## 2. 系统架构 + +### 2.1 整体架构图 + +``` +┌─────────────────────────────────────────────────────────────────────┐ +│ 内容生产层 (Content Layer) │ +│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │ +│ │ Markdown │ │ Frontmatter │ │ Assets │ │ +│ │ 正文 │ │ 元数据 │ │ 图片/附件 │ │ +│ └──────┬───────┘ └──────┬───────┘ └──────┬───────┘ │ +└─────────┼─────────────────┼─────────────────┼──────────────────────┘ + │ │ │ + └─────────────────┼─────────────────┘ + ▼ +┌─────────────────────────────────────────────────────────────────────┐ +│ 构建层 (Build Layer) │ +│ ┌───────────────────────────────────────────────────────────────┐ │ +│ │ Hugo Static Generator │ │ +│ │ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │ │ +│ │ │ 内容解析 │→ │ 模板渲染 │→ │ 搜索索引 │→ │ 资源优化 │ │ │ +│ │ └──────────┘ └──────────┘ └──────────┘ └──────────┘ │ │ +│ └───────────────────────────────────────────────────────────────┘ │ +└─────────────────────────────────┬───────────────────────────────────┘ + │ + ▼ +┌─────────────────────────────────────────────────────────────────────┐ +│ 输出层 (Output Layer) │ +│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │ +│ │ HTML │ │ CSS/JS │ │ Images │ │ RSS/JSON│ │ +│ │ 页面 │ │ 样式 │ │ 资源 │ │ Feed │ │ +│ └────┬─────┘ └──────────┘ └──────────┘ └──────────┘ │ +└───────┼─────────────────────────────────────────────────────────────┘ + │ + ▼ +┌─────────────────────────────────────────────────────────────────────┐ +│ 部署层 (Deploy Layer) │ +│ ┌───────────────────────────────────────────────────────────────┐ │ +│ │ GitHub Pages (CDN + HTTPS) │ │ +│ └───────────────────────────────────────────────────────────────┘ │ +└─────────────────────────────────────────────────────────────────────┘ +``` + +### 2.2 项目目录结构 + +``` +val-blog/ +├── archetypes/ # 内容模板 +│ ├── journey.md # 旅程记录模板 +│ ├── sketch.md # 速记模板 +│ ├── gallery.md # 图志模板 +│ └── essay.md # 深度文模板 +├── assets/ # 需处理的资源 +│ ├── css/ +│ │ ├── main.css # 主样式 +│ │ ├── dark.css # 暗色模式 +│ │ └── components/ # 组件样式 +│ ├── js/ +│ │ ├── search.js # 搜索功能 +│ │ ├── theme.js # 主题切换 +│ │ └── gallery.js # 图片画廊 +│ └── images/ +│ └── logo.svg +├── config.toml # 站点配置 +├── content/ # 内容目录 +│ ├── _index.md # 首页 +│ ├── about.md # 关于页面 +│ ├── journey/ # 旅程记录 +│ ├── sketch/ # 速记 +│ ├── gallery/ # 图志 +│ ├── essay/ # 深度文 +│ └── series/ # 系列文章 +├── data/ # 数据文件 +│ └── navigation.yaml +├── layouts/ # 模板 +│ ├── _default/ +│ │ ├── baseof.html # 基础模板 +│ │ ├── list.html # 列表页 +│ │ └── single.html # 单页 +│ ├── index.html # 首页模板 +│ ├── partials/ # 模板片段 +│ │ ├── head.html +│ │ ├── header.html +│ │ ├── footer.html +│ │ ├── navigation.html +│ │ ├── search.html +│ │ ├── theme-toggle.html +│ │ └── pagination.html +│ └── shortcodes/ # 短代码 +│ ├── gallery.html +│ ├── timeline.html +│ └── map.html +├── static/ # 静态文件 +│ ├── fonts/ +│ ├── images/ +│ ├── favicon.ico +│ └── robots.txt +└── themes/ # 主题目录（如使用子主题） +``` + +--- + +## 3. 功能模块设计 + +### 3.1 功能矩阵 + +| 功能 | 优先级 | 技术方案 | 状态 | +|------|-------|---------|------| +| 响应式布局 | P0 | Tailwind CSS | 待实现 | +| 暗色模式 | P0 | CSS变量 + localStorage | 待实现 | +| 中文排版优化 | P0 | typo.css + 自定义 | 待实现 | +| 全文搜索 | P0 | Fuse.js + 索引构建 | 待实现 | +| 标签系统 | P0 | Hugo Taxonomies | 待实现 | +| 时间线视图 | P0 | 自定义模板 | 待实现 | +| RSS/Atom | P0 | Hugo内置 | 待实现 | +| JSON Feed | P1 | 自定义模板 | 待实现 | +| 图片画廊 | P1 | 轻量JS + CSS Grid | 待实现 | +| 文章系列 | P1 | Hugo Sections | 待实现 | +| 阅读时间 | P1 | Hugo内置/自定义 | 待实现 | +| 目录导航 | P1 | 自动生成TOC | 待实现 | +| 相关文章 | P2 | 标签匹配 | 待实现 | +| 阅读进度 | P2 | CSS/JS | 待实现 | +| 代码高亮 | P2 | Prism.js/Chroma | 待实现 | +| PWA支持 | P2 | Service Worker | 待实现 | +| 评论系统 | P3 | Giscus(Utterances) | 待实现 | +| Newsletter | P3 | 第三方服务 | 待实现 | + +### 3.2 暗色模式实现 + +```css +/* CSS变量定义 */ +:root { + /* 浅色模式 */ + --bg-primary: #F7F5F0; + --bg-secondary: #FFFFFF; + --text-primary: #2D3E50; + --text-secondary: #5A6A7A; + --accent: #C9A961; + --border: #E5E1D8; +} + +[data-theme="dark"] { + /* 暗色模式 */ + --bg-primary: #1A1F2B; + --bg-secondary: #232936; + --text-primary: #D4D4D4; + --text-secondary: #8A94A6; + --accent: #D4B86A; + --border: #3A4150; +} + +/* 系统偏好检测 */ +@media (prefers-color-scheme: dark) { + :root:not([data-theme]) { + /* 暗色变量 */ + } +} +``` + +### 3.3 搜索架构 + +``` +┌──────────────────────────────────────────────────────┐ +│ 搜索实现方案 │ +├──────────────────────────────────────────────────────┤ +│ 构建时: │ +│ └── Hugo模板生成 search-index.json │ +│ ├── title │ +│ ├── content (摘要) │ +│ ├── tags │ +│ ├── date │ +│ └── permalink │ +│ │ +│ 运行时: │ +│ ├── 页面加载时异步获取 search-index.json │ +│ ├── Fuse.js 初始化索引 │ +│ ├── 输入时实时搜索 │ +│ └── 结果渲染 (标题+摘要+高亮) │ +│ │ +│ 优化: │ +│ ├── 索引分片 (按年份/类型) │ +│ ├── 防抖 (300ms) │ +│ └── 缓存至 sessionStorage │ +└──────────────────────────────────────────────────────┘ +``` + +--- + +## 4. 内容模型 + +### 4.1 Frontmatter规范 + +```yaml +--- +# 基础信息 +标题相关 +title: "文章标题" +subtitle: "副标题（可选）" + +# 分类与标签 +categories: ["journey"] # journey/sketch/gallery/essay +tags: ["异世界", "魔法森林", "水晶洞穴"] +series: "魔法大陆纪行" # 系列名称（可选） +series_order: 1 # 系列中的顺序 + +# 时间与状态 +date: 2026-03-09T21:00:00+08:00 +lastmod: 2026-03-09T22:30:00+08:00 +draft: false +featured: false # 是否精选 + +# 元数据 +author: "Val" +location: "翡翠森林·北境" # 故事发生地 +world: "Aethoria" # 世界观/宇宙名称 + +# 媒体 +cover: + image: "/images/covers/forest-crystal.jpg" + alt: "水晶洞穴内部" + caption: "微弱的蓝光来自洞顶的水晶" + +gallery: # 图志专用 + - src: "/images/gallery/forest-01.jpg" + alt: "森林入口" + - src: "/images/gallery/forest-02.jpg" + alt: "水晶洞穴" + +# SEO +description: "在翡翠森林深处发现的水晶洞穴" +keywords: ["奇幻", "探险", "水晶洞穴"] + +# 交互 +comments: true +toc: true # 是否显示目录 +reading_time: true # 是否显示阅读时间 +--- +``` + +### 4.2 内容类型定义 + +| 类型 | 目录 | 模板 | 特殊字段 | +|------|------|------|---------| +| 旅程记录 | `/journey/` | `journey/single.html` | location, route, timeline | +| 速记 | `/sketch/` | `sketch/single.html` | mood, weather, time_of_day | +| 图志 | `/gallery/` | `gallery/single.html` | gallery[], location | +| 深度文 | `/essay/` | `essay/single.html` | abstract, references | + +--- + +## 5. 部署方案 + +### 5.1 GitHub Actions工作流 + +```yaml +# .github/workflows/deploy.yml +name: Deploy to GitHub Pages + +on: + push: + branches: [main] + workflow_dispatch: + +permissions: + contents: read + pages: write + id-token: write + +concurrency: + group: "pages" + cancel-in-progress: true + +jobs: + build: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v4 + with: + submodules: true + + - name: Setup Hugo + uses: peaceiris/actions-hugo@v2 + with: + hugo-version: '0.123.0' + extended: true + + - name: Build + run: hugo --minify + + - name: Upload artifact + uses: actions/upload-pages-artifact@v3 + with: + path: ./public + + deploy: + needs: build + runs-on: ubuntu-latest + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + steps: + - name: Deploy + id: deployment + uses: actions/deploy-pages@v4 +``` + +### 5.2 本地开发流程 + +```bash +# 1. 安装Hugo (macOS) +brew install hugo + +# 2. 克隆项目 +git clone val-blog +cd val-blog + +# 3. 启动开发服务器 +hugo server -D --bind 0.0.0.0 + +# 4. 创建新内容 +hugo new content journey/2026/crystal-cave.md + +# 5. 构建 (生产) +hugo --minify +``` + +--- + +## 6. 性能预算 + +| 指标 | 目标 | 最大允许 | +|------|------|---------| +| 首屏加载时间 | < 1.0s | 1.5s | +| 可交互时间 | < 1.5s | 2.0s | +| 首页总大小 | < 200KB | 300KB | +| 单页总大小 | < 150KB | 250KB | +| 搜索索引 | < 500KB | 1MB | +| Lighthouse分数 | > 90 | 80 | + +--- + +## 7. 变更记录 + +| 版本 | 日期 | 变更内容 | 作者 | +|------|------|---------|------| +| v0.1.0 | 2026-03-09 | 初稿创建 | Val | diff --git a/org/cases/val_blog/docs/03-content-pipeline.md b/org/cases/val_blog/docs/03-content-pipeline.md new file mode 100644 index 0000000..b3eda04 --- /dev/null +++ b/org/cases/val_blog/docs/03-content-pipeline.md @@ -0,0 +1,390 @@ +# 每日梦幻旅程记录 - 内容流水线设计 + +## 1. 内容流水线概览 + +``` +┌─────────────────────────────────────────────────────────────────────┐ +│ 内容创作流水线 │ +├─────────────────────────────────────────────────────────────────────┤ +│ │ +│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │ +│ │ 灵感捕捉 │ → │ 草稿创作 │ → │ 审核润色 │ → │ 发布归档 │ │ +│ │ Capture │ │ Draft │ │ Review │ │ Publish │ │ +│ └──────────┘ └──────────┘ └──────────┘ └──────────┘ │ +│ ↓ ↓ ↓ ↓ │ +│ Obsidian/ VS Code + Self/Peer Hugo Build + │ +│ 备忘录 Markdown Review Git Push │ +│ │ +└─────────────────────────────────────────────────────────────────────┘ +``` + +--- + +## 2. 内容类型与发布节奏 + +### 2.1 发布节奏表 + +| 内容类型 | 频率 | 最佳发布时间 | 字数范围 | 准备周期 | +|---------|------|-------------|---------|---------| +| **速记 (Sketch)** | 每周 2-3 篇 | 晚间 21:00-23:00 | 300-800 | 即时-1天 | +| **旅程记录 (Journey)** | 每周 1-2 篇 | 周末上午 10:00 | 1500-3000 | 2-3天 | +| **图志 (Gallery)** | 每两周 1 篇 | 周末下午 15:00 | 图文为主 | 3-5天 | +| **深度文 (Essay)** | 每月 1-2 篇 | 月初/月中 20:00 | 3000-5000 | 1-2周 | + +### 2.2 内容日历模板 + +```yaml +# content-calendar.yaml +weekly_quota: + minimum: 2 # 每周最少发布 + target: 4 # 每周目标发布 + maximum: 6 # 每周最多发布（避免过度） + +publishing_windows: + weekday_evening: + time: "21:00-23:00" + types: [sketch] + description: "适合轻松的速记、灵感片段" + + weekend_morning: + time: "10:00-12:00" + types: [journey] + description: "适合完整的旅程叙事" + + weekend_afternoon: + time: "15:00-17:00" + types: [gallery] + description: "适合视觉为主的内容" + + special_slot: + time: "每月第一个周日 20:00" + types: [essay] + description: "深度长文的专属时段" + +content_buffer: + target: 4 # 保持4篇待发缓冲 + minimum: 2 # 低于此数量时预警 +``` + +--- + +## 3. 内容模板库 + +### 3.1 速记模板 (Sketch) + +```markdown +--- +title: "标题 - 简短有力，捕捉瞬间" +date: 2026-03-09T21:00:00+08:00 +categories: ["sketch"] +tags: ["标签1", "标签2"] +mood: "平静|兴奋| melancholic | 神秘" +weather: "雾|雨|晴|雪|未知" +time_of_day: "黎明|正午|黄昏|深夜" +location: "地点名称" +world: "世界观名称" +description: "一句话描述" +--- + + + +首句建立场景... + +中间段落展开... + +结尾留白... +``` + +### 3.2 旅程记录模板 (Journey) + +```markdown +--- +title: "旅程标题" +date: 2026-03-09T10:00:00+08:00 +categories: ["journey"] +tags: ["标签1", "标签2", "标签3"] +series: "系列名称（如适用）" +series_order: 1 +location: "具体地点" +world: "世界观名称" +cover: + image: "/images/covers/xxx.jpg" + alt: "图片替代文字" + caption: "图片说明" +description: "旅程简介，用于列表展示" +toc: true +reading_time: true +--- + +## 旅程起点 + +描述出发的地点、时间、初始状态。建立读者对旅程的期待。 + +## 路线与见闻 + +### 第一段路程 + +详细记录沿途的发现。使用感官描写： +- **视觉**：颜色、形状、光影 +- **听觉**：声音、寂静、回声 +- **触觉**：温度、质地、湿度 +- **嗅觉/味觉**：如有 + +### 关键地点名称 + +深入描写重要地点... + +## 关键发现 + +旅程中的重要发现、遇见的人或事物、特殊事件。 + +## 感悟与反思 + +旅程带来的思考、情绪变化、对未来的影响。 + +## 实用信息 + +- **位置坐标**: +- **建议路线**: +- **注意事项**: +- **最佳时间**: +``` + +### 3.3 图志模板 (Gallery) + +```markdown +--- +title: "图志标题" +date: 2026-03-09T15:00:00+08:00 +categories: ["gallery"] +tags: ["标签1", "标签2"] +location: "拍摄地点" +world: "世界观" +description: "图志简介" +--- + +图志的开篇文字，交代背景、氛围、拍摄动机。 + +{{< gallery >}} + {{< image + src="/images/gallery/xxx-01.jpg" + alt="图片描述" + caption="详细说明，可包含地点、时间、感受" + >}} + {{< image + src="/images/gallery/xxx-02.jpg" + alt="图片描述" + caption="说明文字" + >}} +{{< /gallery >}} + +图志结尾，总结或留下思考。 +``` + +### 3.4 深度文模板 (Essay) + +```markdown +--- +title: "文章标题" +date: 2026-03-09T20:00:00+08:00 +categories: ["essay"] +tags: ["标签1", "标签2", "标签3", "标签4"] +series: "系列名称（如适用）" +series_order: 1 +abstract: "摘要，200字以内概括核心观点" +description: "文章简介" +toc: true +reading_time: true +--- + +## 引言 + +引人入胜的开篇。可以是一个场景、一个问题、一个观察。 + +## 正文第一部分 + +展开论述... + +### 子主题 + +深入分析... + +## 正文第二部分 + +继续展开... + +## 案例/故事 + +具体的例子来支撑观点... + +## 结论 + +总结核心观点，留下余韵。 + +## 参考与延伸 + +- 相关阅读链接 +- 推荐资源 +- 延伸阅读 +``` + +--- + +## 4. 灵感收集系统 + +### 4.1 灵感来源矩阵 + +| 来源类型 | 示例 | 收集方式 | 转化周期 | +|---------|------|---------|---------| +| **真实旅行** | 城市漫步、自然风光、建筑 | 手机速记+照片 | 1-3天 | +| **阅读观影** | 小说、纪录片、独立游戏 | 摘录+感想 | 即时记录 | +| **梦境** | 夜间梦境片段 | 醒来立即记录 | 当天整理 | +| **随机联想** | 两个概念的意外连接 | 闪念笔记 | 适时扩展 | +| **他人对话** | 有趣的谈话、观点 | 简要记录 | 评估后使用 | + +### 4.2 灵感收集工具链 + +``` +灵感捕捉流程： + +1. 移动端 (随时) + └── Apple Notes / Obsidian Mobile + ├── 语音速记 + ├── 拍照+备注 + └── 链接收藏 + +2. 桌面端 (整理) + └── Obsidian Vault + ├── Daily Notes (每日灵感) + ├── Maps of Content (主题索引) + └── Literature Notes (阅读笔记) + +3. 转化 (创作) + └── VS Code + Markdown + ├── 从灵感笔记扩展 + ├── 套用内容模板 + └── 使用 hugo new 命令创建 +``` + +--- + +## 5. 发布流程 + +### 5.1 发布检查清单 + +```markdown +## 发布前检查 + +### 内容检查 +- [ ] 标题简洁有力，无错别字 +- [ ] 摘要/description 已填写 +- [ ] 标签选择恰当（2-5个） +- [ ] 分类正确 +- [ ] 日期时间正确 + +### 格式检查 +- [ ] Markdown 语法正确 +- [ ] 图片已压缩优化 +- [ ] 图片 alt 文字已填写 +- [ ] 链接可正常访问 + +### 元数据检查 +- [ ] location 字段（如适用） +- [ ] world 字段（如适用） +- [ ] series 信息完整（如适用） + +### 技术检查 +- [ ] hugo server 本地预览正常 +- [ ] 暗色模式显示正常 +- [ ] 移动端显示正常 +- [ ] 无控制台报错 +``` + +### 5.2 自动化发布脚本 + +```bash +#!/bin/bash +# scripts/publish.sh + +set -e + +echo "🚀 开始发布流程..." + +# 1. 拉取最新更改 +echo "📥 同步远程仓库..." +git pull origin main + +# 2. 构建站点 +echo "🔨 构建站点..." +hugo --minify + +# 3. 本地预览检查（可选） +if [ "$1" = "preview" ]; then + echo "👁️ 启动预览服务器..." + hugo server -D + exit 0 +fi + +# 4. 提交更改 +echo "💾 提交更改..." +git add . +git commit -m "publish: $(date '+%Y-%m-%d %H:%M') 发布新内容" + +# 5. 推送到远程 +echo "📤 推送到远程仓库..." +git push origin main + +echo "✅ 发布完成！GitHub Actions 将自动部署。" +``` + +--- + +## 6. 内容存档与版本控制 + +### 6.1 Git工作流 + +``` +main 分支 (受保护) + │ + ├── 所有已发布内容 + ├── 触发 GitHub Actions 自动部署 + └── 仅通过 PR 或本地合并更新 + +content/drafts 分支 (可选) + │ + ├── 未完成草稿 + ├── 待审核内容 + └── 完成后合并到 main +``` + +### 6.2 提交信息规范 + +``` +格式: : + +类型: +- content: 新内容发布 +- edit: 内容修改 +- fix: 错误修复 +- style: 样式调整 +- chore: 配置/工具更新 + +示例: +content: 2026-03-09 水晶洞穴探险记 +edit: 修正旅程记录中的日期错误 +style: 调整暗色模式下代码块颜色 +``` + +--- + +## 7. 变更记录 + +| 版本 | 日期 | 变更内容 | 作者 | +|------|------|---------|------| +| v0.1.0 | 2026-03-09 | 初稿创建 | Val | diff --git a/org/cases/val_blog/docs/04-milestones.md b/org/cases/val_blog/docs/04-milestones.md new file mode 100644 index 0000000..22fe1fa --- /dev/null +++ b/org/cases/val_blog/docs/04-milestones.md @@ -0,0 +1,209 @@ +# 里程碑计划 (M1-M4) + +## 项目路线图概览 + +``` +2026年3月 ──────────────────────────────────────────────► 2026年6月 + │ │ │ │ │ + ▼ ▼ ▼ ▼ ▼ + M0:准备 M1:基础 M2:完善 M3:扩展 M4:运营 + 当前阶段 3月内完成 4月内完成 5月内完成 6月起 +``` + +--- + +## M1: 基础构建 (3月) - 当前阶段 + +### 目标 +搭建可运行的静态站点基础，完成核心页面与基础样式，实现本地开发与预览。 + +### 交付物 + +| # | 交付物 | 描述 | 状态 | +|---|-------|------|------| +| 1.1 | 项目章程 | 目标、受众、内容支柱、风格指南 | ✅ 已完成 | +| 1.2 | 技术架构文档 | 技术栈、目录结构、部署方案 | ✅ 已完成 | +| 1.3 | Hugo站点骨架 | 完整项目结构、配置文件 | ✅ 已完成 | +| 1.4 | 基础模板系统 | 首页、列表页、单页模板 | ✅ 已完成 | +| 1.5 | 样式系统 | Tailwind CSS + 自定义CSS变量 | ✅ 已完成 | +| 1.6 | 暗色模式 | CSS变量 + localStorage持久化 | ✅ 已完成 | +| 1.7 | 搜索功能 | Fuse.js 客户端搜索 + 索引 | ✅ 已完成 | +| 1.8 | 内容流水线文档 | 模板、发布节奏、工作流程 | ✅ 已完成 | +| 1.9 | 里程碑计划 | M1-M4详细规划 | 🔄 进行中 | +| 1.10 | 本地运行验证 | hugo server 正常预览 | ⏳ 待验证 | +| 1.11 | 示例内容 | 每类内容至少1篇示例 | ⏳ 待创建 | + +### M1 验收标准 + +```yaml +必须通过: + - hugo server 启动无错误 + - 首页、列表页、单页正常显示 + - 暗色/亮色模式可切换且持久化 + - 搜索功能可检索并显示结果 + - 移动端响应式正常 + - Lighthouse Performance > 80 + +建议达成: + - Lighthouse Accessibility > 90 + - 首屏加载 < 1.5s (本地) + - 构建时间 < 10s +``` + +--- + +## M2: 功能完善 (4月) + +### 目标 +完善核心功能体验，优化视觉细节，建立内容发布的标准流程。 + +### 交付物 + +| # | 交付物 | 描述 | 优先级 | +|---|-------|------|--------| +| 2.1 | 中文排版优化 | 标点挤压、行距、段落间距 | P0 | +| 2.2 | 图片画廊短代码 | 响应式网格 + 灯箱效果 | P0 | +| 2.3 | 目录导航 (TOC) | 自动生成 + 平滑滚动 | P0 | +| 2.4 | RSS/Atom Feed | 按分类分feed | P0 | +| 2.5 | 标签云页面 | 所有标签的可视化展示 | P1 | +| 2.6 | 时间线页面 | 按时间顺序展示所有内容 | P1 | +| 2.7 | 阅读进度条 | 文章页面滚动指示 | P1 | +| 2.8 | 相关文章推荐 | 基于标签匹配 | P1 | +| 2.9 | 代码高亮优化 | Prism.js 或 Chroma 主题 | P2 | +| 2.10 | 404页面 | 自定义错误页面 | P2 | +| 2.11 | SEO优化 | meta标签、sitemap、robots | P1 | +| 2.12 | 内容发布SOP | 详细的操作流程文档 | P1 | +| 2.13 | 3篇真实内容 | 各类型内容正式首发 | P0 | + +### M2 验收标准 + +```yaml +必须通过: + - 所有M1功能保持正常 + - 图片画廊在移动端体验良好 + - TOC自动提取且锚点跳转正常 + - RSS通过验证器检查 + - 3篇以上内容正式发布 + +建议达成: + - Lighthouse 全项 > 90 + - 首次真实读者反馈收集 +``` + +--- + +## M3: 部署与扩展 (5月) + +### 目标 +完成生产环境部署，建立自动化发布流程，添加进阶功能。 + +### 交付物 + +| # | 交付物 | 描述 | 优先级 | +|---|-------|------|--------| +| 3.1 | GitHub Pages部署 | 正式域名上线 | P0 | +| 3.2 | GitHub Actions工作流 | 自动构建+部署 | P0 | +| 3.3 | 自定义域名 | 配置个人域名 | P1 | +| 3.4 | CDN配置 | 资源加速 | P1 | +| 3.5 | PWA支持 | Service Worker + Manifest | P2 | +| 3.6 | 评论系统 | Giscus (GitHub Discussions) | P2 | +| 3.7 | 文章系列功能 | 系列导航、进度指示 | P1 | +| 3.8 | 统计分析 | 轻量级访问统计 (umami/Plausible) | P2 | +| 3.9 | 内容备份策略 | 定期备份脚本 | P1 | +| 3.10 | Newsletter准备 | 邮件订阅功能调研 | P3 | +| 3.11 | 10篇以上内容 | 建立内容库 | P0 | +| 3.12 | 社交媒体集成 | Open Graph优化、分享卡片 | P1 | + +### M3 验收标准 + +```yaml +必须通过: + - 站点通过自定义域名可访问 + - Git push 自动触发部署 + - 部署失败时收到通知 + - 10篇以上内容在线 + - 移动端体验优秀 + +建议达成: + - Core Web Vitals 全部通过 + - 搜索引擎收录正常 + - 首次外部链接/分享 +``` + +--- + +## M4: 运营优化 (6月起) + +### 目标 +进入稳定运营期，建立持续更新的节奏，根据反馈迭代优化。 + +### 交付物 + +| # | 交付物 | 描述 | 优先级 | +|---|-------|------|--------| +| 4.1 | 内容日历执行 | 稳定的内容发布节奏 | P0 | +| 4.2 | Newsletter启动 | 邮件订阅功能上线（如有需求）| P2 | +| 4.3 | 性能监控 | 定期性能检查与优化 | P1 | +| 4.4 | 内容迭代 | 根据反馈优化旧内容 | P2 | +| 4.5 | 主题开源 | 代码开源发布 | P3 | +| 4.6 | 多设备访问 | Tailscale/OpenClaw 多端访问 | P2 | +| 4.7 | 20篇以上内容 | 形成完整内容矩阵 | P0 | +| 4.8 | 读者互动机制 | 评论回复、反馈收集 | P2 | +| 4.9 | 年度回顾 | 内容总结与下年规划 | P2 | +| 4.10 | 备份自动化 | 全站定期自动备份 | P1 | + +### M4 验收标准 + +```yaml +必须通过: + - 月度发布 >=4 篇内容 + - 站点稳定运行无中断 + - 内容库可追溯、可检索 + - 备份机制正常运行 + +建议达成: + - 建立固定读者群体 + - 获得正面反馈/分享 + - 技术栈文档化可复用 +``` + +--- + +## 风险与缓冲 + +### 风险应对 + +| 风险 | 影响 | 应对策略 | +|------|------|---------| +| M2功能延期 | 部署推迟 | 区分P0/P1/P2，P2可移至M3 | +| 内容创作瓶颈 | 站点空转 | 建立灵感库，允许跨界内容 | +| 技术问题 | 部署受阻 | 保持本地开发能力，不依赖特定平台 | +| 时间不足 | 进度落后 | 每月预留1周缓冲期 | + +### 里程碑检查点 + +```yaml +M1检查点: 3月15日 + - 确认M1所有P0完成 + - 决定M2功能范围 + +M2检查点: 4月15日 + - 确认功能完善度 + - 准备M3部署计划 + +M3检查点: 5月15日 + - 确认部署成功 + - 评估M4需求调整 + +M4检查点: 每月末 + - 内容发布统计 + - 技术债务检查 +``` + +--- + +## 变更记录 + +| 版本 | 日期 | 变更内容 | 作者 | +|------|------|---------|------| +| v0.1.0 | 2026-03-09 | 初稿创建 | Val | diff --git a/org/cases/val_blog/site/assets/css/main.css b/org/cases/val_blog/site/assets/css/main.css new file mode 100644 index 0000000..1464b7b --- /dev/null +++ b/org/cases/val_blog/site/assets/css/main.css @@ -0,0 +1,3 @@ +body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;max-width:780px;margin:2rem auto;padding:0 1rem;line-height:1.8;background:#0f1220;color:#e8ebff} +a{color:#9bc1ff;text-decoration:none}a:hover{text-decoration:underline} +header h1{font-size:1.5rem} h2{margin-top:2rem} diff --git a/org/cases/val_blog/site/config.toml b/org/cases/val_blog/site/config.toml new file mode 100644 index 0000000..3010380 --- /dev/null +++ b/org/cases/val_blog/site/config.toml @@ -0,0 +1,15 @@ +baseURL = "http://localhost:1313/" +languageCode = "zh-cn" +title = "Val 的梦旅手记" +theme = "" + +[params] + author = "Val" + description = "记录世界旅行、异世界探险与宇宙遨游的梦幻见闻" + +[taxonomies] + tag = "tags" + category = "categories" + +[outputs] + home = ["HTML", "RSS", "JSON"] diff --git a/org/cases/val_blog/site/content/_index.md b/org/cases/val_blog/site/content/_index.md new file mode 100644 index 0000000..a897445 --- /dev/null +++ b/org/cases/val_blog/site/content/_index.md @@ -0,0 +1,11 @@ +--- +title: "欢迎来到 Val 的梦旅手记" +date: 2026-03-10T00:55:00+08:00 +--- + +这里是 Val 的个人 Blog： +- 去世界尽头看海 +- 去异世界与龙对话 +- 在银河轨道写下夜航日志 + +愿每一篇都像一扇门，推开就能出发。 diff --git a/org/cases/val_blog/site/content/journey/first-dream.md b/org/cases/val_blog/site/content/journey/first-dream.md new file mode 100644 index 0000000..77ca36e --- /dev/null +++ b/org/cases/val_blog/site/content/journey/first-dream.md @@ -0,0 +1,10 @@ +--- +title: "第一夜：在月光海岸捡到一枚会发光的罗盘" +date: 2026-03-10T00:56:00+08:00 +categories: ["journey"] +tags: ["梦旅", "海岸", "罗盘"] +draft: false +--- + +今晚的海风很轻，星光像碎银落在浪尖。 +我在礁石边捡到一枚发光罗盘，它指向的不是北方，而是“下一段奇遇”。 diff --git a/org/cases/val_blog/site/layouts/_default/baseof.html b/org/cases/val_blog/site/layouts/_default/baseof.html new file mode 100644 index 0000000..4608ce3 --- /dev/null +++ b/org/cases/val_blog/site/layouts/_default/baseof.html @@ -0,0 +1,13 @@ + + + + + + {{ if .Title }}{{ .Title }} · {{ end }}{{ .Site.Title }} + + + +

{{ .Site.Title }}

+
{{ block "main" . }}{{ end }}
+ + diff --git a/org/cases/val_blog/site/layouts/_default/single.html b/org/cases/val_blog/site/layouts/_default/single.html new file mode 100644 index 0000000..72aba9c --- /dev/null +++ b/org/cases/val_blog/site/layouts/_default/single.html @@ -0,0 +1,7 @@ +{{ define "main" }} +
+

{{ .Title }}

+

{{ .Date.Format "2006-01-02 15:04" }}

+ {{ .Content }} +
+{{ end }} diff --git a/org/cases/val_blog/site/layouts/index.html b/org/cases/val_blog/site/layouts/index.html new file mode 100644 index 0000000..ec57f3b --- /dev/null +++ b/org/cases/val_blog/site/layouts/index.html @@ -0,0 +1,9 @@ +{{ define "main" }} +

{{ .Site.Params.description }}

+

最新旅程

+
    + {{ range first 10 (where .Site.RegularPages "Section" "journey") }} +
  • {{ .Title }} {{ .Date.Format "2006-01-02" }}
    • + {{ end }} +
+{{ end }} diff --git a/org/cases/val_blog/site/static/css/main.css b/org/cases/val_blog/site/static/css/main.css new file mode 100644 index 0000000..1464b7b --- /dev/null +++ b/org/cases/val_blog/site/static/css/main.css @@ -0,0 +1,3 @@ +body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;max-width:780px;margin:2rem auto;padding:0 1rem;line-height:1.8;background:#0f1220;color:#e8ebff} +a{color:#9bc1ff;text-decoration:none}a:hover{text-decoration:underline} +header h1{font-size:1.5rem} h2{margin-top:2rem}