Firebase Studio：一份坦诚评测与示例

Firebase 提供了一整套功能强大的工具，覆盖构建现代 Web 与移动应用所需的一切。它在开发者圈内颇具人气，长期以来是初创团队首选的后端方案，具备身份验证、云存储、实时数据库与无服务器函数等出色功能。

如今，Google 更进一步推出了 Firebase Studio——一款全新的 AI 驱动开发环境，旨在帮助您在数分钟内将想法变为 MVP。与 Replit 和 Lovable 相似，Firebase Studio 仅凭提示词即可构建全栈应用。

本文将带您了解 Firebase Studio 是什么、如何运作。我会展示如何用它从零构建一个 IoT 仪表盘，并分享我的第一印象！

我们通过 The Median（每周五免费通讯）为读者带来最新的 AI 动态，梳理本周关键资讯。订阅即可每周几分钟快速掌握重点：

什么是 Google 的 Firebase Studio？

Firebase Studio 是 Google 推出的全新 AI 驱动开发工具，支持您用自然语言提示构建全栈应用。

它实际上是 2023 年 Google 发布的云端 IDE——Project IDX——的演进。Project IDX 致力于成为具备 AI 能力的通用云 IDE，而更名为 Firebase Studio 后，其重点聚焦于为 Firebase 开发者优化体验。它保留了 IDX 的精华，比如 Code OSS 编辑器、AI 助手与云端环境，并新增与 Firestore、Auth、Hosting、Cloud Functions 等 Firebase 服务的整合。

Firebase Studio 在 Firebase 2024 年品牌重塑期间发布，是 Firebase 对“AI 原生”开发工具浪潮的回应。

如何访问 Firebase Studio

您现在就可以前往 studio.firebase.google.com 试用 Firebase Studio。您只需要一个 Google 账号。进入后，输入描述您想构建应用的提示词，Firebase Studio 就会在后台利用 Firebase 工具生成一个可直接运行的项目。

Firebase Studio 定价

Firebase Studio 在预览期可免费使用。默认情况下，您可零成本创建最多 3 个工作区。但某些整合服务（如 Firebase App Hosting）或超出 Gemini API 免费配额时，需要关联结算账号，可能产生费用。您的 Firebase 项目会自动升级至 Blaze（按量计费）方案，超出免费配额的用量将计费。

话虽如此，如果您主要将 Firebase Studio 用于原型与开发任务，通常可控制在免费工作区限制内，无需承担费用即可探索 Firebase Studio。

测试一：从提示词生成 IoT 仪表盘应用

我首先决定测试基于提示词的应用生成。评测 AI 驱动的应用构建工具时，我喜欢用稍复杂一些的提示词来真正检验工具的表现。待办清单这类应用通常效果不错，但略微复杂的应用更能凸显工具的优势与短板。

因此，我使用了如下提示词：

点击“Prototype with AI”按钮并等待约一分钟后，屏幕依然一片空白。

刷新页面无济于事，于是我删除工作区并重试。这一次，我看到了应用规划：

让我印象不错的一点是，它生成了可编辑的样式指南（例如，我可以直接点选颜色进行修改）。

不过，看功能部分您会发现，它忽略了我在提示中明确要求的 Cloud Function 和 Firestore。尽管如此，我认为已经足够接近，于是按计划继续，想看看结果。下一屏显示如下：

此时，我对结果有些失望。UI 非常基础，实际上也没有任何用户身份验证。

我开始测试原型界面的各类按钮与功能。

点击应用 UI 右上角按钮会在新标签页打开应用。左侧的下一个按钮允许您分享预览链接，挺实用。最左侧的按钮会打开组件选择器——稍后再谈。

点击聊天输入框左侧橙色波浪状按钮会打开一个有趣的“绘图”菜单。

我圈选了一个传感器卡片，并指定希望显示该传感器的状态。确实，如果不知道当前状态，仅能开关并没有太大意义。

它确实在两个传感器卡片上添加了状态属性，会根据所点按钮进行更新。

我尝试通过 UI 新增一个厨房传感器，过程顺利。

但刷新后该新传感器未能持久化，有点令人失望。

此时我想看看代码。我点击了 Firebase Studio 界面右上角蓝色“Publish”按钮旁的代码图标。很高兴看到在线代码编辑器弹出。它足够流畅、外观良好，并内置了 Gemini 功能。打开源代码管理后，开始扫描 Git 仓库。

看起来它确实找到了一个，并等待我发布当前分支。

