Array-contains queries in Firebase - Mini Project: Build & Apply

Using Array-Contains Queries in Firebase

📖 Scenario: You are building a simple app to manage a collection of books. Each book document in Firebase Firestore has a field called genres, which is an array of strings representing the genres the book belongs to.For example, a book might have genres: ['fiction', 'mystery'].

🎯 Goal: Learn how to query Firestore to find all books that belong to a specific genre using the array-contains query.

📋 What You'll Learn

Create a Firestore collection reference called books_ref pointing to the 'books' collection.

Create a variable called search_genre with the exact string value 'fiction'.

Write a Firestore query called query_ref that uses where with array-contains to find books where the genres array contains search_genre.

Add a final line to get the documents from query_ref using get().

💡 Why This Matters

🌍 Real World

Array-contains queries are useful when you want to find documents that have a specific value inside an array field, such as tags, categories, or genres.

💼 Career

Understanding how to query array fields in Firestore is important for building efficient and user-friendly apps that filter data based on user interests or categories.

1

Create Firestore collection reference

Create a Firestore collection reference called books_ref that points to the collection named 'books'.

Firebase

# Your code here

Hint

Use firestore.collection('books') to get the collection reference.

2

Create search genre variable

Create a variable called search_genre and set it to the string 'fiction'.

Firebase

const books_ref = firestore.collection('books');
// Your code here

Hint

Use const search_genre = 'fiction'; to create the variable.

3

Write array-contains query

Create a Firestore query called query_ref that uses books_ref.where with the field 'genres', the operator 'array-contains', and the value search_genre.

Firebase

const books_ref = firestore.collection('books');
const search_genre = 'fiction';
// Your code here

Hint

Use books_ref.where('genres', 'array-contains', search_genre) to create the query.

4

Get documents from query

Add a line to get the documents from query_ref by calling get() and assign it to a variable called query_snapshot.

Firebase

const books_ref = firestore.collection('books');
const search_genre = 'fiction';
const query_ref = books_ref.where('genres', 'array-contains', search_genre);
// Your code here

Hint

Use await query_ref.get() to get the documents.

Practice

1.

What does the array-contains query operator do in Firebase Firestore?

easy

A. Finds documents where an array field includes a specific value

B. Finds documents where a string field contains a substring

C. Finds documents where a number field is greater than a value

D. Finds documents where a field is missing

Solution

1. Step 1: Understand the purpose of array-contains

   This operator is designed to check if an array field in a document contains a specific value.

2. Step 2: Compare with other query types

   Other options describe different query operators, but only array-contains matches arrays including a value.

3. Final Answer:

   Finds documents where an array field includes a specific value -> Option A

4. Quick Check:

   array-contains = finds value in array [OK]

Hint: Remember: array-contains checks for one value inside an array [OK]

Common Mistakes:

• Confusing array-contains with substring search
• Using array-contains on non-array fields
• Thinking it works with multiple values at once

2.

Which of the following is the correct syntax to query documents where the tags array contains the value "urgent"?

const query = firestore.collection('tasks').where(____);

easy

A. "tags", "contains", "urgent"

B. "tags", "==", "urgent"

C. "tags", "array-contains-any", ["urgent"]

D. "tags", "array-contains", "urgent"

Solution

1. Step 1: Recall the correct operator for single value in array

   The operator is "array-contains" to check if an array includes a specific value.

2. Step 2: Check syntax format

   The syntax is .where("field", "array-contains", value). "tags", "array-contains", "urgent" matches this exactly.

3. Final Answer:

   "tags", "array-contains", "urgent" -> Option D

4. Quick Check:

   Correct syntax uses array-contains [OK]

Hint: Use "array-contains" for single value array queries [OK]

Common Mistakes:

• Using == instead of array-contains for arrays
• Confusing array-contains with array-contains-any
• Using non-existent operator "contains"

3.

Given the following documents in a Firestore collection projects:

[{ id: 1, members: ["alice", "bob"] }, { id: 2, members: ["carol"] }, { id: 3, members: ["bob", "dave"] }]

What will the query firestore.collection('projects').where('members', 'array-contains', 'bob').get() return?

medium

A. Documents with id 2 only

B. Documents with id 1 only

C. Documents with id 1 and 3

D. No documents

Solution

1. Step 1: Identify documents where 'members' array contains 'bob'

   Document 1 has members ["alice", "bob"] which includes "bob". Document 3 has ["bob", "dave"] which also includes "bob". Document 2 does not.

2. Step 2: Determine query result

   The query returns documents 1 and 3 because their 'members' arrays contain "bob".

3. Final Answer:

   Documents with id 1 and 3 -> Option C

4. Quick Check:

   array-contains 'bob' = docs 1 and 3 [OK]

Hint: Check which arrays include the value exactly [OK]

Common Mistakes:

• Including documents without the value
• Confusing array-contains with array-contains-any
• Assuming partial matches inside strings

4.

What is wrong with this Firestore query?

firestore.collection('orders').where('items', 'array-contains', ['apple', 'banana'])

The items field is an array of strings.

medium

A. You cannot use an array as the value with array-contains

B. The operator should be 'array-contains-any' instead

C. The field 'items' must be a string, not an array

D. The query syntax is correct

Solution

1. Step 1: Understand array-contains value type

   The 'array-contains' operator expects a single value, not an array, to check inside the array field.

2. Step 2: Identify correct usage

   Passing an array as the value causes an error. To check multiple values, 'array-contains-any' is used instead.

3. Final Answer:

   You cannot use an array as the value with array-contains -> Option A

4. Quick Check:

   array-contains needs single value, not array [OK]

Hint: array-contains accepts only one value, not arrays [OK]

Common Mistakes:

• Passing an array as the value to array-contains
• Confusing array-contains with array-contains-any
• Assuming array-contains works like 'in' operator

5.

You want to find all documents in the events collection where the attendees array contains both "john" and "jane". Which approach is correct?

hard

A. Use a single query with array-contains-any and pass both names

B. Use two queries with array-contains for each name and merge results client-side

C. Use a single query with array-contains and pass an array of both names

D. Use a query with where('attendees', '==', ['john', 'jane'])

Solution

1. Step 1: Understand limitations of array-contains and array-contains-any

   array-contains checks for one value in array; array-contains-any checks if array contains any of multiple values but not all.

2. Step 2: Find correct method to get documents containing both values

   Since Firestore does not support querying for multiple values all present in one array in a single query, you must run two queries with array-contains and combine results client-side.

3. Final Answer:

   Use two queries with array-contains for each name and merge results client-side -> Option B

4. Quick Check:

   Multiple array-contains queries combined client-side [OK]

Hint: Firestore can't query multiple array-contains in one query [OK]

Common Mistakes:

• Using array-contains-any expecting all values matched
• Passing array of values to array-contains
• Using equality check on arrays