第 01 课 | 整体思路与第一幕：起步

一份给初学者的实战教程。不讲理论，跟着做，做出来就懂了。

---

整体思路

教程跟着真实开发过程走。每一集解决一个真实问题，引出一个真实概念。

• 14 集，每集有明确产出
• 故事线：一个想法 → 1529 行代码 → 能用的计算器
• 代码量：3 个文件（HTML 57 行 / CSS 535 行 / JS 937 行）+ 1631 行测试
• 节奏：做 → 遇到问题 → 学概念 → 继续做

---

第一幕：起步（第1-3集）

从"想做计算器"到"开始写代码"

第1集：我就想做个计算器

场景：打开电脑，脑子里只有一句话——"做个计算器，老人也能用"。

• 我的具体想法：老年模式 + 标准模式，纯前端，离线能用
• 一条命令启动：/gsd-new-project
• GSD 做了什么：问了几个关键问题，把模糊想法变成结构化项目
• 拿到了什么：.planning/ 目录、PROJECT.md、34 条需求、4 阶段路线图
• 核心概念：AI 辅助开发不是"帮我写代码"，而是"帮我理清思路"

产出文件：

• .planning/PROJECT.md — 项目定义（核心价值、约束、目标用户）
• .planning/REQUIREMENTS.md — 34 条需求（CALC/DISP/INPT/ELDR/STND/MODE/HIST/A11Y/RESP）
• .planning/ROADMAP.md — 4 Phase 路线图
• .planning/STATE.md — 项目状态
• CLAUDE.md — 项目约束文件（GSD 工作流强制规则写入此处）

对应命令：/gsd-new-project --auto

---

第2集：研究我没想过的东西

场景：GSD 自动跑了一轮研究，发现了我没想到的问题。

• 浮点精度：0.1 + 0.2 = 0.30000000000000004，怎么回事？
• WCAG AAA：老年模式要 7:1 对比度，具体怎么测？
• 按钮多大合适：80px 从哪来的？（老年人手指触摸研究）
• 研究结果怎么变成需求：知道了才写进去，不知道的就漏了
• --skip-research 什么时候可以跳过
• 核心概念：先研究再动手，比自己瞎猜靠谱

产出文件：

• .planning/research/domain-research.md — 领域研究（无障碍标准、老年用户习惯）
• .planning/research/stack-research.md — 技术栈研究（浮点精度方案、CSS 变量）
• .planning/research/SUMMARY.md — 研究综合摘要

对应命令：/gsd-new-project 内置研究阶段（自动触发）

---

第3集：定架构——不然后面全得返工

场景：开始 Phase 1 之前，先锁定几个关键决策。一旦冻住，下游不再重复提问。

• 为什么不用 eval()？（安全 + 控制力 — CALC-08 安全需求）
• Shunting-yard 算法是什么？（大白话：把算式排成队，按优先级算）
• 浮点精度怎么办？（乘 10^10 当整数算，再除回来）
• 历史记录怎么存？（最多 10 条，FIFO，localStorage）
• 讨论过程怎么记录：DISCUSSION-LOG.md 留痕
• 核心概念：先讨论再编码，决策冻结在 CONTEXT.md 里

产出文件：

• .planning/phases/01/CONTEXT.md — 冻结的设计决策（引擎架构、精度方案、历史策略）
• .planning/phases/01/DISCUSSION-LOG.md — 讨论过程

对应命令：/gsd-discuss-phase 1