إعداد مشروع Firebase ودمجه مع Flutter

إعداد مشروع Firebase ودمجه مع Flutter

Firebase هي منصة تطوير تطبيقات الجوال والويب من Google؛ توفر مجموعة من خدمات الواجهة الخلفية — المصادقة، وقواعد البيانات الفورية، والتخزين السحابي، والتحليلات، وغيرها — دون الحاجة إلى إدارة بنية تحتية للخادم. في هذا الدرس ستتعلم كيفية إنشاء مشروع Firebase وتسجيل تطبيقَي Android وiOS وضبط ملفات الاعتماد المطلوبة وتهيئة Firebase في مشروع Flutter باستخدام FlutterFire CLI وحزمة firebase_core.

الخطوة الأولى: إنشاء مشروع Firebase

كل تطبيق مدعوم بـ Firebase يبدأ بـ مشروع Firebase الذي يعمل حاوية مشتركة لخدماتك وتطبيقاتك.

• افتح Firebase Console على console.firebase.google.com وسجّل الدخول بحساب Google.
• انقر Add project، أدخل اسم المشروع (مثلاً my_flutter_app)، واختر ما إذا كنت تريد تفعيل Google Analytics.
• انتظر اكتمال التجهيز، ثم انقر Continue للوصول إلى لوحة المشروع.

الخطوة الثانية: تسجيل تطبيق Android

لربط إصدار Flutter الخاص بك على Android بـ Firebase، يجب تسجيل تطبيق Android وتنزيل ملف الإعداد.

• في لوحة المشروع انقر أيقونة Android لبدء معالج الإعداد.
• أدخل اسم حزمة Android كما يظهر تماماً في android/app/build.gradle ضمن applicationId (مثلاً com.example.myflutterapp).
• اختيارياً أدخل اسم التطبيق وشهادة التوقيع SHA-1 (مطلوبة لـ Google Sign-In والروابط الديناميكية).
• انقر Register app، ثم نزّل google-services.json وضعه في مجلد android/app/.

الخطوة الثالثة: تسجيل تطبيق iOS

يتبع تسجيل iOS المعالج نفسه لكنه يتطلب Bundle ID بدلاً من اسم الحزمة.

• انقر Add app → iOS في لوحة المشروع.
• أدخل Bundle ID الخاص بـ iOS من ios/Runner.xcodeproj/project.pbxproj (مثلاً com.example.myFlutterApp).
• نزّل GoogleService-Info.plist واسحبه إلى مجلد ios/Runner/ داخل Xcode — ليس مجلد نظام الملفات فحسب — حتى يضمه Xcode في هدف البناء.

الخطوة الرابعة: تثبيت FlutterFire CLI

تُؤتمت FlutterFire CLI الأجزاء المرهقة من إعداد Firebase: تقرأ مشروع Firebase، تكتشف التطبيقات المسجّلة، وتولّد ملف firebase_options.dart الذي تستهلكه firebase_core في وقت التشغيل.

# ثبّت Firebase CLI أولاً (يستلزمه FlutterFire CLI)
npm install -g firebase-tools

# سجّل الدخول إلى Firebase
firebase login

# ثبّت FlutterFire CLI كأداة Dart عالمية
dart pub global activate flutterfire_cli

# شغّل أمر الإعداد من جذر مشروع Flutter
flutterfire configure --project=my-flutter-app

سيطلب منك أمر flutterfire configure اختيار المنصات التي تريد دعمها، ثم يولّد lib/firebase_options.dart الذي يحتوي على صنف DefaultFirebaseOptions مع جميع بيانات الاعتماد الخاصة بكل منصة في مكان واحد.

الخطوة الخامسة: إضافة firebase_core وتهيئة Firebase

افتح pubspec.yaml وأضف تبعية firebase_core، ثم شغّل flutter pub get.

dependencies:
  flutter:
    sdk: flutter
  firebase_core: ^3.6.0   # استخدم أحدث إصدار مستقر

ثم هيّئ Firebase في main.dart قبل runApp(). بما أن Firebase.initializeApp() عملية غير متزامنة يجب جعل main دالة async واستدعاء WidgetsFlutterBinding.ensureInitialized() أولاً.

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

Future<void> main() async {
  // يجب استدعاؤها قبل أي عمل غير متزامن في main()
  WidgetsFlutterBinding.ensureInitialized();

  // تهيئة Firebase باستخدام الخيارات المولَّدة
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Firebase Demo',
      home: Scaffold(
        appBar: AppBar(title: const Text('Firebase جاهز')),
        body: const Center(
          child: Text('تم تهيئة Firebase بنجاح!'),
        ),
      ),
    );
  }
}

التحقق من الإعداد

شغّل flutter run (مع توصيل جهاز أو محاكي). إذا رأيت شريط التطبيق Firebase جاهز ولا توجد أخطاء حمراء في وحدة التحكم، فقد اتصل Firebase بنجاح. يمكنك أيضاً فتح Firebase Console، والانتقال إلى Project Overview، والتأكد من تحديث طوابع وقت آخر نشاط عند تشغيل التطبيق.

ملخص

في هذا الدرس تعلمت كيفية:

• إنشاء مشروع Firebase في Firebase Console.
• تسجيل تطبيقَي Android وiOS وتنزيل ملفات الاعتماد الخاصة بهما (google-services.json / GoogleService-Info.plist).
• استخدام FlutterFire CLI لتوليد firebase_options.dart تلقائياً.
• إضافة firebase_core إلى pubspec.yaml واستدعاء Firebase.initializeApp() في main().

مع تهيئة Firebase، أصبحت جاهزاً لدمج أي خدمة من خدمات Firebase — Firestore والمصادقة والتخزين وغيرها — في تطبيق Flutter الخاص بك.