مقدمة في Firebase — Firebase
مقدمة في Firebase
Firebase منصة من Google تقدم خدمات خلفية جاهزة: Firestore (قاعدة مستندات)، Authentication، Storage، Cloud Functions، Hosting، والإشعارات والتحليلات. التطبيق يتصل بها مباشرة من الواجهة، والحماية تأتي من قواعد الأمان (الدرس الأخير).
Firestore مقابل SQL
SQL: جدول ← صفوف ← أعمدة ثابتة
Firestore: مجموعة (collection) ← وثائق (documents) ← حقول مرنة، ويمكن أن تحتوي مجموعات فرعية
users/{uid}/orders/{orderId}| | SQL (PostgreSQL) | Firestore |
|---|---|---|
| المخطط | صارم | مرن (المسؤولية عليك) |
| الربط (JOIN) | ✅ | ❌ — تُكرَّر البيانات أو تُقرأ على مراحل |
| الاستعلامات | أي شرط تقريباً | محدودة وتحتاج فهارس لكل تركيبة شروط |
| الوقت الحقيقي | إضافي | مدمج |
| التسعير | حسب الخادم/الحجم | لكل عملية قراءة وكتابة — التصميم السيئ مكلف |
SDK المعياري (v9 فما فوق)
// npm install firebase
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import { getAuth } from "firebase/auth";
const firebaseConfig = {
apiKey: import.meta.env.VITE_FIREBASE_API_KEY,
authDomain: "my-app.firebaseapp.com",
projectId: "my-app",
storageBucket: "my-app.appspot.com",
};
export const app = initializeApp(firebaseConfig);
export const db = getFirestore(app);
export const auth = getAuth(app);الصيغة المعيارية (دوال مستقلة تُستورد) تسمح لأدوات البناء بحذف ما لا تستخدمه. الشروحات القديمة تستخدم firebase.firestore().collection(...) (v8) — لا تخلط الأسلوبين.
هل apiKey سر؟
لا: إعدادات Firebase للويب تعريفية وتصل للمتصفح بالضرورة. الحماية الحقيقية: قواعد الأمان، و App Check، وتقييد المفتاح بنطاقاتك في Google Cloud Console. لكن مفاتيح حساب الخدمة (Admin SDK) أسرار حقيقية للخادم فقط.
نمذجة البيانات: صمم حسب الشاشات
في Firestore تسأل "ماذا تعرض الشاشة؟" ثم تصمم الوثائق لتُقرأ بأقل عدد قراءات — حتى لو كررت بعض البيانات (اسم الكاتب داخل المنشور مثلاً).
تمرين
أنشئ مشروع Firebase، وفعّل Firestore في وضع الإنتاج (القواعد ترفض كل شيء افتراضياً)، واربط تطبيق ويب بالإعدادات أعلاه.
// تثبيت Firebase
// npm install firebase
import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs, addDoc } from 'firebase/firestore';
// إعداد Firebase
const firebaseConfig = {
apiKey: "YOUR_API_KEY",
authDomain: "YOUR_PROJECT.firebaseapp.com",
projectId: "YOUR_PROJECT_ID",
storageBucket: "YOUR_PROJECT.appspot.com",
messagingSenderId: "123456789",
appId: "YOUR_APP_ID"
};
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
// ===== قراءة البيانات =====
const querySnapshot = await getDocs(collection(db, 'users'));
querySnapshot.forEach((doc) => {
console.log(doc.id, '=>', doc.data());
});
// ===== إضافة بيانات =====
const docRef = await addDoc(collection(db, 'users'), {
name: 'أحمد',
email: 'ahmed@mail.com',
createdAt: new Date()
});
console.log('Document ID:', docRef.id);اختبر فهمك