Facebook sign-in in Firebase - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

Understanding Facebook Sign-In Flow in Firebase

Which step correctly describes the initial action when implementing Facebook sign-in using Firebase Authentication?

A Directly call Firebase signInWithPopup without initializing Facebook SDK separately.

B Initialize the Facebook SDK and then use Firebase to handle the authentication token.

C Use Firebase Admin SDK to authenticate Facebook users on the client side.

D Create a custom OAuth server to handle Facebook tokens before Firebase authentication.

💡 Hint

Think about how Firebase and Facebook SDKs work together for sign-in.

Firebase Authentication can directly handle Facebook sign-in using signInWithPopup or signInWithRedirect without separately initializing the Facebook SDK.

❓ Configuration

intermediate

Configuring Facebook Sign-In in Firebase Console

Which configuration step is mandatory in the Firebase Console to enable Facebook sign-in?

A Enable Facebook sign-in in Firebase Realtime Database rules.

B Upload the Facebook SDK files to Firebase Hosting.

C Add the Facebook App ID and App Secret in the Firebase Authentication providers section.

D Set up a Firebase Cloud Function to handle Facebook OAuth callbacks.

💡 Hint

Think about what Firebase needs to communicate with Facebook.

Firebase needs the Facebook App ID and App Secret to connect and verify users via Facebook OAuth.

❓ service_behavior

advanced

Handling Token Expiry in Facebook Sign-In with Firebase

What happens if a Facebook access token used for Firebase sign-in expires, and the user tries to sign in again without refreshing the token?

A Firebase automatically refreshes the Facebook token and signs the user in.

B Firebase sign-in fails with an error indicating invalid or expired credential.

C Firebase signs in the user but with limited permissions until token refresh.

D Firebase ignores the token expiry and signs in the user normally.

💡 Hint

Consider how Firebase treats expired OAuth tokens.

Firebase requires a valid Facebook access token; if expired, sign-in fails and an error is returned.

❓ security

advanced

Securing Facebook Sign-In with Firebase

Which practice best improves security when implementing Facebook sign-in with Firebase?

A Disable Firebase Authentication email/password sign-in to force Facebook-only sign-in.

B Store the Facebook App Secret in the client-side code for easy access.

C Use Firebase Realtime Database rules to allow all authenticated users full read/write access.

D Verify the Facebook access token on your backend server before passing it to Firebase Authentication.

💡 Hint

Think about protecting sensitive credentials and validating tokens.

Verifying tokens on the backend prevents token forgery and protects your app from unauthorized access.

❓ Architecture

expert

Designing a Scalable Facebook Sign-In System with Firebase

You want to design a system that supports millions of users signing in with Facebook using Firebase Authentication. Which architectural choice best supports scalability and reliability?

A Use Firebase Authentication with Facebook sign-in on the client side, and implement Cloud Functions to handle user data processing asynchronously.

B Store all Facebook access tokens in Firestore and validate them on every user request.

C Use Firebase Authentication only for email/password and handle Facebook sign-in entirely on your backend server.

D Build a custom OAuth server to handle Facebook sign-in and then sync users to Firebase Authentication manually.

💡 Hint

Consider Firebase's managed services and asynchronous processing for scale.

Using Firebase Authentication client-side with Cloud Functions for backend processing leverages Firebase's scalability and reduces server load.

Practice

1. What is the main purpose of using Facebook sign-in with Firebase?

easy

A. To create Facebook accounts automatically

B. To store user data in Facebook servers

C. To replace Firebase authentication completely

D. To let users log in using their Facebook account easily

Solution

1. Step 1: Understand Facebook sign-in purpose

   Facebook sign-in allows users to authenticate using their existing Facebook account, simplifying login.

2. Step 2: Compare options

   Only To let users log in using their Facebook account easily correctly describes this purpose; others describe unrelated or incorrect uses.

3. Final Answer:

   To let users log in using their Facebook account easily -> Option D

4. Quick Check:

   Facebook sign-in = Easy login with Facebook [OK]

Hint: Facebook sign-in means easy login with Facebook account [OK]

Common Mistakes:

• Thinking Facebook sign-in stores data on Facebook
• Confusing Facebook sign-in with full Firebase replacement
• Assuming Facebook creates accounts automatically

