Firebase with Flutter - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

Firebase Authentication UI Behavior

What will happen when the following Flutter code tries to sign in a user with Firebase Authentication using an email and password that do not exist in Firebase?

Firebase

try {
  UserCredential userCredential = await FirebaseAuth.instance.signInWithEmailAndPassword(
    email: '[e-mail]',
    password: 'wrongpassword'
  );
  print('Signed in: ${userCredential.user?.uid}');
} catch (e) {
  print('Error: $e');
}

A The app prints the user ID of the signed-in user.

B The app crashes with a null pointer exception.

C The app prints an error message indicating wrong credentials.

D The app signs in anonymously instead.

💡 Hint

Think about what Firebase does when credentials are invalid.

Firebase Authentication throws a FirebaseAuthException when the email or password is incorrect. The catch block prints the error message.

🧠 Conceptual

intermediate

Firebase Firestore Data Structure

In Firebase Firestore, which of the following best describes how data is organized?

A Data is stored in collections containing documents, which can have nested collections.

B Data is stored only as key-value pairs without any hierarchy.

C Data is stored as plain text files on the server.

D Data is stored in tables with rows and columns like SQL databases.

💡 Hint

Think about how Firestore groups related data.

Firestore organizes data in collections and documents. Documents can contain fields and nested collections, allowing flexible hierarchical data.

❓ lifecycle

advanced

Firebase StreamBuilder Lifecycle

Consider this Flutter widget using StreamBuilder to listen to Firestore changes. What happens if the widget is removed from the widget tree?

Firebase

StreamBuilder<QuerySnapshot>(
  stream: FirebaseFirestore.instance.collection('messages').snapshots(),
  builder: (context, snapshot) {
    if (!snapshot.hasData) return CircularProgressIndicator();
    return ListView(
      children: snapshot.data!.docs.map((doc) => Text(doc['text'])).toList(),
    );
  },
)

A The app crashes because the stream is not closed manually.

B The stream subscription is automatically cancelled to avoid memory leaks.

C The stream keeps running and causes a memory leak.

D The stream pauses but does not cancel, so updates are delayed.

💡 Hint

Think about how StreamBuilder manages streams internally.

StreamBuilder automatically cancels its stream subscription when the widget is disposed, preventing memory leaks.

❓ navigation

advanced

Firebase Auth State and Navigation

In a Flutter app using Firebase Authentication, which approach correctly navigates the user to the home screen only after successful login?

Firebase

FirebaseAuth.instance.authStateChanges().listen((User? user) {
  if (user != null) {
    Navigator.pushReplacementNamed(context, '/home');
  } else {
    Navigator.pushReplacementNamed(context, '/login');
  }
});

A This code works correctly and navigates based on auth state changes.

B This code does not navigate because authStateChanges() never emits events.

C This code causes infinite navigation loops because it listens continuously.

D This code causes navigation errors because context is not valid inside the listener.

💡 Hint

Consider when and where you can safely use Navigator with context.

Using Navigator inside a stream listener without checking widget lifecycle or context validity can cause errors. The context may be invalid if the widget is disposed.

🔧 Debug

expert

Debugging Firestore Query Results

Given this Firestore query in Flutter, why does the app always show an empty list even though the collection has documents?

Firebase

StreamBuilder<QuerySnapshot>(
  stream: FirebaseFirestore.instance.collection('tasks').where('done' == true).snapshots(),
  builder: (context, snapshot) {
    if (!snapshot.hasData) return CircularProgressIndicator();
    return ListView(
      children: snapshot.data!.docs.map((doc) => Text(doc['title'])).toList(),
    );
  },
)

A The where clause is incorrect; 'done' == true is a boolean expression, not a field filter.

B The collection 'tasks' does not exist in Firestore.

C The StreamBuilder is missing a required key parameter.

D The snapshot data is null because the app lacks Firestore read permissions.

💡 Hint

Look carefully at the syntax inside the where() method.

The expression 'done' == true evaluates immediately to false, so the where clause becomes .where(false), which is invalid. The correct syntax is .where('done', isEqualTo: true).

Practice

1. What is the main purpose of initializing Firebase in a Flutter app?

easy

A. To compile the Flutter app into native code

B. To connect the app to Firebase backend services

C. To design the app's user interface

D. To create local storage on the device

Solution

1. Step 1: Understand Firebase initialization

   Initializing Firebase sets up the connection between the Flutter app and Firebase backend services like Authentication and Firestore.

2. Step 2: Identify the purpose of initialization

   Without initialization, the app cannot use Firebase features because it is not linked to Firebase servers.

