Integrar Firebase amb la teva aplicació Flutter

Firebase és una plataforma potent que ofereix diversos serveis per construir aplicacions escalables i plenes de funcionalitats. En aquesta guia, farem un recorregut pel procés d'afegir Firebase al teu projecte Flutter.

05.09.2023 — Edu Molins — 2 min read
Flutter firebase b

Pas 1: Crear un projecte a Firebase

  1. Vés a la Firebase Console i clica a "Add project."
  2. Segueix les indicacions per configurar el teu projecte. Un cop fet, fes clic a "Continuar" i després a "Crear projecte".

Pas 2: Afegeix la teva app de Flutter a Firebase

  1. Després de crear el projecte, fes clic a "Afegir aplicació" i selecciona la icona de Flutter.
  2. Registra la teva aplicació proporcionant un sobrenom i el nom del paquet (assegura't que coincideixi amb el teu projecte Flutter).
  3. Descarrega el fitxer `google-services.json` i col·loca'l al directori `android/app`.
  4. Per a iOS, fes clic a "Registrar aplicació" i segueix les indicacions. Descarrega el fitxer `GoogleService-Info.plist` i afegeix-lo al directori `ios/Runner` del teu projecte Flutter.

Pas 3: Configura Firebase al teu projecte Flutter

  1. Obre el fitxer pubspec.yaml i afegeix les dependències de Firebase:

    dependencies: 
      firebase_core: ^latest_version 
      firebase_auth: ^latest_version 
      cloud_firestore: ^latest_version
  2. Executa el comandament `flutter pub get` al terminal per instal·lar les noves dependències.

Pas 4: Inicialitza Firebase a la teva app Flutter

  1. Importa els paquets de Firebase al teu `main.dart`:

    import 'package:firebase_core/firebase_core.dart';
  2. Inicialitza Firebase a la funció principal:

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

Pas 5: Utilitza els serveis de Firebase a la teva aplicació Flutter

Autenticació

 

  1. Importa els paquets necessaris:

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

    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 els paquets necessaris:

    import 'package:cloud_firestore/cloud_firestore.dart';
  2. Fes servir Firestore al teu codi:

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

Pas 6: Comprova la teva integració amb Firebase

Executa la teva aplicació Flutter i assegura't que Firebase s'ha inicialitzat sense errors. Prova les funcions d'autenticació i Firestore per confirmar la seva funcionalitat.

¡Felicitats! Has integrat amb èxit Firebase al teu projecte Flutter. Això estableix les bases per incorporar diversos serveis de Firebase a la teva aplicació per millorar la seva funcionalitat.

⚡️ Aconsegueix la subvenció del Kit Digital per digitalitzar el teu negoci. Saber-ne més.