2. Which Firebase method is used to start Facebook sign-in with a popup window?

easy

A. signInWithPopup

B. signInWithRedirect

C. signInWithEmailAndPassword

D. createUserWithEmailAndPassword

Solution

1. Step 1: Identify Firebase methods for sign-in

   Firebase offers signInWithPopup and signInWithRedirect for OAuth providers like Facebook.

2. Step 2: Choose method for popup

   signInWithPopup opens a popup window for login, matching the question requirement.

3. Final Answer:

   signInWithPopup -> Option A

4. Quick Check:

   Popup login method = signInWithPopup [OK]

Hint: Popup login uses signInWithPopup method [OK]

Common Mistakes:

• Confusing redirect and popup methods
• Using email/password methods for Facebook sign-in
• Mixing createUser with sign-in methods

3. What will the following code do?

const provider = new firebase.auth.FacebookAuthProvider();
firebase.auth().signInWithPopup(provider)
  .then(result => console.log(result.user.displayName))
  .catch(error => console.error(error));

medium

A. Log the user's Facebook display name after successful sign-in

B. Throw a syntax error because of missing semicolons

C. Log an error because Facebook sign-in is not supported

D. Create a new Facebook account automatically

Solution

1. Step 1: Analyze the code flow

   The code creates a Facebook provider, calls signInWithPopup, then logs the user's display name on success.

2. Step 2: Check for errors or unsupported features

   Code syntax is correct; Facebook sign-in is supported; no account creation happens automatically.

3. Final Answer:

   Log the user's Facebook display name after successful sign-in -> Option A

4. Quick Check:

   signInWithPopup success logs displayName [OK]

Hint: signInWithPopup logs user info on success [OK]

Common Mistakes:

• Thinking missing semicolons cause errors
• Assuming Facebook sign-in is unsupported
• Believing code creates Facebook accounts

4. You get an error when calling signInWithPopup for Facebook sign-in. What is a common cause?

medium

A. Using signInWithEmailAndPassword instead

B. Facebook sign-in is not enabled in Firebase console

C. Not importing Firebase SDK

D. Calling signInWithPopup without a provider

Solution

1. Step 1: Identify common setup errors

   Facebook sign-in requires enabling it in Firebase console under Authentication providers.

2. Step 2: Evaluate other options

   Using wrong methods or missing imports cause different errors; calling without provider causes immediate failure.

3. Final Answer:

   Facebook sign-in is not enabled in Firebase console -> Option B

4. Quick Check:

   Enable Facebook sign-in in Firebase console [OK]

Hint: Enable Facebook sign-in in Firebase console first [OK]

Common Mistakes:

• Forgetting to enable Facebook provider
• Mixing signInWithEmailAndPassword with Facebook sign-in
• Ignoring SDK import errors
• Calling signInWithPopup without provider argument

5. You want to add Facebook sign-in to your app and ensure users' Facebook profile pictures are saved in Firebase user profiles. Which steps are needed?

hard

A. Use signInWithEmailAndPassword and fetch Facebook pictures separately

B. Only enable Facebook sign-in; Firebase saves profile pictures automatically

C. Enable Facebook sign-in in Firebase, use signInWithPopup, then update user profile with photoURL from Facebook data

D. Create Facebook accounts manually and link to Firebase users

Solution

1. Step 1: Enable Facebook sign-in

   Enable Facebook provider in Firebase console under Authentication > Sign-in method.

2. Step 2: Authenticate and update profile

   Implement signInWithPopup (or Redirect) with FacebookAuthProvider; then update the Firebase user profile with the photoURL obtained from Facebook data to ensure profile pictures are saved.

3. Final Answer:

   Enable Facebook sign-in in Firebase, use signInWithPopup, then update user profile with photoURL from Facebook data -> Option C

4. Quick Check:

   Enable Facebook provider + signInWithPopup + update profile photoURL [OK]

Hint: Firebase requires manual update of photoURL after Facebook sign-in [OK]

Common Mistakes:

• Believing manual photoURL update is not required
• Using signInWithEmailAndPassword for Facebook login
• Manually creating Facebook accounts instead of linking