Querying and filtering in Firebase - Mini Project: Build & Apply

Querying and filtering

📖 Scenario: You are building a simple app to manage a list of books in a Firebase Firestore database. You want to store book details and then query the database to find books by a specific author.

🎯 Goal: Create a Firestore collection with book data, add a configuration variable for the author to search, write a query to filter books by that author, and complete the query execution to get the results.

📋 What You'll Learn

Create a Firestore collection named books with exact book entries

Add a variable called authorToFind with the exact author name to filter

Write a Firestore query using where to filter books by authorToFind

Complete the query execution using get() to retrieve the filtered books

💡 Why This Matters

🌍 Real World

Filtering data in Firestore is common in apps that need to show users specific information, like books by an author or products in a category.

💼 Career

Knowing how to query and filter Firestore data is essential for frontend and backend developers working with Firebase to build responsive and dynamic applications.

1

Create the initial Firestore collection data

Create a Firestore collection named books and add these exact book documents with fields: title and author. The books are: { title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' }, { title: '1984', author: 'George Orwell' }, and { title: 'To Kill a Mockingbird', author: 'Harper Lee' }.

Firebase

// Your code here to create the books collection with documents

Hint

Use a constant array named books with objects for each book.

2

Add the author filter variable

Add a variable called authorToFind and set it exactly to the string 'George Orwell' to use as the filter for querying books.

Firebase

const books = [
  { title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' },
  { title: '1984', author: 'George Orwell' },
  { title: 'To Kill a Mockingbird', author: 'Harper Lee' }
];
// Your code here to add authorToFind variable

Hint

Declare a constant named authorToFind with the exact string value.

3

Write the Firestore query to filter books by author

Write a Firestore query called queryByAuthor that uses collection(db, 'books') and where('author', '==', authorToFind) to filter books by the authorToFind variable.

Firebase

const books = [
  { title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' },
  { title: '1984', author: 'George Orwell' },
  { title: 'To Kill a Mockingbird', author: 'Harper Lee' }
];

const authorToFind = 'George Orwell';
// Your code here to create queryByAuthor using where filter

Hint

Use query() with collection() and where() to filter by author.

4

Complete the query execution to get filtered books

Complete the Firestore query execution by calling getDocs(queryByAuthor) and assign the result to a variable called querySnapshot.

Firebase

import { collection, query, where, getDocs } from 'firebase/firestore';

const books = [
  { title: 'The Great Gatsby', author: 'F. Scott Fitzgerald' },
  { title: '1984', author: 'George Orwell' },
  { title: 'To Kill a Mockingbird', author: 'Harper Lee' }
];

const authorToFind = 'George Orwell';

const queryByAuthor = query(collection(db, 'books'), where('author', '==', authorToFind));
// Your code here to get querySnapshot using getDocs

Hint

Use await getDocs(queryByAuthor) and assign it to querySnapshot.

Practice

1. What does the where method do in a Firestore query?

easy

A. Limits the number of documents returned

B. Sorts documents in ascending order

C. Filters documents based on a condition

D. Deletes documents matching a condition

Solution

1. Step 1: Understand the purpose of where

   The where method is used to filter documents by specifying a condition on a field.

2. Step 2: Compare with other query methods

   orderBy sorts documents, limit restricts count, and deletion is unrelated.

3. Final Answer:

   Filters documents based on a condition -> Option C

4. Quick Check:

   where = filter condition [OK]

Hint: Remember: where filters, orderBy sorts, limit restricts [OK]

Common Mistakes:

• Confusing where with orderBy
• Thinking where limits results
• Assuming where deletes data

2. Which of the following is the correct syntax to filter documents where the field age is greater than 18 in Firestore?

easy

A. query.where('age', '>', 18)

B. query.where('age' > 18)

C. query.where('age', 'greater', 18)

D. query.where('age', '>=', '18')

Solution

1. Step 1: Check Firestore where syntax

   The correct syntax uses three arguments: field name, operator as string, and value.

2. Step 2: Validate each option

   query.where('age', '>', 18) matches correct syntax. query.where('age' > 18) misses quotes and arguments. query.where('age', 'greater', 18) uses invalid operator. query.where('age', '>=', '18') compares number to string.

3. Final Answer:

   query.where('age', '>', 18) -> Option A

4. Quick Check:

   where(field, operator, value) correct format [OK]

Hint: Use quotes around operator and field name [OK]

Common Mistakes:

• Omitting quotes around operator
• Using invalid operators like 'greater'
• Comparing number to string

3. Given this Firestore query code:

const query = collection.where('score', '>=', 50).orderBy('score').limit(3);

What will this query return?

medium

A. Top 3 documents with score less than 50

B. 3 documents with the lowest scores 50 or above

C. 3 documents with the highest scores 50 or above

D. All documents with score exactly 50

Solution

1. Step 1: Analyze the where condition

   The query filters documents with score greater than or equal to 50.

2. Step 2: Understand orderBy and limit

   Ordering by score defaults to ascending order, so lowest scores come first. Limit(3) returns first 3 documents in that order.

3. Final Answer:

   3 documents with the lowest scores 50 or above -> Option B

4. Quick Check:

   where >= 50 + orderBy ascending + limit 3 = lowest 3 scores ≥ 50 [OK]

Hint: orderBy defaults ascending unless specified [OK]

Common Mistakes:

• Assuming orderBy sorts descending by default
• Ignoring the where filter
• Thinking limit returns highest scores

4. You wrote this Firestore query:

collection.where('status', '==', 'active').orderBy('createdAt')

But it throws an error about missing index. What is the best fix?

medium

A. Add a composite index for status and createdAt

B. Remove the orderBy clause

C. Change where to filter

D. Use limit(1) to avoid indexing

Solution

1. Step 1: Understand Firestore indexing rules

   Queries with multiple conditions on different fields require composite indexes.

2. Step 2: Identify the error cause

   The query filters by status and orders by createdAt, needing a composite index.

3. Final Answer:

   Add a composite index for status and createdAt -> Option A

4. Quick Check:

   Composite index needed for where + orderBy [OK]

Hint: Create composite index for multiple fields in query [OK]

Common Mistakes:

• Removing orderBy instead of indexing
• Using invalid method 'filter'
• Thinking limit avoids index errors

5. You want to find users who are either under 18 or have a premium subscription. Which Firestore query approach is correct?

hard

A. Use a single query with where('age', '<', 18).orWhere('subscription', '==', 'premium')

B. Use orderBy on age and subscription fields

C. Use whereIn with both conditions combined

D. Use two separate queries with where and combine results in code

Solution

1. Step 1: Understand Firestore query limitations

   Firestore does not support OR queries directly in a single query.

2. Step 2: Choose correct workaround

   Run two queries separately: one for age < 18, another for subscription == premium, then merge results in code.

3. Final Answer:

   Use two separate queries with where and combine results in code -> Option D

4. Quick Check:

   Firestore lacks OR; combine queries manually [OK]

Hint: Firestore OR queries need multiple queries combined [OK]

Common Mistakes:

• Trying to use non-existent orWhere method
• Using whereIn incorrectly for OR logic
• Assuming orderBy filters data