আপনার JavaScript প্রোজেক্টে Firebase যোগ করুন

আপনার ওয়েব অ্যাপে Firebase JavaScript SDK ব্যবহার করতে অথবা ব্যবহারকারীর অ্যাক্সেসের জন্য ক্লায়েন্ট হিসেবে, যেমন, Node.js ডেস্কটপ বা IoT অ্যাপ্লিকেশনে ব্যবহার করতে এই নির্দেশিকা অনুসরণ করুন।

ধাপ ১: Firebase প্রোজেক্ট তৈরি করে আপনার অ্যাপ রেজিস্টার করুন

আপনার JavaScript অ্যাপে Firebase যোগ করার আগে, আপনাকে একটি Firebase প্রোজেক্ট তৈরি করতে হবে এবং সেই প্রোজেক্টে আপনার অ্যাপ রেজিস্টার করতে হবে। Firebase-এ আপনার অ্যাপ রেজিস্টার করলে, আপনি একটি Firebase কনফিগারেশন অবজেক্ট পাবেন যা আপনি Firebase প্রোজেক্ট রিসোর্সের সাথে আপনার অ্যাপ কানেক্ট করতে ব্যবহার করবেন।

Firebase প্রোজেক্ট এবং প্রোজেক্টে অ্যাপ যোগ করার পেশাদার পদ্ধতি সম্পর্কে আরও জানতে Firebase প্রোজেক্ট সম্পর্কে জানুন লিঙ্ক দেখুন।

আপনার যদি আগে থেকে কোনও JavaScript প্রোজেক্ট না থাকে এবং আপনি শুধু Firebase প্রোডাক্ট ব্যবহার করে দেখতে চান, তাহলে আমাদের কুইকস্টার্ট স্যাম্পেল ডাউনলোড করতে পারেন।

ধাপ ২: SDK ইনস্টল ও Firebase শুরু করা

এই পৃষ্ঠায় Firebase JavaScript SDK-এর জন্য মডিউলার API সেট-আপ করার নির্দেশাবলী বর্ণনা করা হয়েছে, যা JavaScript মডিউল ফর্ম্যাট ব্যবহার করে।

এই ওয়ার্কফ্লো npm ব্যবহার করে এবং এর জন্য মডিউল বান্ডলার বা JavaScript ফ্রেমওয়ার্ক টুলিং প্রয়োজন কারণ মডিউলার API, মডিউল বান্ডলারের সাথে কাজ করার জন্য অপ্টিমাইজ করা হয়েছে যাতে অব্যবহৃত কোড (ট্রি-শেকিং) বাদ দেওয়া যায় এবং SDK-এর সাইজ কমানো যায়।

  1. npm ব্যবহার করে Firebase ইনস্টল করুন:

    npm install firebase

  2. আপনার অ্যাপে Firebase শুরু করুন এবং একটি Firebase অ্যাপ অবজেক্ট তৈরি করুন:

    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-কে এমনভাবে ডিজাইন করা হয়েছে যাতে এটি মডিউল বান্ডলারের সাথে কাজ করে এবং অব্যবহৃত কোড (ট্রি-শেকিং) সরিয়ে দেয়। প্রোডাকশন অ্যাপের জন্য এই পদ্ধতি ব্যবহার করার ব্যাপারে আমরা বিশেষভাবে সাজেস্ট করি। Angular CLI, Next.js, Vue CLI বা Create React App-এর মতো টুল npm-এর মাধ্যমে ইনস্টল করা এবং আপনার কোডবেসে ইমপোর্ট করা লাইব্রেরির জন্য মডিউল বান্ডলিং অটোমেটিক ম্যানেজ করে।

আরও তথ্যের জন্য, আমাদের গাইড Firebase-এর সাথে মডিউল বান্ডলার ব্যবহার করা দেখুন।

ওয়েবের জন্য উপলভ্য Firebase পরিষেবা

এখন আপনি Firebase ব্যবহার করার জন্য সেট-আপ করেছেন, আপনি আপনার ওয়েব অ্যাপে নিম্নলিখিত উপলভ্য Firebase পরিষেবাগুলির মধ্যে যেকোনও একটি যোগ করা এবং ব্যবহার করা শুরু করতে পারেন।

npm-এর মাধ্যমে লোকাল ডিভাইসে ইনস্টল করা Firebase লাইব্রেরি কীভাবে ইমপোর্ট করতে হয় তা নিম্নলিখিত কমান্ড থেকে জানতে পারবেন। ইমপোর্ট করার বিকল্পের জন্য, উপলভ্য লাইব্রেরি ডকুমেন্টেশন দেখুন।

১ Firebase AI Logic-এর আগে নাম ছিল "Vertex AI in Firebase" এবং প্যাকেজ ছিল firebase/vertexai।

২ Firebase SQL Connect-এর আগে নাম ছিল "Firebase Data Connect"।

পরবর্তী ধাপ

Firebase সম্পর্কে জানুন: