📌 Firebase কী এবং কেন ব্যবহার করবো?

• User Authentication (Login / Signup)
• Realtime Database & Firestore
• Cloud Storage (Image / File Upload)
• Push Notification
• Server ছাড়াই Backend তৈরি

📁 File Based Folder Structure (TypeScript)

src/
 ├── firebase/
 │    ├── firebase.config.ts
 │    ├── auth.ts
 │    ├── firestore.ts
 │    └── storage.ts
 │
 ├── screens/
 │    ├── LoginScreen.tsx
 │    └── HomeScreen.tsx
 │
 ├── navigation/
 │    └── AppNavigator.tsx
 │
 └── App.tsx
    

👉 Firebase related সব ফাইল আলাদা firebase ফোল্ডারে রাখা হচ্ছে। এটাকে বলে File Based Architecture।

⚙️ Step 1: Firebase Project Create করা

1. https://console.firebase.google.com এ যান
2. ➕ Add Project ক্লিক করুন
3. Project Name দিন
4. Authentication & Firestore Enable করুন

📦 Step 2: Required Packages Install করা

npm install firebase
    

👉 Expo ও React Native CLI — দুই ক্ষেত্রেই এই প্যাকেজ ব্যবহার করা যায়।

🔧 Step 3: Firebase Configuration File

📄 src/firebase/firebase.config.ts

import { initializeApp } from "firebase/app";

const firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_PROJECT.firebaseapp.com",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_PROJECT.appspot.com",
  messagingSenderId: "XXXX",
  appId: "XXXX"
};

export const firebaseApp = initializeApp(firebaseConfig);
    

🔐 Step 4: Firebase Authentication Setup

📄 src/firebase/auth.ts

import { getAuth } from "firebase/auth";
import { firebaseApp } from "./firebase.config";

export const auth = getAuth(firebaseApp);
    

👉 এই ফাইল থেকে আমরা পুরো অ্যাপে authentication ব্যবহার করবো।

👤 Step 5: Example Login Screen (TypeScript)

import { View, Text, Button } from "react-native";
import { signInWithEmailAndPassword } from "firebase/auth";
import { auth } from "../firebase/auth";

const LoginScreen = () => {
  const loginUser = () => {
    signInWithEmailAndPassword(auth, "test@gmail.com", "123456")
      .then(() => alert("Login Successful"))
      .catch(err => alert(err.message));
  };

  return (
    
      Login Screen
      
    
  );
};

export default LoginScreen;
    

✅ Output কী হবে?