Agregar Firebase a tu app de Flutter


Requisitos previos

  • Instala el editor o IDE que prefieras.

  • Instala Flutter para tu sistema operativo específico, incluidos estos componentes:

    • SDK de Flutter
    • Bibliotecas compatibles
    • Software y SDK específicos para cada plataforma

  • Accede a Firebase con tu Cuenta de Google.

Si todavía no tienes una app de Flutter, puedes seguir los pasos del instructivo Get started: Test drive para crear una nueva usando el editor o IDE que prefieras.

Paso 1: Instala las herramientas de línea de comandos obligatorias

  1. Si aún no lo hiciste, Instala la CLI de Firebase.

  2. Accede a Firebase con tu Cuenta de Google ejecutando el siguiente comando:

    firebase login

  3. Para instalar la CLI de FlutterFire, ejecuta el siguiente comando desde cualquier directorio:

    dart pub global activate flutterfire_cli

Paso 2: Configura tus apps para usar Firebase

Usa la CLI de FlutterFire a fin de configurar tus apps de Flutter para conectarte a Firebase.

Desde el directorio de tu proyecto de Flutter, ejecuta el siguiente comando para iniciar el flujo de trabajo de configuración de la app:

flutterfire configure


Paso 3: Inicializa Firebase en tu app

  1. Desde el directorio de tu proyecto de Flutter, ejecuta el siguiente comando para instalar el complemento principal:

    flutter pub add firebase_core

  2. Desde el directorio de tu proyecto de Flutter, ejecuta el siguiente comando para asegurarte de que la configuración de Firebase de tu app de Flutter esté actualizada:

    flutterfire configure

  3. En el archivo lib/main.dart, importa el complemento principal de Firebase y el archivo de configuración que generaste antes:

    import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart';

  4. Además, en tu archivo lib/main.dart, inicializa Firebase con el objeto DefaultFirebaseOptions exportado por el archivo de configuración:

    WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp(
  options: DefaultFirebaseOptions.currentPlatform,
);
runApp(const MyApp());

  5. Vuelve a compilar tu aplicación de Flutter:

    flutter run

Si prefieres usar un proyecto de demostración, puedes iniciar el emulador de Firebase y, en tu archivo lib/main.dart, inicializar Firebase con demoProjectId (debería comenzar con demo-):

  await Firebase.initializeApp(
    demoProjectId: "demo-project-id",
  );

Paso 4: Agrega complementos de Firebase

Puedes acceder a Firebase en tu app de Flutter a través de los distintos complementos de Firebase para Flutter, uno para cada producto de Firebase (por ejemplo, Cloud Firestore, Authentication, Analytics, etcétera).

Como Flutter es un framework multiplataforma, cada complemento de Firebase es aplicable para usar en plataformas web, de Apple y de Android. Por lo tanto, si agregas un complemento de Firebase a tu app de Flutter, el complemento se usará en las versiones para Apple, Android y la Web.

A continuación, te mostramos cómo agregar un complemento de Flutter de Firebase:

  1. Desde el directorio de tu proyecto de Flutter, ejecuta el siguiente comando:

    flutter pub add PLUGIN_NAME

  2. Desde el directorio de tu proyecto de Flutter, ejecuta el siguiente comando:

    flutterfire configure

    Ejecutar este comando garantiza que la configuración de Firebase de tu app de Flutter esté actualizada y que, para Crashlytics y Performance Monitoring en Android, se agreguen los complementos de Gradle necesarios a tu app.

  3. Cuando termines, vuelve a crear el proyecto de Flutter:

    flutter run

Listo. Las apps de Flutter se registraron y configuraron para usar Firebase.

Complementos disponibles

Producto Nombre del complemento iOS Android Web Otras plataformas de Apple
(macOS, etcétera)		 Windows
Analytics firebase_analytics
beta
App Check firebase_app_check
beta
Authentication firebase_auth
beta beta
Cloud Firestore cloud_firestore
beta beta
Cloud Functions cloud_functions
beta
Cloud Messaging firebase_messaging
beta
Cloud Storage firebase_storage
beta beta
Crashlytics firebase_crashlytics
beta
Dynamic Links firebase_dynamic_links
In-App Messaging firebase_in_app_messaging
Instalaciones de Firebase firebase_app_installations
beta
ML Model Downloader firebase_ml_model_downloader
beta
Performance Monitoring firebase_performance
Realtime Database firebase_database
beta
Remote Config firebase_remote_config
beta
Vertex AI in Firebase firebase_vertexai
beta

Prueba una app de ejemplo con Analytics

Como todos los paquetes, el complemento firebase_analytics incluye un programa de ejemplo.

  1. Abre una app de Flutter que ya hayas configurado para usar Firebase (consulta las instrucciones en esta página).

  2. Accede al directorio lib de la app y, luego, borra el archivo main.dart existente.

  3. Copia y pega los siguientes dos archivos en el directorio lib de tu app, desde el repositorio del programa de ejemplo de Google Analytics:

    • main.dart
    • tabs_page.dart

  4. Ejecuta la app de Flutter.

  5. Ve al proyecto de Firebase de tu app en Firebase console y, luego, haz clic en Analytics en el panel de navegación izquierdo.

    1. Haz clic en Panel. Si Analytics funciona correctamente, se mostrará un usuario activo en el panel “Usuarios activos en los últimos 30 minutos” (esta información podría tardar en propagarse).

    2. Haz clic en DebugView. Habilita la función para ver todos los eventos que generó el programa de ejemplo.

Si quieres obtener más detalles sobre la configuración de Analytics, consulta las guías de introducción para iOS+, Android y la Web.

Próximos pasos