Social Authentication

Firebase allows users to sign in with their existing social accounts like Google, GitHub, Facebook, and more.

1. Enable Google Sign-in

1. Go to Authentication > Sign-in method.
2. Add Google as a provider.
3. Configure your project's public-facing name and support email.
4. Save the changes.

2. Implementation (Google)

We use the GoogleAuthProvider and signInWithPopup (or signInWithRedirect).

import { auth } from "../lib/firebase";
import { GoogleAuthProvider, signInWithPopup } from "firebase/auth";

const provider = new GoogleAuthProvider();

const signInWithGoogle = async () => {
  try {
    const result = await signInWithPopup(auth, provider);
    const user = result.user;
    console.log("Logged in with Google:", user.displayName);
  } catch (error) {
    console.error("Social Auth Error:", error.message);
  }
};

3. Other Providers

The process is almost identical for other social providers:

• GitHub: new GithubAuthProvider()
• Facebook: new FacebookAuthProvider()
• Twitter: new TwitterAuthProvider()