我觉得有点奇怪，于是点击了“Publish Branch”。

果不其然，我并未登录，那只是编辑器的小毛病。不管怎样，我很欣赏能直接在在线编辑器中登录 GitHub。

我真正想看的，是与 Firebase 工具套件的整合能力。我回到原型标签页，在聊天中要求整合 Auth 与 Cloud Functions 以模拟传感器数据。

它照做并给出了一个登录页面，但立刻报错失败。

其中一个错误（如上图所示）是因为代码尝试从一个并不存在的 Cloud Function 获取数据，而该函数在代码中根本没有被创建。多次点击“Fix Error”也毫无效果。

我回到代码标签页，不得不多次提示 Gemini 助手，才让它创建 Cloud Function 代码，而不是普通函数。随后它补充说无法代我部署，但可以提供部署步骤。可以接受。

由于聊天界面似乎不擅长处理逻辑问题，我想知道它是否更擅长 UI 相关问题。我让它通过添加数据与分析主题的图片来让登录页更“有趣”。但同样没有任何变化，尽管聊天显示它修改了几个文件。

我想尝试的最后一个功能是发布应用。点击右上角大的“Publish”按钮会打开侧边面板，列出发布步骤。

我决定创建结算账号，并自动切换到 Blaze 方案，以便通过 Firebase App Hosting 发布应用。侧边面板中的链接会重定向至 Google Cloud 控制台，我被提示创建结算资料。点击确认后，我被重定向至 GCP 的“URL not found”页面。

回到 Firebase Studio 标签页，我看到“Waiting for billing account from Cloud Console”的提示。我等待了几分钟并多次刷新，最终可以选择我的结算账号并发布应用。

至此，我完成了“从提示词生成应用”的测试。我的第一感受是：与我之前用过的其他工具相比，使用 Firebase Studio 的过程似乎更费点劲。

接下来进入第二个测试。

测试二：从模板生成项目

除了基于提示词生成应用，Firebase Studio 也支持通过模板创建应用。

在 Firebase Studio 首页，点击“Start coding an app”板块下的小图标（框架或语言），会打开一个新界面。我选择创建一个名为“My Node App”的 Node Express API Server，并使用 TypeScript。

几秒钟后，生成的服务器项目出现在在线代码编辑器中。这里没有原型标签页，考虑到这是后端代码，这也合理。

这一次，打开源代码管理标签页让我可以初始化一个新的 Git 仓库。

该模板只暴露了一个基础的“hello world”端点，但已包含启动 NodeJs + Express API 开发所需的全部代码与样板。

对 Firebase Studio 的第一印象与思考

总体而言，Firebase Studio 是迈向 AI 辅助开发的一步好棋，但仍然有明显的测试版质感。

从一个提示词到可运行应用，再到可视化原型、实时预览、可编辑组件与样式控制，这个理念非常令人兴奋。还能直接点选调色板改颜色、在原型上“画一画”提出修改等巧思，也颇为贴心。

内置代码编辑器也是个惊喜：外观不错、运行流畅，开箱即用的 Gemini 与 GitHub 支持让试改代码相当顺手。它绝对不逊于我过去用过的一些在线代码编辑器。

不过，我也遇到了不少令人挫败的问题。基于提示词的生成效果参差不齐：我明确要求的功能（如 Cloud Functions、Auth、Firestore）被舍弃；后来再次提出时，系统只实现了一部分，却留下了损坏的功能与未解决的错误。

生成的 UI 相当基础，而我添加背景图片的请求被忽略。多次坚持后，最后只得到一个渐变色背景。我在发布与结算设置上也遇到一些小问题，让整个流程显得有点笨拙。

基于模板的应用创建就顺利得多。Node.js 后端模板提供了结构良好、干净的代码库，我可以立即上手开发，稳定且对开发者更友好。

公允地说，我并未覆盖所有功能测试，而且该工具仍在不断演进。我也看到有人提到，它在更简单的用例或更结构化的提示下表现更好，我下次可能会尝试。

目前来看，Firebase Studio 更像是对 AI 优先开发可能形态的一次预览。与 Replit、Lovable、Bolt 或 v0 等工具相比，它还没到“正式上阵”的水平，但这个领域非常值得持续关注。

结语

Firebase Studio 的确带来了一些令人振奋的想法，但我认为它还不足以单独构建可用于生产的应用。如果您对 AI 辅助开发感到好奇，或想一窥未来趋势，非常值得一试！