Compound queries (multiple where) in Firebase - Mini Project: Build & Apply

Compound queries (multiple where) in Firebase

📖 Scenario: You are managing a Firebase Firestore database for a small online bookstore. You want to find books that meet multiple conditions to help customers find the right books quickly.

🎯 Goal: Build a Firebase Firestore query that uses multiple where clauses to filter books by genre and price.

📋 What You'll Learn

Create a collection reference to books

Add a configuration variable for the maximum price filter

Write a compound query using two where clauses: one for genre and one for price

Complete the query by calling getDocs() to retrieve the filtered books

💡 Why This Matters

🌍 Real World

Filtering data with multiple conditions is common in apps like online stores, where users want to find items matching several criteria.

💼 Career

Understanding compound queries in Firestore is essential for backend and full-stack developers working with Firebase to build efficient and user-friendly applications.

1

Create a collection reference to books

Create a variable called booksRef that references the Firestore collection named books using collection(db, 'books').

Firebase

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

// Create a collection reference to 'books'
// Your code here

Hint

Use the collection function with db and the string 'books'.

2

Add a configuration variable for the maximum price filter

Create a constant called maxPrice and set it to 20 to filter books priced at $20 or less.

Firebase

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

const booksRef = collection(db, 'books');

// Set maxPrice to 20
// Your code here

Hint

Use const maxPrice = 20; to set the price limit.

3

Write a compound query using two where clauses

Create a variable called booksQuery that uses query() with booksRef and two where clauses: one where genre equals 'fiction', and another where price is less than or equal to maxPrice.

Firebase

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

const booksRef = collection(db, 'books');
const maxPrice = 20;

// Create a compound query filtering genre and price
// Your code here

Hint

Use query() with where filters for genre and price.

4

Complete the query by calling getDocs()

Create an async function called fetchBooks that calls getDocs(booksQuery) and stores the result in a variable called querySnapshot.

Firebase

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

const booksRef = collection(db, 'books');
const maxPrice = 20;

const booksQuery = query(booksRef, where('genre', '==', 'fiction'), where('price', '<=', maxPrice));

// Create async function fetchBooks to get documents
// Your code here

Hint

Define an async function and use await getDocs(booksQuery) inside it.

Practice

1. What does a compound query with multiple .where() filters do in Firebase Firestore?

easy

A. It deletes documents that match the conditions.

B. It finds documents that match any one of the specified conditions.

C. It finds documents that match all the specified conditions.

D. It updates documents that match the conditions.

Solution

1. Step 1: Understand the purpose of .where() filters

   Each .where() filter narrows down the documents by a condition.

2. Step 2: Combine multiple filters in a compound query

   Multiple .where() filters together find documents matching all conditions (AND logic).

3. Final Answer:

   It finds documents that match all the specified conditions. -> Option C

4. Quick Check:

   Compound query = all conditions matched [OK]

Hint: Multiple .where() means all conditions must be true [OK]

Common Mistakes:

• Thinking it matches any condition (OR logic)
• Confusing query with update or delete
• Assuming it returns all documents

2. Which of the following is the correct syntax to create a compound query with two .where() filters in Firebase Firestore?

easy

A. db.collection('users').where(['age', '>=', 18], ['status', '==', 'active'])

B. db.collection('users').where('age', '>=', 18, 'status', '==', 'active')

C. db.collection('users').filter('age', '>=', 18).filter('status', '==', 'active')

D. db.collection('users').where('status', '==', 'active').where('age', '>=', 18)

Solution

1. Step 1: Review Firestore query chaining syntax

   Each .where() is chained separately with three arguments: field, operator, value.

2. Step 2: Identify correct chaining of two .where() calls

   db.collection('users').where('status', '==', 'active').where('age', '>=', 18) correctly chains two .where() calls with proper arguments.

3. Final Answer:

   db.collection('users').where('status', '==', 'active').where('age', '>=', 18) -> Option D

4. Quick Check:

   Separate .where() calls chained = correct syntax [OK]

Hint: Chain separate .where() calls with 3 arguments each [OK]

Common Mistakes:

• Passing multiple conditions in one .where() call
• Using .filter() instead of .where()
• Incorrect argument grouping inside .where()

3. Given the following Firestore query:

db.collection('orders')
  .where('status', '==', 'shipped')
  .where('total', '>', 100)

What documents will this query return?

medium

A. Orders with status 'shipped' only.

B. Orders with status 'shipped' and total greater than 100.

C. Orders with total greater than 100 only.

D. Orders with status 'shipped' or total greater than 100.

Solution

1. Step 1: Analyze the two .where() filters

   First filter: status must be 'shipped'. Second filter: total must be greater than 100.

2. Step 2: Understand compound query logic

   Both conditions must be true for a document to be returned.

3. Final Answer:

   Orders with status 'shipped' and total greater than 100. -> Option B

4. Quick Check:

   Multiple .where() = AND logic [OK]

Hint: Multiple .where() means all conditions must match [OK]

Common Mistakes:

• Thinking it uses OR logic
• Ignoring one of the filters
• Confusing field names or operators

4. You wrote this Firestore query:

db.collection('products')
  .where('category', '==', 'books')
  .where('price', '<', 20)
  .where('price', '>', 5)
  .orderBy('price')

But Firestore returns an error about missing index. What is the best way to fix this?

medium

A. Create a composite index for 'category' and 'price' fields as requested by Firestore.

B. Remove one of the .where() filters to avoid multiple conditions.

C. Change the query to use only one .where() filter.

D. Rewrite the query using .orderBy() instead of .where().

Solution

1. Step 1: Understand Firestore index requirements for compound queries

   Firestore requires composite indexes for queries with multiple .where() filters on different fields or range filters.

2. Step 2: Follow Firestore error message instructions

   Firestore error usually provides a link to create the needed composite index.

3. Final Answer:

   Create a composite index for 'category' and 'price' fields as requested by Firestore. -> Option A

4. Quick Check:

   Missing index error = create composite index [OK]

Hint: Create composite index when Firestore asks [OK]

Common Mistakes:

• Removing filters instead of creating index
• Ignoring Firestore error message
• Trying to replace .where() with .orderBy() incorrectly

5. You want to query a Firestore collection 'events' for documents where type is 'conference', attendees is greater than 100, and location is 'NYC'. Which of the following is the best approach to write this compound query and ensure it works efficiently?

hard

A. Chain three .where() filters for each condition and create a composite index for these fields.

B. Use a single .where() with an array of conditions for all fields.

C. Query only by type and filter the rest in client code.

D. Use .orderBy() on all fields instead of .where().

Solution

1. Step 1: Write the compound query with multiple .where() filters

   Use .where('type', '==', 'conference'), .where('location', '==', 'NYC'), and .where('attendees', '>', 100) chained together.

2. Step 2: Ensure Firestore has a composite index for these fields

   Because multiple filters on different fields are used, create a composite index to optimize query performance and avoid errors.

3. Final Answer:

   Chain three .where() filters and create a composite index for these fields. -> Option A

4. Quick Check:

   Multiple filters + composite index = efficient query [OK]

Hint: Chain .where() and create composite index for multiple fields [OK]

Common Mistakes:

• Trying to put all conditions in one .where() call
• Filtering on client side instead of query
• Using .orderBy() instead of .where() for filtering