L32. 综合实战 A：全网比价系统复盘

Vibe Coding 宣言：知识如果不能变现，那就是垃圾。项目如果不能解决问题，那就是玩具。

0. 为什么这一课至关重要？ (Why It Matters)

• 从 0 到 1 的完整体验：这是你第一个真正的作品。
• 串联知识点：你会发现前面学的 Linux、Git、Python、SQL、Docker、React 全部用上了。
• 解决真实痛点：每个人都想买便宜货。这个系统是有用的。

1. 目标 (Goal)

复盘 全网比价系统 (Price Tracker) 的全流程，查漏补缺，准备上线。

2. 核心回顾 (The Review)

2.1 架构图 (Architecture)

graph TD
    User[用户] --> Frontend[前端 (React/Vercel)]
    Frontend --> API[后端 (FastAPI/Railway)]
    API --> DB[(数据库 Neon/Postgres)]
    Cron[定时爬虫 (GitHub Actions)] --> API
    Cron --> Notifier[报警机器人]

2.2 关键模块

1. 爬虫 (Scraper): 负责从京东/淘宝抓取数据。
2. 清洗 (Cleaner): 把乱七八糟的 HTML 变成结构化数据。
3. 存储 (Storage): 把数据存进 Neon。
4. 展示 (UI): 用 React 展示历史价格曲线。
5. 监控 (Monitor): 每天跑一次，失败了发飞书。

3. 实战演练 (Action)

Step 1: 完整跑一遍流程

1. 本地运行爬虫，确保能抓到最新数据。
2. 本地运行后端，确保 API 能返回数据。
3. 本地运行前端，确保能看到图表。

Step 2: 部署上线

1. Push 代码到 GitHub。
2. 检查 GitHub Actions 是否成功运行。
3. 检查 Vercel 和 Railway 是否自动部署成功。

Step 3: 用户测试 (UAT)

找个朋友（或者让 Claude 扮演小白用户）： “我要搜 iPhone 15，怎么操作？” “我想看过去一个月的最低价，在哪里？” “如果降价了，能不能发邮件告诉我？”

4. 常见问题 (FAQ - Vibe Style)

Q: 爬虫总是被封怎么办？ A: 这是爬虫的宿命。 解决方案：

1. 减慢抓取频率。
2. 使用随机 User-Agent。
3. 购买代理池（花钱消灾）。

Q: 数据量大了查询慢怎么办？ A: 加索引 (Index)。 在数据库里给 product_id 和 date 加上索引。

CREATE INDEX idx_product_date ON prices (product_id, date);

Q: 界面太丑了怎么办？ A: v0.dev 再生成一次。 或者去 Dribbble 找个好看的设计图，扔给 Claude 让它抄。

5. 验收标准 (Definition of Done)

1. 你有一个可以在公网访问的链接。
2. 输入商品关键词，能看到价格走势图。
3. 系统已经稳定运行了至少 3 天，每天都有新数据入库。

---

Next Mission: L33. 综合实战 B：AI 客服机器人