En esta guía de inicio rápido, aprenderás a compilar Firebase Data Connect en tu aplicación con una instancia de SQL de producción. Harás lo siguiente:
- Agrega Firebase Data Connect a tu proyecto de Firebase.
- Aprovisiona una instancia de Cloud SQL para tu app.
- Configura un entorno de desarrollo que incluya una extensión de Visual Studio Code para trabajar con una instancia de producción.
- Luego, te mostraremos cómo hacer lo siguiente:
- Crea un esquema para una app de películas
- Define las consultas y mutaciones que se usarán en tu app
- Prueba tus consultas y mutaciones con datos de muestra.
- Genera SDKs fuertemente tipificados y úsalo en tu app
- Implementa tu esquema, tus consultas y tus datos finales en la nube.
Crea un proyecto de Firebase y una base de datos de Cloud SQL
- Si aún no lo hiciste, crea un proyecto de Firebase.
- En la consola de Firebase, haz clic en Agregar proyecto y, luego, sigue las instrucciones que aparecen en pantalla.
- Ve a la sección Data Connect de Firebase console y sigue el flujo de trabajo de configuración del producto.
Actualiza tu proyecto al plan Blaze. Esto te permite crear una instancia de Cloud SQL para PostgreSQL.
Selecciona una ubicación para tu base de datos de CloudSQL para PostgreSQL.
Anota los nombres y los IDs del proyecto, el servicio y la base de datos para confirmarlos más adelante.
Sigue el flujo de configuración restante y, luego, haz clic en Listo.
Elige un flujo de desarrollo
Data Connect te ofrece dos maneras de instalar herramientas de desarrollo.
Configura el entorno de desarrollo
- Crea un directorio nuevo para tu proyecto local.
Ejecuta el siguiente comando en el directorio nuevo que creaste.
curl -sL https://firebase.tools/dataconnect | bash
Esta secuencia de comandos intenta configurar el entorno de desarrollo por ti y, luego, iniciar un IDE basado en el navegador. Este IDE proporciona herramientas, incluida una extensión precompilada de VS Code, para ayudarte a administrar tu esquema y definir consultas y mutaciones que se usarán en tu aplicación, y generar SDKs fuertemente tipados.
alias dataconnect='curl -sL https://firebase.tools/dataconnect | bash'
Configura el directorio de tu proyecto
Para configurar tu proyecto local, inicializa el directorio del proyecto. En la ventana del IDE, en el panel izquierdo, haz clic en el ícono de Firebase para abrir la IU de la extensión de VS Code de Data Connect:
- Haz clic en el botón Acceder con Google.
- Haz clic en el botón Connect a Firebase project y selecciona el proyecto que creaste antes en la consola.
- Haz clic en el botón Run firebase init y completa el flujo.
Haz clic en el botón Start emulators.
Crea un esquema
En el directorio de tu proyecto de Firebase, en el archivo /dataconnect/schema/schema.gql
, comienza a definir un esquema de GraphQL que incluya películas.
Película
En Data Connect, los campos de GraphQL se asignan a columnas. El tipo Movie
tiene id
, title
, imageUrl
y genre
. Data Connect reconoce los tipos de datos primitivos String
y UUID
.
Copia el siguiente fragmento o quita los comentarios de las líneas correspondientes en el archivo.
# File `/dataconnect/schema/schema.gql`
# By default, a UUID id key will be created by default as primary key.
type Movie @table {
id: UUID! @default(expr: "uuidV4()")
title: String!
imageUrl: String!
genre: String
}
MovieMetadata
Ahora que tienes películas, puedes modelar los metadatos de las películas.
Copia el siguiente fragmento o quita los comentarios de las líneas correspondientes en el archivo.
# Movie - MovieMetadata is a one-to-one relationship
type MovieMetadata @table {
# This time, we omit adding a primary key because
# you can rely on Data Connect to manage it.
# @unique indicates a 1-1 relationship
movie: Movie! @unique
# movieId: UUID <- this is created by the above reference
rating: Float
releaseYear: Int
description: String
}
Ten en cuenta que el campo movie
está asignado a un tipo de Movie
.
Data Connect comprende que esta es una relación entre Movie
y MovieMetadata
, y la administrará por ti.
Obtén más información sobre los esquemas de Data Connect en la documentación
Implementa tu esquema en producción
Debes implementar tu esquema antes de continuar.
En la IU de la extensión, en el panel Firebase Data Connect, haz clic en Deploy to production.
Después de implementar el esquema en tu base de datos de producción, deberías poder verlo en la consola de Firebase.
Agrega datos a tus tablas
En el panel del editor del IDE, puedes ver que los botones de CodeLens aparecen sobre los tipos de GraphQL en /dataconnect/schema/schema.gql
. Como implementaste
tu esquema en producción, puedes usar los botones Agregar datos y
Ejecutar (producción) para agregar datos a tu base de datos en el backend.
Para agregar registros a la tabla Movie
, haz lo siguiente:
- En
schema.gql
, haz clic en el botón Agregar datos que se encuentra sobre la declaración de tipoMovie
.
- En el archivo
Movie_insert.gql
que se genera, codifica los datos de los cuatro campos. - Haz clic en el botón Run (Production).
- Repite los pasos anteriores para agregar un registro a la tabla
MovieMetadata
y proporcionar elid
de tu película en el campomovieId
, como se indica en la mutaciónMovieMetadata_insert
generada.
Para verificar rápidamente si se agregaron los datos, haz lo siguiente:
- En
schema.gql
, haz clic en el botón Read data sobre la declaración de tipoMovie
. - En el archivo
Movie_read.gql
resultante, haz clic en el botón Run (Production) para ejecutar la consulta.
Obtén más información sobre las mutaciones de Data Connect en la documentación
Define tu consulta
Ahora viene la parte divertida: las consultas. Como desarrollador, estás acostumbrado a escribir consultas SQL en lugar de consultas GraphQL, por lo que esto puede parecer un poco diferente al principio. Sin embargo, GraphQL es mucho más conciso y seguro de tipo que el SQL sin procesar. Además, nuestra extensión de VS Code facilita la experiencia de desarrollo.
Empieza a editar el archivo /dataconnect/connector/queries.gql
. Si quieres obtener todas las películas, usa una consulta como esta.
# File `/dataconnect/connector/queries.gql`
# @auth() directives control who can call each operation.
# Anyone should be able to list all movies, so the auth level
# is set to PUBLIC
query ListMovies @auth(level: PUBLIC) {
movies {
id
title
imageUrl
genre
}
}
Ejecuta la consulta con el botón CodeLens cercano.
Obtén más información sobre las consultas de Data Connect en la documentación
Genera SDKs y úsalo en tu app
- Haz clic en el botón Add SDK to app.
En el diálogo que aparece, selecciona un directorio que contenga el código de tu app. Se generará y guardará allí el código del SDK de Data Connect.
Selecciona la plataforma de tu app y, luego, ten en cuenta que el código del SDK se genera de inmediato en el directorio que seleccionaste.
Obtén información para usar el SDK generado y llamar a consultas y mutaciones desde apps cliente (Web, Android, iOS, Flutter).
Implementa tu esquema y consulta en producción
Completaste una iteración de desarrollo. Ahora puedes implementar tu esquema, datos y consultas en el servidor con la IU de la extensión de Firebase o la CLI de Firebase, tal como lo hiciste con tu esquema.
En la ventana del IDE, en la IU de la extensión de VS Code, haz clic en el botón Deploy to production.
Una vez que se implemente, ve a la consola de Firebase para verificar que el esquema, las operaciones y los datos se hayan subido a la nube. Debes poder ver el esquema y ejecutar tus operaciones en la consola. La instancia de Cloud SQL para PostgreSQL se actualizará con su esquema y datos generados y, luego, se implementará.
Obtén más información sobre el uso del emulador de Data Connect en la documentación
Próximos pasos
Revisa tu proyecto implementado y descubre más herramientas:
Agrega datos a tu base de datos, inspecciona y modifica tus esquemas, y supervisa tu servicio de Data Connect en Firebase console. Accede a más información en la documentación. Por ejemplo, como completaste la guía de inicio rápido, puedes hacer lo siguiente:
Obtén más información sobre el desarrollo de esquemas, consultas y mutaciones.
Obtén información para generar SDKs cliente y llamar a consultas y mutaciones desde código cliente para la Web, Android, iOS y Flutter.