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

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

ধাপ ১ : একটি ফায়ারবেস প্রজেক্ট তৈরি করুন এবং আপনার অ্যাপটি রেজিস্টার করুন।

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

ফায়ারবেস প্রজেক্ট এবং প্রজেক্টে অ্যাপ যুক্ত করার সেরা পদ্ধতি সম্পর্কে আরও জানতে “Understand Firebase Projects” দেখুন।

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

ধাপ ২ : SDK ইনস্টল করুন এবং Firebase চালু করুন।

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

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

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

    npm install firebase

  2. Initialize Firebase in your app and create a Firebase App object:

    import { initializeApp } from 'firebase/app';

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

const app = initializeApp(firebaseConfig);

    একটি Firebase App হলো একটি কন্টেইনার-সদৃশ অবজেক্ট যা সাধারণ কনফিগারেশন সংরক্ষণ করে এবং Firebase সার্ভিসগুলোর মধ্যে অথেনটিকেশন শেয়ার করে। আপনার কোডে একটি Firebase App অবজেক্ট ইনিশিয়ালাইজ করার পর, আপনি Firebase সার্ভিসগুলো যোগ করতে এবং ব্যবহার শুরু করতে পারেন।

    আপনার অ্যাপে যদি সার্ভার-সাইড রেন্ডারিং (SSR) ভিত্তিক ডাইনামিক ফিচার থাকে, তাহলে সার্ভার রেন্ডারিং এবং ক্লায়েন্ট রেন্ডারিং উভয় পর্যায়েই আপনার কনফিগারেশন যেন অপরিবর্তিত থাকে, তা নিশ্চিত করার জন্য আপনাকে কিছু অতিরিক্ত পদক্ষেপ নিতে হবে। আপনার সার্ভার লজিকে, সার্ভিস ওয়ার্কার ব্যবহার করে অ্যাপের সেশন ম্যানেজমেন্ট অপ্টিমাইজ করার জন্য FirebaseServerApp ইন্টারফেসটি ইমপ্লিমেন্ট করুন।

ধাপ ৩ : আপনার অ্যাপে Firebase অ্যাক্সেস করুন

ফায়ারবেস পরিষেবাগুলি (যেমন Cloud Firestore , Authentication , Realtime Database , Remote Config এবং আরও অনেক কিছু) স্বতন্ত্র সাব-প্যাকেজের মধ্যে ইম্পোর্ট করার জন্য উপলব্ধ।

নিচের উদাহরণটিতে দেখানো হয়েছে, কীভাবে আপনি Cloud Firestore লাইট এসডিকে ব্যবহার করে ডেটার একটি তালিকা পুনরুদ্ধার করতে পারেন।

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-এর সাথে মডিউল বান্ডলার ব্যবহার বিষয়ক আমাদের নির্দেশিকাটি দেখুন।

ওয়েবের জন্য উপলব্ধ ফায়ারবেস পরিষেবা

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

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

১. Firebase AI Logic পূর্বে " Vertex AI in Firebase " নামে পরিচিত ছিল এবং এর প্যাকেজটি ছিল firebase/vertexai ।

পরবর্তী পদক্ষেপ

ফায়ারবেস সম্পর্কে জানুন: