第三章：PRD 与文档驱动开发
一定要把 Key 保存到环境变量 .env 文件中。
归档参考文档：将这些 API 的关键文档（如请求格式、示例代码、返回码）整理好，归档在项目中（比如 docs/api-reference.md）。这样下次你需要 AI 写相关功能时，直接把这份文档喂给它，它就能精准地写出调用代码，而不是编造一个不存在的接口。
解决浏览器缓存的两个大招：一是强制刷新（按住 Shift + Ctrl + R）；二是打开 F12 开发者工具，在 Network 选项卡里勾选 “Disable cache”，只要开发者工具开着，浏览器就不敢偷懒。
关于 HTML、CSS、Components 的形象描述：
- CSS (层叠样式表)：如果说 HTML 是网页的骨架（素颜），那 CSS 就是化妆品。它决定了按钮是圆角还是直角，背景是渐变还是纯色。
- 组件 (Component)：现代网页不是画出来的，而是搭出来的。导航栏、按钮、输入框，这些都是预先做好的乐高积木。你不需要每次都手写一个“带圆角、有阴影、鼠标悬停变色的红色按钮”，而是直接拿来一个叫做
<Button />的积木就能用。
第七章：数据持久化与数据库
检查数据库设计的妙招：让 ChatGPT 帮你设计好表结构，然后把生成的代码发给 Claude 或 DeepSeek，问它：“作为一个资深数据库架构师，请批判一下这个设计有什么潜在的性能隐患或逻辑漏洞？”通常经过两轮这样的“左右互搏”，你就能得到一个非常健壮的数据库模型。
什么是 Prisma？我的理解是，这个工具就像是不同 query languages 的“服务端 server”，通过自定义的语法可以新建或改变（CRUD）数据库。
第八章：功能测试流程与自动化脚本
测试工具：Playwright，一个自动化浏览器控制工具，具有可视化 UI。
总结：指定文件路径，给口令 prompt 让测试工具来测试。如果是简单的功能测试，则可以上手直接自己点击测试。
第十章：Git 与跨平台协作
Linux 和 macOS 系统对文件名大小写是敏感的，而 Windows 不敏感。在 Windows 眼里，Button.tsx 和 button.tsx 是同一个文件，但在 Mac 眼里它们是两个完全不同的文件。Mac 和 Linux 用的是正斜杠 /，但 Windows 正好相反。
第十四章：安全防护与 SEO 数据统计
为防止未授权访问的疏漏，在 Next.js 中，需要在根目录放一个 middleware.ts 文件。可以让 AI 写一段逻辑，prompt：“拦截所有以 /admin 开头的路径。如果用户没有登录（缺少 Session），或者用户角色不是 admin，直接踢回登录页。”
SEO 方面，为了让搜索软件能够搜到应用网页，需要设置一些文件：
- Metadata (元数据)：你学会了在 Next.js 的
layout.tsx里配置metadata对象。你填上了清晰的title（标题）和description（简介），告诉爬虫你是谁。 - Sitemap (站点地图)：你让 AI 帮你生成了一个
sitemap.xml。这就像是给爬虫的一张地图，告诉它你网站里有哪些页面，哪些是最新的。 - Robots.txt：这是给爬虫看的，告诉它哪些能爬，哪些不能爬。
关于链接附图，可以让 AI 配置 Open Graph（OG）协议：首先在 Next.js 里放一张图片命名为 opengraph-image.png，Next.js 就会自动把它作为社交分享卡片。
至于数据统计，除了 Google Analytics，还可以用 1Panel 中的 Umami 搭建一个轻量级、开源的统计系统。