Firebase Auth in React Native: Google, Apple, and Email Sign-In All at Once

Last March, I was working on a plant delivery app for a client in Abu Dhabi. They wanted users to sign in with Google, Apple, or email — and they wanted it yesterday. The kicker? No existing tutorial covered all three together without massive config headaches. So here’s how I stitched it all together with Firebase Auth, React Native, and more than a few rounds of trial-and-error.

Setting Up the Fire

First, I created a Firebase project. Simple enough. But the real pain started when installing libraries. Most guides assume you’re using either Google or Apple, but not both. I had to juggle:

• •@react-native-firebase/auth for Firebase basics
• •expo-google-sign-in for Android/iOS Google integration
• •expo-apple-authentication because Expo’s Apple Sign-In library is a different beast

Pro tip: Use Expo SDK 54 (like I did for Greeny Corner). Earlier versions have compatibility issues with Apple Sign-In’s nonce handling. Trust me — I learned this after 3 hours staring at cryptic token errors.

Configuring OAuth Providers

For Google, I enabled "OAuth 2.0 for TV and Limited Input Device" in the Firebase console. Most people skip this step until Firebase throws an error like:

"UNAUTHENTICATED: This request is missing a Firebase ID token."  

Yeah. Add your Android/iOS bundle IDs to the Firebase OAuth restrictions — otherwise, you’ll get phantom auth failures on physical devices.

Apple’s setup was worse. You need:

1. An Apple Developer account (with a company membership, because individual accounts can’t create App IDs with Sign-In enabled)
2. A Service ID pointing to https://www.googleapis.com/robot/v1/metadata/x509/securetoken@system.gserviceaccount.com (seriously?)

The Team ID and Bundle ID mismatch cost me an afternoon in staging. Apple’s documentation reads like hieroglyphics and their error codes are about as helpful as a rainstorm at a desert picnic.

Implementing Google Sign-In

I used Expo’s GoogleSignin.configure with my Android/iOS client IDs:

import { GoogleSignin } from '@react-native-google-signin/google-signin';  

GoogleSignin.configure({  
  androidClientId: 'YOUR_ANDROID_CLIENT_ID',  
  iosClientId: 'YOUR_IOS_CLIENT_ID',  
  webClientId: 'YOUR_WEB_CLIENT_ID',  
  offlineAccess: true,  
});  

On Android, the web client ID matters. On iOS, it’s the iOS client ID — go figure.

The sign-in flow itself was straightforward:

const { idToken } = await GoogleSignin.signIn();  
const googleCredential = auth.GoogleAuthProvider.credential(idToken);  
await auth().signInWithCredential(googleCredential);  

But testing this on real devices? Not simple. Android required me to upload a test build to Google Play Console for the client ID to work — which meant wasting time I could’ve spent on UI polishing for Tawasul Limo’s booking flow.

Apple Sign-In: Welcome to the Matrix

Here’s the only Apple-specific code that worked for me:

import AppleAuthentication from 'expo-apple-authentication';  

const { identityToken } = await AppleAuthentication.signInAsync({  
  requestedScopes: [AppleAuthentication.AppleAuthenticationScope.FULL_NAME],  
});  

But the real magic happened when I passed the identityToken to Firebase:

const appleCredential = auth.AppleAuthProvider.credential(identityToken);  
await auth().signInWithCredential(appleCredential);  

Don’t forget: You must hash the user’s email when creating accounts for Apple Sign-In. Local users in the UAE prefer Apple Sign-In on iOS (duh — it’s built in), so you’ll want to auto-handle that with Firebase triggers if you’re dealing with Arabic names that break email formats.

Email Sign-In: The “Easy” Fallback

After wrestling with OAuth, Firebase’s email-password auth felt like sliding into a cold shower on a 50°C Abu Dhabi day. I used:

await auth().createUserWithEmailAndPassword(email, password);  

But the catch? You need to enable email-password in Firebase > Authentication > Sign-in Methods. And for local clients who don’t read instructions, I added a button to send verification emails:

await auth().currentUser.sendEmailVerification();  

One client in Dubai insisted on adding a "Resend verification" link — not because it was complicated, but because they didn’t trust users to check spam in a timely way. Understandable, if a bit paranoid.

Managing Auth State and Edge Cases

I used Firebase’s auth observer to handle state:

useEffect(() => {  
  const unsubscribe = auth().onAuthStateChanged(setCurrentUser);  
  return unsubscribe;  
}, []);  

But what if users mix sign-in methods? Like, say, signing in with Google first, then Apple? Firebase treats them as separate accounts. To avoid confusion (and duplicate data), I linked providers:

await auth().currentUser.linkWithCredential(appleCredential);  

It worked — sort of. The merging behavior took longer to nail down than I expected, partly because my test user in Al Ain kept switching phones mid-flow.

Testing and Deployment Gotchas

The Firebase Emulator Suite helped with local testing — until it didn’t. Apple Sign-In requires real devices for testing in production-like environments, which means you’ll juggle provisioning profiles even in staging. Ugh.

On real hardware:

• •Use EAS build for iOS. Firebase requires native modules that Expo Go can’t handle.
• •For Android, enable Google Play services in your app.json plugins.

One client wanted Arabic translations for all error messages. Firebase’s default English errors don’t cut it when your user base is in the GCC. I had to wrap auth errors in a translation function like:

const translateAuthError = (error) => {  
  switch (error.code) {  
    case 'auth/email-already-in-use': return 'البريد الإلكتروني قيد الاستخدام';  
    // ... more cases  
  }  
};  

Closing Thoughts

After 4 projects using Firebase Auth in React Native, I’ve learned one truth: The setup’s a mess, but the flexibility pays off. Greeny Corner went live with all three sign-in methods working — and users in the UAE didn’t complain about auth friction once.

If you’re building a GCC app and need this stack, hit me up at sarahprofile.com/contact. I’ll walk you through the pitfalls before you waste hours Googling error codes nobody understands.