Integrar Firebase con tu aplicación Flutter

Firebase es una plataforma potente que ofrece diversos servicios para construir aplicaciones escalables y llenas de funcionalidades. En esta guía, haremos un recorrido por el proceso de añadir Firebase a tu proyecto Flutter.

05.09.2023 — Edu Molins — 2 min read
Flutter firebase b

Paso 1: Crear un proyecto en Firebase.

  1. Ve a la Firebase Console y clica en "Añadir proyecto"
  2. Sigue las instrucciones para configurar tu proyecto. Una vez hecho, haz clic en "Continuar" y luego en "Crear proyecto".

Paso 2: Añade tu app de Flutter a Firebase.

  1. Después de crear el proyecto, haz clic en "Añadir aplicación" y selecciona el ícono de Flutter.
  2. Registra tu aplicación proporcionando un apodo y el nombre del paquete (asegúrate de que coincida con tu proyecto Flutter).
  3. Descarga el archivo `google-services.json` y colócalo en el directorio `android/app`.
  4. Para iOS, haz clic en "Registrar aplicación" y sigue las instrucciones. Descarga el archivo `GoogleService-Info.plist` y agrégalo al directorio `ios/Runner` de tu proyecto Flutter.

Paso 3: Configura Firebase en tu proyecto Flutter.

  1. Abre el archivo pubspec.yaml y añade las dependencias de Firebase:

    dependencies: 
      firebase_core: ^latest_version 
      firebase_auth: ^latest_version 
      cloud_firestore: ^latest_version
  2. Ejecuta el comando flutter pub get en la terminal para instalar las nuevas dependencias.

Paso 4: Inicializa Firebase en tu app Flutter.

 

  1. Importa los paquetes de Firebase en tu `main.dart`:

    import 'package:firebase_core/firebase_core.dart';
  2. Inicializa Firebase en la función principal:

    void main() async { 
       WidgetsFlutterBinding.ensureInitialized(); 
       await Firebase.initializeApp(); 
       runApp(MyApp()); 
    }

 

Paso 5: Utiliza los servicios de Firebase en tu aplicación Flutter.

Autenticación

 

  1. Importa los paquetes necesarios:

    import 'package:firebase_auth/firebase_auth.dart';
  2. Implementa la autenticación:

    final FirebaseAuth _auth = FirebaseAuth.instance; 
    
    Future<void> signInWithGoogle() async { 
      try { 
        // Implement Google Sign-In logic here 
        UserCredential userCredential = await _auth.signInWithGoogle(); 
        print("Signed in: ${userCredential.user.displayName}"); 
      } catch (e) { 
        print("Error during Google Sign-In: $e");
      } 
    }

 

Firestore Database

  1. Importa los paquetes necesarios:

    import 'package:cloud_firestore/cloud_firestore.dart';
  2. Usa Firestore en tu código:

    final FirebaseFirestore _firestore = FirebaseFirestore.instance; 
    
    Future<void> addUserToFirestore(String username, String email) { 
      return _firestore.collection('users').add({ 
        'username': username, 
        'email': email, 
      });
    }

Paso 6: Comprueba tu integración con Firebase.

Ejecuta tu aplicación Flutter y asegúrate de que Firebase se ha inicializado sin errores. Prueba las funciones de autenticación y Firestore para confirmar su funcionalidad.

¡Felicidades! Has integrado con éxito Firebase en tu proyecto Flutter. Esto establece las bases para incorporar diversos servicios de Firebase en tu aplicación para mejorar su funcionalidad.

⚡️ Consigue la subvención del Kit Digital para digitalizar tu negocio. Saber más.