本快速入门介绍如何将 Firebase SQL Connect 与 AI 编码 工具搭配使用，以快速构建全栈关系型应用。通过为智能体配备 Firebase 代理技能，您无需编写样板数据库代码或手动配置端点。您将学习如何设置本地项目、配置 AI 助理，以及如何使用单个提示生成安全的 PostgreSQL 架构、GraphQL 操作和完整的 React 前端。 您可以将在此处学到的知识用于为 Firebase SQL Connect 支持的任何平台构建前端。
准备工作
如需完成本快速入门，请确保您的环境已设置以下内容。如果您需要针对特定操作系统的分步帮助，请参阅 标准设置指南：
- Node.js：安装 Node.js 以运行 Firebase CLI 并为生成的 React 前端提供支持。
Firebase CLI：全局安装 Firebase CLI：
npm install -g firebase-toolsAI 编码工具：安装现代 AI 驱动的编辑器（例如 Antigravity、 Android Studio、Cursor 或 Windsurf）。
设置工作区
首先，打开您偏好的 AI 编码工具并创建一个新项目目录。 打开该工具的集成终端并运行初始化命令：
firebase init dataconnect
此命令会引导您完成项目初始化。出现提示时，请选择以下选项：
- 创建新的 Firebase 项目
- 跳过 Gemini 架构生成
- 创建新的 Cloud SQL 实例
- 创建 React 模板
- 选择是 以安装 Agent Skills for Firebase
使用 AI 生成应用
安装 Firebase 代理技能后，AI 助理可以直接根据高级提示生成 SQL Connect 架构、操作和前端代码。
将以下提示之一复制并粘贴到 AI 助理中，以生成后端、数据库关系和 React 前端：
示例 1：影视点评应用
提示：
Build a movie review website using Firebase SQL Connect. Customers can browse
a catalog of movies presented in a modern card layout displaying average
ratings and review counts, and leave a review from 1 to 5 stars. A user must
only be allowed to leave a single review per movie. Build a styled React
(Vite) frontend that displays the catalog and dynamically renders a live feed
of new reviews. Compile the database backend and React frontend, seed the
database with sample data, and verify that the application builds cleanly and
all core user flows run successfully.
示例 2：电子商务店面
提示：
Build an online storefront using Firebase SQL Connect. Customers can browse
product cards showing prices and stock levels, manage a shopping cart, and
check out securely. The checkout transaction must atomically verify that
their cart is not empty, check that products are in stock, create the order,
and decrease the product stock, safely rolling back if any step fails.
Build a highly responsive React (Vite) storefront with a polished checkout
process. Compile the database backend and React frontend, seed the database
with sample data, and verify that the application builds cleanly and all
core user flows run successfully.
示例 3：多作者博客
提示：
Create a multi-author blog platform using Firebase SQL Connect. The homepage
should display published articles formatted in an elegant typographic layout
with comfortable reading line lengths and serif headings. Users should have
access to a secure split-pane writing dashboard built using React (Vite) to
compose posts with a live preview. Compile the database backend and React
frontend, seed the database with sample data, and verify that the
application builds cleanly and all core user flows run successfully.
AI 助理创建的内容
运行这些提示时，AI 助理会自动处理繁琐的技术工作：
- 数据库架构 (
dataconnect/schema/schema.gql) ：使用@table指令将您的要求转换为关系表，并自动管理外键和主键。 - GraphQL 操作 (
dataconnect/[connector_name]/*.gql) ：生成应用所需的确切查询和变更，并使用@auth指令进行保护。 - 生成的 SDK (
src/dataconnect/) ：使用 Firebase CLI 根据您的架构和操作即时生成严格类型的客户端 SDK。 - React 前端 (
src/) ：连接一个完整且样式精美的 React 应用，该应用使用生成的 SDK 与新后端通信。
部署到生产环境
如需将架构、查询和变更部署到生产环境，请在终端中运行以下命令：
firebase deploy --only dataconnect
部署后，请访问 Firebase 控制台以查看实时架构，并直接针对 Cloud SQL 实例运行操作。
后续步骤
现在您已完成本快速入门，接下来可以执行以下操作：
- 探索快速入门应用代码库，并按照我们的 Codelab 构建 SQL Connect 应用。
- 向数据库添加数据，并在 Firebase 控制台中监控 SQL Connect 服务。
- 详细了解架构、 查询和 变更开发。
- 详细了解 客户端 SDK 和 Admin SDK。