第1课：什么是 AI Web 应用，以及为什么现在值得关注

imgimgimgimgimg

引言

AI Web 应用是一种不仅展示信息、还能借助背后的 AI 模型代为生成内容、进行推理或执行操作的网站。我们可以把普通网站比作自动售货机：你按下一个按钮，就会得到一个固定的商品。而 AI Web 应用则更像一位厨师，他会阅读你的点单、稍作思考，然后当场为你烹制一道定制菜肴。

其核心思路非常简单：用户输入或上传一段内容，该内容被发送到一个 AI 模型（例如大语言模型），然后将模型的回复显示在页面中。所谓“Web 应用”，意味着它在浏览器中运行，拥有交互界面，体验上像一个可以使用的工具，而不仅仅是一篇供阅读的静态文章。

它与传统网站的不同之处

传统网站以固定内容为核心。一篇博客文章、一个商品详情页、一家公司主页，都是由人工一次性写好，再以相同的方式呈现给每位访客。即便页面通过 JavaScript 来局部刷新，其内容来源仍然只是服务器上某个由人编写的文件。

AI Web 应用则拥有一个“动态的真相之源”。页面上的内容会在用户与之互动的瞬间实时生成。即使是十个人使用同一个 AI Web 应用，他们看到的回复也几乎各不相同。这种从“存储并展示”到“生成并回应”的转变，是近二十年来 Web 软件开发领域最重大的变革。

🖥️ [建议在此处插入示意图：对比传统网站（请求直接从数据库返回固定 HTML）与 AI Web 应用（请求被转发至 AI 模型，再将模型回复返回给浏览器）]

为什么当下值得关注

近几年来，三股力量汇聚在一起。第一，AI 模型的能力已经足够强大，能够胜任写作、摘要、分类、翻译等真实任务。第二，调用这些模型的成本已经降到很低，即使是一个小项目，每月也能负担数千次请求。第三，Web 应用开发工具——包括无代码和低代码平台——已经相当成熟，即便没有编程基础，也能在几天而不是几个月内上线一个可用的产品。

这意味着，从“一个想法”到“一个真实用户可以体验的 AI Web 应用”之间的门槛，已经降到了历史最低。今天学习这项技能的人，正处在这条仍在陡峭上扬的曲线的早期。

一个简单的例子

想象一个只有一行输入框和一个标注为“礼貌改写”按钮的简单页面。用户把一封措辞生硬的邮件粘贴进去，点击按钮，下方就会出现一封语气更柔和的版本。其背后，页面把这段文字连同一条简短指令发送给 AI 模型，等待回复，再把它展示出来。整个应用可以仅仅由一个 HTML 文件加一小段脚本构成。

html
<!DOCTYPE html>
<html>
<head><title>Polite Rewriter</title></head>
<body>
<h1>Rewrite my email politely</h1>
<textarea id="input" rows="6" cols="50"></textarea>
<br>
<button onclick="rewrite()">Rewrite politely</button>
<p id="output"></p>
<script>
function rewrite() {
  const text = document.getElementById("input").value;
  document.getElementById("output").innerText = "Pretend AI replied: a softer version of — " + text;
}
</script>
</body>
</html>

上面的代码片段只是一个占位示例，用以展示界面的形态。在真正的应用里，标作“模拟 AI 回复”的部分会被替换为对真实 AI 服务的调用，由后者返回改写后的文本。

常见误解

一个常见的误区是认为 AI Web 应用必须看起来很前卫、技术上很复杂。实际上，许多成功的 AI Web 应用在视觉上都非常朴素——只有一个输入框、一个按钮和一块结果区域。另一个误区是认为必须自己训练一个 AI 模型。几乎在所有情况下，你只需要通过 API 调用一个现成模型，然后把精力集中在界面、prompt 和用户体验上。

小结

AI Web 应用是指输出在请求时由 AI 模型生成、而不是预先存储的网站。它与传统网站的区别在于：每一次的回复都可能是独一无二的。当下之所以是入场的良机，是因为 AI 能力、调用成本和无代码工具都已达到可实际落地的水平。对于非程序员而言，这是通向在开放网络上打造真实产品的一条门槛最低的路径之一。

下一节课将介绍几乎所有 AI Web 应用都会涉及的三大基石：前端界面、后端逻辑，以及 AI 模型调用。

课程检查点

1. AI Web 应用与传统网站最主要的区别是什么？

2. 下列哪项最能描述 AI 模型在 Web 应用中的角色？

3. 为什么当下被认为是开始构建 AI Web 应用的好时机？

4. 在“礼貌改写邮件”的例子中，后端通常会做什么？

5. 下列哪项陈述是关于 AI Web 应用的常见误解？

6. 如果有十个人使用同一个 AI Web 应用并输入相同的 prompt，最有可能发生什么？

7. 根据本课，作为非程序员构建 AI Web 应用时，通常的重点是什么？

8. 是哪三项因素汇聚在一起，使 AI Web 应用如今变得触手可及？