第 03 课：让你的应用具备生产级品质

你已经构建了一个应用，并把它发布到了互联网上。但「已部署」和「生产就绪（production-ready）」是两个完全不同的概念。这一课会快速带你过一遍：把一个应用从 demo 演进为真正的产品，背后到底涉及什么。

---

你的应用能跑。但如果明天突然涌进一千个用户，它就会出问题。如果有人想滥用它，他们也能轻易得逞。如果 Google 想找到它，它根本不会出现在搜索结果里。

生产就绪意味着你的应用足够精致、安全、可靠，能够面对真实用户。下面是你需要知道存在的所有事情。

---

打磨细节

响应式设计（responsive design） —— 你的应用需要在手机、平板和桌面端都好看。超过一半的网络流量来自移动端。

Favicon 与页面标题（favicon & page title） —— 浏览器标签页上的小图标，以及在搜索结果里展示的标题。这些小细节会让你的应用看起来更像一个正经产品。

无障碍（accessibility） —— 让你的应用对所有人都可用，包括使用屏幕阅读器、键盘导航或视力障碍的用户。在很多地区，这是法律要求。

深色模式（dark mode） —— 减轻眼疲劳并节省电量。用户已经默认期待它存在。

---

被发现

SEO —— 搜索引擎优化（search engine optimization）能帮你的应用出现在 Google 中。

Open Graph 标签（Open Graph tags） —— 控制你的链接在 Twitter、Discord、iMessage 中被分享时的预览样式。没有它们，分享出去的链接只会显示一个空白预览。

分析（analytics） —— 告诉你有多少人访问、来自哪里、做了什么。没有它，你就是在盲飞。

自定义域名（custom domain） —— myapp.com 而不是 my-app.vercel.app。让你的应用看上去更正经。

---

真实功能

这里开始，事情会迅速变得复杂。

数据库（database） —— 现在你的应用什么都记不住。一刷新，一切都会重置。数据库让你能存储用户数据、内容，以及任何需要持久化的东西。常见选项：Supabase、Firebase、PlanetScale。

用户认证（user authentication） —— 让用户能创建账号并登录。这包括密码哈希、会话管理、OAuth（用 Google 登录）、邮箱验证和密码重置。永远不要从零自己实现这一套。

文件存储（file storage） —— 如果用户要上传图片或文档，你需要云存储。保存到你服务器上的文件，每次部署都会被清空。常见选项：Supabase Storage、AWS S3、Cloudflare R2。

支付（payments） —— 如果你想收钱，就需要一个像 Stripe 这样的支付服务商。它们会处理信用卡、税费、收据和退款。它们每笔大约抽 3%，并且有可能冻结你的账户。

邮件与通知（email & notifications） —— 欢迎邮件、密码重置、订单确认。你需要一个像 Resend 或 SendGrid 这样的服务来程序化地发送这些邮件。

---

基础设施

环境变量（environment variables） —— API key 和密钥永远不应该出现在你的代码里或 GitHub 上。机器人持续不断地扫描 GitHub，几分钟内就能发现暴露出来的 key。

CI/CD —— 每次你 push 代码，应用都会自动构建、测试并部署。Vercel 默认就这么做。

预发布环境（staging environments） —— 你生产应用的一个副本，用来在变更上线之前进行测试。

---

可靠性

错误处理（error handling） —— 没有它，应用一旦出错就只会显示空白白屏。用户应当始终知道发生了什么。

错误追踪（error tracking） —— 像 Sentry 这样的工具会告诉你生产环境里出了什么问题、哪个用户遇到了这个错误，以及他当时在做什么。

测试（testing） —— 用代码来检查你其他代码是否正常工作。单元测试、集成测试、端到端测试。从那些一旦坏了就最让你头疼的部分开始写。

备份（backups） —— 如果你有数据库，就需要备份。数据库会损坏、被误删，或被一个糟糕的迁移搞崩。

---

安全

HTTPS —— 加密用户与你的应用之间的流量。Vercel 和 GitHub Pages 都是自动的。

输入校验（input validation） —— 永远不要信任用户输入。把一切都先消毒。SQL 注入和 XSS 攻击会让攻击者窃取数据或劫持你的应用。

速率限制（rate limiting） —— 阻止某人用成千上万次请求疯狂打你的 API。没有它，一个恶意用户就能把你的应用打挂，或者让你的账单暴涨。

还有很多 —— 比如用数据加密来保护你的网站。

---

性能

图片优化（image optimization） —— 压缩图片、使用现代格式（WebP/AVIF）、为每种屏幕提供合适的尺寸。

缓存（caching） —— 把数据的副本存起来，这样就不用每次都重新拉取。浏览器缓存、服务器缓存、CDN 缓存。

Core Web Vitals —— Google 用来衡量页面速度和用户体验的指标。它们会直接影响你的搜索排名。

---

法律

隐私政策（privacy policy） —— 只要你收集任何用户数据，法律上就要求你必须有一份。

服务条款（terms of service） —— 用户能创建账号时就必须有。

Cookie 同意（cookie consent） —— 如果你使用追踪工具，并且用户位于欧洲，根据 GDPR 这是必需的。

---

整体来看

这是相当多的东西。而且这份清单上几乎每一项都是一个独立的服务、一个独立的账户、一个独立的、随时可能出问题的环节。这就是用传统工具构建生产级软件的现实。

下一课，我们会介绍一种本质上完全不同的方法。你将看到，这些问题中的许多（身份、数据存储、支付、信任）都可以用分布式系统来解决。