Authentication providers overview in Firebase - Step-by-Step Execution

Process Flow - Authentication providers overview

User opens app

↓

Choose sign-in method

↓

Select provider

↓

Email

↓

Authenticate with provider

↓

Firebase verifies

↓

User signed in or error

↓

Access granted or retry

User picks a sign-in method, Firebase verifies it, then grants access or asks to retry.

Execution Sample

Firebase

firebase.auth().signInWithPopup(new firebase.auth.GoogleAuthProvider());

This code starts Google sign-in using a popup window.

Process Table

Step	Action	Provider Selected	Firebase Response	User State
1	User opens app	None	Waiting for input	Not signed in
2	User clicks sign-in	Google	Popup opens	Not signed in
3	User enters Google credentials	Google	Verifying credentials	Not signed in
4	Firebase verifies token	Google	Token valid	Not signed in
5	Firebase signs in user	Google	Sign-in success	Signed in
6	User accesses app	Google	Access granted	Signed in
7	User signs out	Google	Signed out	Not signed in
8	User tries Facebook sign-in	Facebook	Popup opens	Not signed in
9	User cancels Facebook sign-in	Facebook	Sign-in cancelled	Not signed in

💡 User either signs in successfully or cancels sign-in, ending the flow.

Status Tracker

Variable	Start	After Step 2	After Step 5	After Step 7	After Step 9
User State	Not signed in	Not signed in	Signed in	Not signed in	Not signed in
Provider Selected	None	Google	Google	Google	Facebook
Firebase Response	Waiting for input	Popup opens	Sign-in success	Signed out	Sign-in cancelled

Key Moments - 3 Insights

Why does the user state remain 'Not signed in' after opening the popup?

Because the user has not completed authentication yet; see step 2 and 3 in execution_table where popup opens but sign-in is not done.

What happens if the user cancels sign-in?

Firebase returns a 'Sign-in cancelled' response and user state stays 'Not signed in', as shown in step 9.

How does Firebase know which provider to use?

The app code specifies the provider (Google, Facebook, etc.) before calling Firebase sign-in, as seen in 'Provider Selected' column.

Visual Quiz - 3 Questions

Look at the execution table, what is the user state at step 5?

A Not signed in

B Signed in

C Signing in

D Signed out

💡 Hint

Check the 'User State' column at step 5 in the execution_table.

At which step does Firebase verify the user's credentials?

A Step 6

B Step 3

C Step 4

D Step 2

💡 Hint

Look for 'Verifying credentials' or 'Token valid' in the 'Firebase Response' column.

If the user cancels sign-in, what Firebase response is shown?

A Sign-in cancelled

B Popup opens

C Sign-in success

D Access granted

💡 Hint

See the last row in the execution_table for the cancellation scenario.

Concept Snapshot

Authentication providers let users sign in using methods like Email, Google, or Facebook.
User picks a provider, Firebase opens a sign-in popup or redirect.
Firebase verifies credentials and signs in the user.
If successful, user gains access; if not, they can retry or cancel.
Each provider requires specific setup but follows this general flow.

Full Transcript

This visual execution shows how Firebase authentication providers work. The user opens the app and chooses a sign-in method like Google or Facebook. Firebase opens a popup for the user to enter credentials. Firebase then verifies these credentials. If valid, Firebase signs in the user and grants access. If the user cancels or credentials are invalid, the user remains signed out. The variable tracker shows how user state and provider selection change step by step. Key moments clarify common confusions like why the user is not signed in immediately after popup opens and what happens on cancellation. The quiz tests understanding of user state changes and Firebase responses during sign-in.