این راهنما را دنبال کنید تا از Firebase JavaScript SDK در برنامه وب خود یا به عنوان یک کلاینت برای دسترسی کاربر نهایی، به عنوان مثال، در دسکتاپ Node.js یا برنامه IoT استفاده کنید.
مرحله 1 : یک پروژه Firebase ایجاد کنید و برنامه خود را ثبت کنید
قبل از اینکه بتوانید Firebase را به برنامه جاوا اسکریپت خود اضافه کنید، باید یک پروژه Firebase ایجاد کنید و برنامه خود را در آن پروژه ثبت کنید. هنگامی که برنامه خود را در Firebase ثبت می کنید، یک شی پیکربندی Firebase دریافت می کنید که از آن برای اتصال برنامه خود به منابع پروژه Firebase خود استفاده می کنید.
برای کسب اطلاعات بیشتر درباره پروژههای Firebase و بهترین روشها برای افزودن برنامهها به پروژهها، از Understand Firebase Projects دیدن کنید.
اگر قبلاً پروژه جاوا اسکریپت ندارید و فقط میخواهید یک محصول Firebase را امتحان کنید، میتوانید یکی از نمونههای شروع سریع ما را دانلود کنید.
مرحله 2 : SDK را نصب کرده و Firebase را مقداردهی اولیه کنید
این صفحه دستورالعملهای راهاندازی برای API مدولار Firebase JS SDK را شرح میدهد که از قالب ماژول جاوا اسکریپت استفاده میکند.
این گردش کار از npm استفاده میکند و به بستهکنندههای ماژول یا ابزارهای چارچوب جاوا اسکریپت نیاز دارد، زیرا API ماژولار برای کار با بستهکنندههای ماژول برای حذف کدهای استفاده نشده (درخت تکان دادن) و کاهش اندازه SDK بهینه شده است.
Firebase را با استفاده از npm نصب کنید:
npm install firebase
Firebase را در برنامه خود راه اندازی کنید و یک شی Firebase App ایجاد کنید:
import { initializeApp } from 'firebase/app'; // TODO: Replace the following with your app's Firebase project configuration const firebaseConfig = { //... }; const app = initializeApp(firebaseConfig);
برنامه Firebase یک شی کانتینر مانند است که پیکربندی مشترک را ذخیره میکند و احراز هویت را در سرویسهای Firebase به اشتراک میگذارد. پس از اینکه یک شیء Firebase App را در کد خود مقداردهی کردید، می توانید خدمات Firebase را اضافه کرده و شروع به استفاده از آن کنید.
اگر برنامه شما دارای ویژگیهای پویا مبتنی بر رندر سمت سرور (SSR) است، باید اقدامات بیشتری را انجام دهید تا مطمئن شوید که پیکربندی شما در سراسر رندر سرور و پاسهای رندر کلاینت ادامه دارد. در منطق سرور خود، رابط
FirebaseServerApp
را برای بهینه سازی مدیریت جلسه برنامه خود با کارکنان خدمات پیاده سازی کنید.
مرحله 3 : در برنامه خود به 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 project 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; }
مرحله 4 : از یک بسته ماژول (webpack/Rollup) برای کاهش اندازه استفاده کنید
Firebase Web SDK برای کار با بستهکنندههای ماژول برای حذف هرگونه کد استفاده نشده (درخت تکان دادن) طراحی شده است. ما به شدت توصیه می کنیم از این رویکرد برای برنامه های تولیدی استفاده کنید. ابزارهایی مانند Angular CLI ، Next.js ، Vue CLI ، یا Create React App بهطور خودکار دستهبندی ماژولها را برای کتابخانههای نصبشده از طریق npm و وارد شده به پایگاه کد شما مدیریت میکنند.
برای اطلاعات بیشتر به راهنمای ما در استفاده از باندلرهای ماژول با Firebase مراجعه کنید.
خدمات Firebase در دسترس برای وب
اکنون که برای استفاده از Firebase راه اندازی شده اید، می توانید شروع به اضافه کردن و استفاده از یکی از سرویس های موجود Firebase زیر در برنامه وب خود کنید.
دستورات زیر نحوه وارد کردن کتابخانه های Firebase نصب شده به صورت محلی با npm
را نشان می دهد. برای گزینههای واردات جایگزین، به مستندات کتابخانههای موجود مراجعه کنید.
مراحل بعدی
درباره Firebase بیاموزید:
نمونه برنامه های Firebase را کاوش کنید.
با Firebase Web Codelab تجربه عملی داشته باشید.
کد منبع باز را در GitHub کاوش کنید.
محیط های پشتیبانی شده برای Firebase JavaScript SDK را مرور کنید.
با کتابخانههای منبع باز اضافی که توسط Firebase نگهداری میشوند، مانند AngularFire ، RxFire ، و FirebaseUI برای وب ، سرعت توسعه خود را افزایش دهید.
برای راه اندازی برنامه خود آماده شوید:
- هشدارهای بودجه را برای پروژه خود در کنسول Google Cloud تنظیم کنید.
- داشبورد استفاده و صورتحساب را در کنسول Firebase نظارت کنید تا تصویری کلی از استفاده از پروژه خود در چندین سرویس Firebase داشته باشید.
- چک لیست راه اندازی Firebase را مرور کنید.