3. Final Answer:

   To connect the app to Firebase backend services -> Option B

4. Quick Check:

   Firebase initialization = Connect app to backend [OK]

Hint: Firebase init links app to backend services [OK]

Common Mistakes:

• Thinking initialization designs UI
• Confusing initialization with app compilation
• Assuming initialization creates local storage

2. Which code snippet correctly initializes Firebase in a Flutter app?

easy

A. FirebaseApp.initialize();

B. Firebase.initApp();

C. await Firebase.initializeApp();

D. initializeFirebase();

Solution

1. Step 1: Recall Firebase initialization syntax

   The official method to initialize Firebase in Flutter is calling await Firebase.initializeApp();

2. Step 2: Check other options for correctness

   Other options use incorrect method names or missing await keyword, causing errors.

3. Final Answer:

   await Firebase.initializeApp(); -> Option C

4. Quick Check:

   Correct Firebase init syntax = await Firebase.initializeApp() [OK]

Hint: Use await Firebase.initializeApp() to init Firebase [OK]

Common Mistakes:

• Omitting await keyword
• Using wrong method names
• Calling initialization without async context

3. Given this Flutter code using Firebase Authentication, what will be printed if the user signs in successfully?

try {
  UserCredential user = await FirebaseAuth.instance.signInWithEmailAndPassword(email: '[e-mail]', password: '123456');
  print('User signed in: ' + user.user!.email!);
} catch (e) {
  print('Sign in failed');
}

medium

A. User signed in: [e-mail]

B. Sign in failed

C. User signed in: null

D. No output

Solution

1. Step 1: Analyze successful sign-in flow

   If signInWithEmailAndPassword succeeds, it returns a UserCredential with a non-null user and email.

2. Step 2: Understand the print statement

   The code prints 'User signed in: ' plus the user's email, which is '[e-mail]'.

3. Final Answer:

   User signed in: [e-mail] -> Option A

4. Quick Check:

   Successful sign-in prints user email [OK]

Hint: Success prints user email, failure prints error [OK]

Common Mistakes:

• Assuming print shows 'Sign in failed' on success
• Expecting null email on success
• Ignoring async await behavior

4. What is wrong with this Flutter Firebase Firestore code snippet?

FirebaseFirestore firestore = FirebaseFirestore.instance;
firestore.collection('users').add({
  'name': 'Alice',
  'age': 25
});
print('User added');

medium

A. Missing await before add() causes no error

B. Firestore instance is not initialized

C. The add() method requires a document ID

D. The print statement is inside the add() call

Solution

1. Step 1: Check Firestore instance usage

   FirebaseFirestore.instance is correctly assigned to firestore, so initialization is fine.

2. Step 2: Analyze add() method and await usage

   add() returns a Future; missing await means the print runs before add completes, but no syntax error occurs.

3. Final Answer:

   Missing await before add() causes no error -> Option A

4. Quick Check:

   Missing await = no error but async issue [OK]

Hint: Always await async Firestore calls to ensure completion [OK]

Common Mistakes:

• Thinking add() needs document ID (it auto-generates)
• Assuming print inside add() call
• Believing Firestore instance is uninitialized

5. You want to build a Flutter app that shows a list of user names from Firestore and updates in real-time. Which approach correctly uses Firebase with Flutter to achieve this?

hard

A. Store user names locally and update Firestore only on app restart

B. Use FutureBuilder with FirebaseFirestore.instance.collection('users').get() to fetch names once

C. Use a Timer to fetch Firestore data every 5 seconds and update UI manually

D. Use StreamBuilder with FirebaseFirestore.instance.collection('users').snapshots() to listen and display names

Solution

1. Step 1: Understand real-time updates in Firestore

   Firestore provides snapshots() streams that emit data changes in real-time.

2. Step 2: Choose Flutter widget for real-time data

   StreamBuilder listens to streams and rebuilds UI on data changes, perfect for real-time Firestore updates.

3. Step 3: Evaluate other options

   FutureBuilder fetches data once, Timer polling is inefficient, and local storage does not reflect real-time changes.

4. Final Answer:

   Use StreamBuilder with FirebaseFirestore.instance.collection('users').snapshots() to listen and display names -> Option D

5. Quick Check:

   Real-time Firestore + StreamBuilder = live UI updates [OK]

Hint: Use StreamBuilder with snapshots() for live Firestore data [OK]

Common Mistakes:

• Using FutureBuilder for real-time data
• Polling Firestore with Timer instead of streams
• Relying on local storage for live updates