هنگام توسعه برنامه وب بااستفاده از Firebase، ممکن است با مفاهیم ناآشنا یا حوزه‌هایی مواجه شوید که برای تصمیم‌گیری درست برای پروژه‌تان به اطلاعات بیشتری نیاز داشته باشید. هدف این صفحه پاسخ دادن به این سؤالات یا راهنمایی شما به منابعی برای کسب اطلاعات بیشتر است.
اگر درباره موضوعی سؤال دارید که در این صفحه پوشش داده نشده است، به یکی از انجمن‌های آنلاین ما مراجعه کنید. همچنین این صفحه را به‌طور دوره‌ای با موضوعات جدید به‌روز می‌کنیم، بنابراین دوباره سر بزنید تا ببینید موضوعی را که می‌خواهید درباره آن اطلاعات کسب کنید اضافه کرده‌ایم یا نه.
نسخه‌های کیت توسعه نرم‌افزار: فضای نامی و مدولار
Firebase دو سطح میانای برنامه‌سازی کاربردی برای برنامه‌های وب ارائه می‌دهد:
- جاوا اسکریپت - فضای نامی. این میانای جاوا اسکریپت است که Firebase سال‌ها از آن نگهداری کرده است و برای توسعه‌دهندگان وب با برنامه‌های قدیمی‌تر Firebase آشنا است. چون namespaced API از پشتیبانی مداوم ویژگی‌های جدید بهره‌مند نمی‌شود، اکثر برنامه‌های جدید باید به‌جای آن از modular API استفاده کنند.
- جاوا اسکریپت - مدولار. این کیت توسعه نرم‌افزار براساس رویکردی مدولار است که اندازه کیت توسعه نرم‌افزار را کاهش می‌دهد و با ابزارهای ساخت جاوا اسکریپت مدرن مانند webpack یا Rollup کارایی بیشتری ارائه می‌دهد.
modular API به‌خوبی با ابزارهای ساخت ادغام می‌شود که کدهایی را که در برنامه شما استفاده نمی‌شوند حذف می‌کنند، فرایندی که به‌عنوان «tree-shaking» شناخته می‌شود. برنامه‌هایی که با این کیت توسعه نرم‌افزار ساخته شده‌اند از کاهش قابل‌توجه حجم بهره‌مند می‌شوند. namespaced API، اگرچه به‌عنوان یک ماژول دردسترس است، اما ساختار کاملاً ماژولار ندارد و همان میزان کاهش اندازه را ارائه نمی‌دهد.
اگرچه اکثر modular API از همان الگوهای namespaced API پیروی می‌کند،
سازماندهی کد متفاوت است. به‌طور کلی، namespaced API
به‌سمت الگوی سرویس و فضای نام گرایش دارد، درحالی‌که modular API به‌سمت
توابع گسسته گرایش دارد. برای مثال، زنجیره نقطه‌ای namespaced API، مانند
firebaseApp.auth()، در modular API با یک تابع getAuth() جایگزین می‌شود
که firebaseApp را می‌گیرد و یک نمونه Authentication برمی‌گرداند.
این یعنی برنامه‌های وبی که با namespaced API ایجاد شده‌اند برای بهره‌مندی از طراحی برنامه پیمانه‌ای به بازسازی کد نیاز دارند. برای جزئیات بیشتر، راهنمای ارتقا را ببینید.
جاوا اسکریپت - میانای برنامه‌سازی کاربردی پیمانه‌ای برای برنامه‌های جدید
اگر درحال شروع ادغام جدیدی با Firebase هستید، می‌توانید هنگام افزودن و مقداردهی اولیه کیت توسعه نرم‌افزار، با modular API موافقت کنید.
هنگام توسعه برنامه‌تان، به‌خاطر داشته باشید که کد شما عمدتاً براساس توابع سازماندهی خواهد شد. در میانای برنامه‌سازی کاربردی پیمانه‌ای، سرویس‌ها به‌عنوان اولین شناسه ارسال می‌شوند و سپس تابع از جزئیات سرویس برای انجام بقیه کارها استفاده می‌کند. برای مثال:
import { getAuth, onAuthStateChanged } from "firebase/auth";
const auth = getAuth(firebaseApp);
onAuthStateChanged(auth, user => {
// Check for user status
});
برای مثال‌ها و جزئیات بیشتر، راهنماهای مربوط به هر حوزه محصول و همچنین سند مرجع modular API را ببینید.
روش‌های افزودن کیت‌های توسعه نرم‌افزار وب به برنامه
Firebase کتابخانه‌های جاوا اسکریپت را برای اکثر محصولات Firebase ارائه می‌دهد، ازجمله Remote Config، FCM، و غیره. نحوه افزودن کیت‌های توسعه نرم‌افزار Firebase به برنامه وب به ابزاری که با برنامه‌تان استفاده می‌کنید (مثل بسته‌بندی‌کننده واحد) بستگی دارد.
می‌توانید هرکدام از کتابخانه‌های دردسترس را ازطریق یکی از روش‌های پشتیبانی‌شده به برنامه‌تان اضافه کنید:
- npm (برای بسته‌بندی‌های ماژول)
- CDN (شبکه توزیع محتوا)
برای دستورالعمل‌های راه‌اندازی دقیق، به افزودن Firebase به برنامه جاوا اسکریپت مراجعه کنید. بقیه این بخش حاوی اطلاعاتی است که به شما کمک می‌کند از بین گزینه‌های موجود انتخاب کنید.
npm
با بارگیری بسته Firebase npm (که شامل هر دو بسته مرورگر و Node.js است)، یک نسخه محلی از کیت توسعه نرم‌افزار Firebase دریافت می‌کنید که ممکن است برای برنامه‌های غیرمرورگر مانند برنامه‌های Node.js، React Native، یا Electron لازم باشد. این بارگیری شامل بسته‌های Node.js و React Native به‌عنوان گزینه‌ای برای برخی‌از بسته‌ها است. دسته‌های Node.js برای مرحله پردازش سمت سرور (SSR) چارچوب‌های SSR ضروری هستند.
استفاده از npm با بسته‌بندی‌کننده واحد مانند webpack یا Rollup گزینه‌های بهینه‌سازی را برای «tree-shake» کردن کد استفاده‌نشده و اعمال شبیه‌سازهای مرورگر هدفمند ارائه می‌دهد که می‌تواند ردپای اندازه برنامه‌تان را به‌طور قابل‌توجهی کاهش دهد. پیاده‌سازی این ویژگی‌ها ممکن است کمی پیچیدگی به پیکربندی و زنجیره ساخت شما اضافه کند، اما ابزارهای مختلف رابط خط فرمان اصلی می‌توانند به کاهش آن کمک کنند. این ابزارها شامل Angular، React، Vue، Next، و غیره می‌شود.
به‌طور خلاصه:
- بهینه‌سازی ارزشمندی برای اندازه برنامه ارائه می‌دهد
- ابزار قدرتمندی برای مدیریت کردن واحدها دردسترس است
- برای SSR با Node.js لازم است
CDN (شبکه توزیع محتوا)
افزودن کتابخانه‌هایی که در CDN مربوط به Firebase ذخیره شده‌اند یک روش ساده برای راه‌اندازی کیت توسعه نرم‌افزار است که ممکن است برای بسیاری از توسعه‌دهندگان آشنا باشد. بااستفاده از CDN برای افزودن کیت‌های توسعه نرم‌افزار، به ابزار ساخت نیاز نخواهید داشت و زنجیره ساخت شما ممکن است درمقایسه با بسته‌بندی‌های ماژول ساده‌تر و کار با آن آسان‌تر باشد. اگر به‌طور خاص نگران اندازه نصب‌شده برنامه‌تان نیستید و الزامات خاصی مانند ترجمه مبدأ به مبدأ از TypeScript ندارید، CDN می‌تواند انتخاب خوبی باشد.
به‌طور خلاصه:
- آشنا و ساده
- مناسب برای زمانی که اندازه برنامه نگرانی اصلی نیست
- زمانی مناسب است که وب‌سایت شما از ابزارهای ساخت استفاده نمی‌کند.
انواع کیت توسعه نرم‌افزار وب Firebase
از کیت توسعه نرم‌افزار وب Firebase می‌توان هم در مرورگر و هم در برنامه‌های Node استفاده کرد. بااین‌حال، چندین محصول در محیط‌های Node دردسترس نیستند. فهرست محیط‌های پشتیبانی‌شده را ببینید.
برخی‌از کیت‌های توسعه نرم‌افزار محصول، انواع مرورگر و Node جداگانه‌ای ارائه می‌دهند که هرکدام در هر دو قالب ESM و CJS ارائه می‌شوند، و برخی‌از کیت‌های توسعه نرم‌افزار محصول حتی انواع Cordova یا React Native را ارائه می‌دهند. کیت توسعه نرم‌افزار وب به‌گونه‌ای پیکربندی شده است که گونه صحیح را براساس پیکربندی ابزار یا محیط شما ارائه دهد و در بیشتر موارد نباید به انتخاب دستی نیاز داشته باشد. همه انواع کیت توسعه نرم‌افزار برای کمک به ساختن برنامه‌های وب یا برنامه‌های کارخواه برای دسترسی کاربر نهایی طراحی شده‌اند، مثلاً در برنامه IoT یا Node.js رایانه. اگر هدفتان راه‌اندازی دسترسی سرپرستی از محیط‌های ممتاز (مانند سرورها) است، به‌جای آن از Firebase Admin SDK استفاده کنید.
تشخیص محیط با بسته‌سازها و چارچوب‌ها
وقتی کیت توسعه نرم‌افزار وب Firebase را بااستفاده از npm نصب می‌کنید، نسخه‌های جاوا اسکریپت و Node.js هر دو نصب می‌شوند. این بسته تشخیص محیطی دقیقی ارائه می‌دهد تا بسته‌های مناسب برای برنامه‌تان فعال شود.
اگر کد شما از دستورات Node.js require استفاده می‌کند، کیت توسعه نرم‌افزار بسته مخصوص Node را پیدا می‌کند. درغیراین‌صورت، تنظیمات بسته‌بند شما باید به‌درستی پیکربندی شود تا فیلد نقطه ورودی صحیح را در فایل package.json شما شناسایی کند (برای مثال، main، browser، یا module). اگر با خطاهای زمان اجرا در کیت توسعه نرم‌افزار مواجه شدید، بررسی کنید تا مطمئن شوید بسته‌بند شما برای اولویت‌بندی نوع صحیح بسته برای محیط شما پیکربندی شده است.
درباره شیء پیکربندی Firebase بیشتر بدانید
برای مقداردهی اولیه Firebase در برنامه‌تان، باید پیکربندی Firebase برنامه‌تان را ارائه دهید. هرزمان بخواهید می‌توانید شیء پیکربندی Firebase را دریافت کنید.
توصیه نمی‌کنیم شیء پیکربندی‌تان را به‌صورت دستی ویرایش کنید، به‌ویژه «گزینه‌های Firebase» الزامی زیر:
apiKey،projectId، وappID. اگر برنامه‌تان را با مقادیر نامعتبر یا مفقود برای این «گزینه‌های Firebase» الزامی مقداردهی اولیه کنید، ممکن است کاربران برنامه‌تان با مشکلات جدی مواجه شوند. استثنای این موردauthDomainاست که می‌توان آن را با دنبال کردن روال‌های مطلوب برای استفاده از signInWithRedirect به‌روز کرد.اگر Google Analytics را در پروژه Firebase خود فعال کرده باشید، شیء پیکربندی شما حاوی فیلد
measurementIdاست. در Analytics صفحه شروع به کار درباره این فیلد بیشتر بدانید.اگر Google Analytics یا Realtime Database را بعداز ایجاد «برنامه وب Firebase» فعال کنید، مطمئن شوید که شیء پیکربندی Firebase که در برنامه‌تان استفاده می‌کنید با مقادیر پیکربندی مرتبط (به‌ترتیب
measurementIdوdatabaseURL) به‌روز شده باشد. هرزمان بخواهید می‌توانید شیء پیکربندی Firebase را دریافت کنید.
در اینجا قالب شیء پیکربندی با همه سرویس‌های فعال‌شده آورده شده است (این مقادیر به‌طور خودکار تکمیل می‌شوند):
var firebaseConfig = { apiKey: "API_KEY", authDomain: "PROJECT_ID.firebaseapp.com", // The value of `databaseURL` depends on the location of the database databaseURL: "https://DATABASE_NAME.firebaseio.com", projectId: "PROJECT_ID", // The value of `storageBucket` depends on when you provisioned your default bucket (learn more) storageBucket: "", messagingSenderId: "SENDER_ID", appId: "APP_ID", // For Firebase JavaScript SDK v7.20.0 and later, `measurementId` is an optional field measurementId: "G-MEASUREMENT_ID", }; PROJECT_ID.firebasestorage.app
کتابخانه‌های دردسترس
گزینه‌های راه‌اندازی تکمیلی
تأخیر در بار کردن کیت‌های توسعه نرم‌افزار Firebase (از CDN)
می‌توانید گنجاندن کیت‌های توسعه نرم‌افزار Firebase را تا زمانی که کل صفحه بار شود
به‌تأخیر بیندازید. اگر از اسکریپت‌های CDN میانای برنامه‌سازی کاربردی پیمانه‌ای با <script type="module"> استفاده می‌کنید،
این رفتار پیش‌فرض است. اگر از دستورگان‌های CDN فضای نام به‌عنوان
مدول استفاده می‌کنید، این مراحل را برای به‌تعویق انداختن بارگیری تکمیل کنید:
پرچم
deferرا به هر برچسبscriptبرای کیت‌های توسعه نرم‌افزار Firebase اضافه کنید، سپس مقداردهی اولیه Firebase را بااستفاده از اسکریپت دوم به‌تعویق بیندازید، برای مثال:<script defer src="https://www.gstatic.com/firebasejs/8.10.1/firebase-app.js"></script> <script defer src="https://www.gstatic.com/firebasejs/8.10.1/firebase-auth.js"></script> <script defer src="https://www.gstatic.com/firebasejs/8.10.1/firebase-firestore.js"></script> // ... <script defer src="./init-firebase.js"></script>فایل
init-firebase.jsایجاد کنید، سپس موارد زیر را در فایل بگنجانید:// TODO: Replace the following with your app's Firebase configuration var firebaseConfig = { // ... }; // Initialize Firebase firebase.initializeApp(firebaseConfig);
استفاده از چند پروژه Firebase در یک برنامه
در بیشتر موارد، فقط باید Firebase را در یک برنامه پیش‌فرض مقداردهی اولیه کنید. می‌توانید از آن برنامه به دو روش معادل به Firebase دسترسی داشته باشید:
Web
import { initializeApp } from "firebase/app"; import { getStorage } from "firebase/storage"; import { getFirestore } from "firebase/firestore"; // Initialize Firebase with a "default" Firebase project const defaultProject = initializeApp(firebaseConfig); console.log(defaultProject.name); // "[DEFAULT]" // Option 1: Access Firebase services via the defaultProject variable let defaultStorage = getStorage(defaultProject); let defaultFirestore = getFirestore(defaultProject); // Option 2: Access Firebase services using shorthand notation defaultStorage = getStorage(); defaultFirestore = getFirestore();
Web
// Initialize Firebase with a "default" Firebase project const defaultProject = firebase.initializeApp(firebaseConfig); console.log(defaultProject.name); // "[DEFAULT]" // Option 1: Access Firebase services via the defaultProject variable let defaultStorage = defaultProject.storage(); let defaultFirestore = defaultProject.firestore(); // Option 2: Access Firebase services using shorthand notation defaultStorage = firebase.storage(); defaultFirestore = firebase.firestore();
اما گاهی اوقات لازم است به‌طور هم‌زمان به چند پروژه Firebase دسترسی داشته باشید. برای مثال، ممکن است بخواهید داده‌ها را از پایگاه داده یک پروژه Firebase بخوانید اما فایل‌ها را در پروژه Firebase دیگری ذخیره کنید. یا شاید بخواهید یک پروژه را اصالت‌سنجی کنید و پروژه دوم را اصالت‌سنجی‌نشده نگه دارید.
Firebase JavaScript SDK به شما امکان می‌دهد چندین پروژه Firebase را در یک برنامه به‌طور هم‌زمان مقداردهی اولیه کنید و از آن‌ها استفاده کنید، به‌طوری‌که هر پروژه از اطلاعات پیکربندی Firebase خودش استفاده کند.
Web
import { initializeApp, getApp } from "firebase/app"; import { getStorage } from "firebase/storage"; import { getFirestore } from "firebase/firestore"; // Initialize Firebase with a default Firebase project initializeApp(firebaseConfig); // Initialize Firebase with a second Firebase project const otherProject = initializeApp(otherProjectFirebaseConfig, "other"); console.log(getApp().name); // "[DEFAULT]" console.log(otherProject.name); // "otherProject" // Use the shorthand notation to access the default project's Firebase services const defaultStorage = getStorage(); const defaultFirestore = getFirestore(); // Use the otherProject variable to access the second project's Firebase services const otherStorage = getStorage(otherProject); const otherFirestore = getFirestore(otherProject);
Web
// Initialize Firebase with a default Firebase project firebase.initializeApp(firebaseConfig); // Initialize Firebase with a second Firebase project const otherProject = firebase.initializeApp(otherProjectFirebaseConfig, "other"); console.log(firebase.app().name); // "[DEFAULT]" console.log(otherProject.name); // "otherProject" // Use the shorthand notation to access the default project's Firebase services const defaultStorage = firebase.storage(); const defaultFirestore = firebase.firestore(); // Use the otherProject variable to access the second project's Firebase services const otherStorage = otherProject.storage(); const otherFirestore = otherProject.firestore();
اجرا کردن سرور وب محلی برای توسعه
اگر درحال ساختن برنامه وب هستید، برخی‌از بخش‌های کیت توسعه نرم‌افزار Firebase JavaScript مستلزم این است که برنامه وب خود را از سرور ارائه دهید نه از سیستم فایل محلی. می‌توانید از Firebase CLI برای اجرای سرور محلی استفاده کنید.
اگر قبلاً Firebase Hosting را برای برنامه‌تان راه‌اندازی کرده‌اید، ممکن است قبلاً چند مرحله زیر را تکمیل کرده باشید.
برای ارائه برنامه وب، از Firebase CLI (ابزار خط فرمان) استفاده خواهید کرد.
برای آشنایی با نحوه نصب CLI یا به‌روزرسانی به جدیدترین نسخه آن، به اسناد Firebase CLI مراجعه کنید.
پروژه Firebase خود را مقداردهی اولیه کنید. فرمان زیر را از ریشه فهرست راهنمای برنامه محلی‌تان اجرا کنید:
firebase init
سرور محلی را برای توسعه راه‌اندازی کنید. دستور زیر را از ریشه فهرست راهنمای برنامه محلی‌تان اجرا کنید:
firebase serve
منابع متن‌باز برای کیت‌های توسعه نرم‌افزار جاوا اسکریپت در Firebase
Firebase از توسعه متن‌باز پشتیبانی می‌کند و ما همیاری‌ها و بازخوردهای انجمن را تشویق می‌کنیم.
کیت‌های توسعه نرم‌افزار جاوا اسکریپت در Firebase
اکثر کیت‌های توسعه نرم‌افزار جاوا اسکریپت در Firebase به‌عنوان کتابخانه‌های متن‌باز در مخزن عمومی GitHub در Firebase توسعه یافته‌اند.
نمونه‌های شروع سریع
Firebase مجموعه‌ای از نمونه‌های شروع سریع را برای اکثر میاناهای برنامه‌سازی کاربردی Firebase در وب نگهداری می‌کند. این شروع‌های سریع را در مخزن شروع سریع Firebase GitHub عمومی ما پیدا کنید. می‌توانید از این شروع‌های سریع به‌عنوان کد نمونه برای استفاده از کیت‌های توسعه نرم‌افزار Firebase استفاده کنید.