Firebaseを使ってGoogle認証?ログインするコード

firebaseの初期設定

import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';
import { GoogleAuthProvider } from 'firebase/auth/web-extension';

const firebaseConfig = {
  apiKey: import.meta.env.VITE_FIREBASE_API_KEY as string,
  authDomain: import.meta.env.VITE_FIREBASE_AUTH_DOMAIN as string,
  projectId: import.meta.env.VITE_FIREBASE_PROJECT_ID as string,
  storageBucket: import.meta.env.VITE_FIREBASE_STORAGE_BUCKET as string,
  messagingSenderId: import.meta.env.VITE_FIREBASE_MESSAGING_SENDER_ID as string,
  appId: import.meta.env.VITE_FIREBASE_APP_ID as string,
};

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const googleProvider = new GoogleAuthProvider();

export { app, auth, googleProvider };

ログイン管理するためのuseState

    import { User } from 'firebase/auth';
    import { useState } from 'react';

    const [isLogin, setIsLogin] = useState<boolean>(false);
    const [user, setUser] = useState<User | null>(null);

ログインするコード

    const handleLogIn = async () => {
      const result = await signInWithPopup(auth, googleProvider);
      setUser(result.user);
      setIsLogin(true);
    }

ログアウトするコード

    const handleLogOut = async () => {
      await signOut(auth);
      setUser(null);
      setIsLogin(false);
    }

これだけ
簡単だね。

実際に使う時は例外処理とか使ってユーザーにお知らせしたりするようにしてね