افزودن Firebase به پروژه جاوا اسکریپت

این راهنما را دنبال کنید تا از کیت توسعه نرم‌افزار Firebase JavaScript در برنامه وب خود یا به‌عنوان کارخواه برای دسترسی کاربر نهایی، برای مثال، در برنامه IoT یا Node.js رایانه استفاده کنید.

مرحله ۱: ایجاد پروژه Firebase و ثبت برنامه

قبل‌از اینکه بتوانید Firebase را به برنامه JavaScript خود اضافه کنید، باید پروژه Firebase ایجاد کنید و برنامه‌تان را در آن پروژه ثبت کنید. وقتی برنامه‌تان را در Firebase ثبت می‌کنید، یک شیء پیکربندی Firebase دریافت خواهید کرد که از آن برای متصل کردن برنامه‌تان به منابع پروژه Firebase استفاده خواهید کرد.

برای کسب اطلاعات بیشتر درباره پروژه‌های Firebase و روال‌های مطلوب برای افزودن برنامه‌ها به پروژه‌ها، به آشنایی با پروژه‌های Firebase مراجعه کنید.

اگر ازقبل پروژه JavaScript ندارید و فقط می‌خواهید محصول Firebase را امتحان کنید، می‌توانید یکی از نمونه‌های شروع سریع ما را بارگیری کنید.

مرحله ۲: نصب کیت توسعه نرم‌افزار و مقداردهی اولیه Firebase

این صفحه دستورالعمل‌های راه‌اندازی میانای برنامه‌سازی کاربردی پیمانه‌ای را برای Firebase JavaScript SDK شرح می‌دهد که از قالب پیمانه جاوا اسکریپت استفاده می‌کند.

این گردش کار از npm استفاده می‌کند و به ابزارهای چارچوب جاوا اسکریپت یا بسته‌بندی‌کننده‌های ماژول نیاز دارد زیرا API مدولار برای کار با بسته‌بندی‌کننده‌های ماژول بهینه‌سازی شده است تا کدهای استفاده‌نشده را حذف کند (tree-shaking) و اندازه SDK را کاهش دهد.

  1. Firebase را بااستفاده از npm نصب کنید:

    npm install firebase

  2. Firebase را در برنامه‌تان مقداردهی اولیه کنید و یک شیء Firebase App ایجاد کنید:

    import { initializeApp } from 'firebase/app';

// TODO: Replace the following with your app's Firebase configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);

    «برنامه Firebase» شیئی شبیه به محفظه است که پیکربندی مشترک را ذخیره می‌کند و اصالت‌سنجی را در سراسر سرویس‌های Firebase هم‌رسانی می‌کند. پس‌از مقداردهی اولیه شیء «برنامه Firebase» در کدتان، می‌توانید سرویس‌های Firebase را اضافه کنید و استفاده از آن‌ها را شروع کنید.

    اگر برنامه‌تان شامل ویژگی‌های پویا براساس پردازش سمت سرور (SSR) است، باید چند مرحله اضافی را انجام دهید تا مطمئن شوید پیکربندی‌تان در پردازش سرور و پردازش کلاینت حفظ می‌شود. در منطق سرور، میانای FirebaseServerApp را پیاده‌سازی کنید تا مدیریت جلسه برنامه‌تان را با کارگران سرویس بهینه‌سازی کنید.

مرحله ۳: دسترسی به Firebase در برنامه

سرویس‌های Firebase (مانند Cloud Firestore، Authentication، Realtime Database، Remote Config، و غیره) برای وارد کردن در زیربسته‌های جداگانه دردسترس هستند.

مثال زیر نشان می‌دهد که چگونه می‌توانید از Cloud Firestore Lite SDK برای بازیابی فهرست داده‌ها استفاده کنید.

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore/lite';
// Follow this pattern to import other Firebase services
// import { } from 'firebase/<service>';

// TODO: Replace the following with your app's Firebase configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);
const db = getFirestore(app);

// Get a list of cities from your database
async function getCities(db) {
  const citiesCol = collection(db, 'cities');
  const citySnapshot = await getDocs(citiesCol);
  const cityList = citySnapshot.docs.map(doc => doc.data());
  return cityList;
}

مرحله ۴: استفاده از بسته‌بندی‌کننده ماژول (webpack/Rollup) برای کاهش اندازه

Firebase JavaScript SDK طوری طراحی شده است که با بسته‌بندهای واحد کار کند تا هرگونه کد استفاده‌نشده را حذف کند (tree-shaking). قویاً توصیه می‌کنیم از این رویکرد برای برنامه‌های تولید استفاده کنید. ابزارهایی مانند Angular CLI، Next.js، Vue CLI، یا Create React App به‌طور خودکار بسته‌بندی ماژول را برای کتابخانه‌های نصب‌شده ازطریق npm و واردشده به پایگاه کد شما مدیریت می‌کنند.

برای اطلاعات بیشتر، راهنمای ما را ببینید استفاده از بسته‌بندی‌های ماژول با Firebase.

سرویس‌های Firebase دردسترس برای وب

اکنون که برای استفاده از Firebase آماده شده‌اید، می‌توانید هرکدام از سرویس‌های Firebase زیر را که دردسترس است به برنامه وب خود اضافه کنید و از آن استفاده کنید.

فرمان‌های زیر نحوه وارد کردن کتابخانه‌های Firebase نصب‌شده به‌صورت محلی با npm را نشان می‌دهد. برای گزینه‌های وارد کردن جایگزین، اسناد کتابخانه‌های دردسترس را ببینید.

۱ Firebase AI Logic قبلاً «Vertex AI in Firebase» با بسته firebase/vertexai نامیده می‌شد.

۲ Firebase SQL Connect قبلاً «Firebase Data Connect» نامیده می‌شد.

مراحل بعدی

آشنایی با Firebase: