Adding documents (add vs set) in Firebase - Visual Side-by-Side Comparison

Process Flow - Adding documents (add vs set)

Start

↓

Choose collection

↓

Auto-generate ID

↓

Save data

↓

Document saved

↓

End

You start by choosing a collection. Using add creates a new document with an auto ID. Using set saves data to a document with a specified ID.

Execution Sample

Firebase

const docRef = await collectionRef.add({name: 'Alice'});
// vs
await collectionRef.doc('user123').set({name: 'Bob'});

Shows adding a document with auto ID vs setting a document with a specific ID.

Process Table

Step	Method	Document ID	Action	Result
1	add	auto-generated	Create new doc with auto ID	Document created with new ID
2	set	'user123'	Create or overwrite doc with ID 'user123'	Document created or replaced
3	add	auto-generated	Add another doc with auto ID	New document created with different ID
4	set	'user123'	Overwrite doc with ID 'user123'	Document data replaced
5	end	-	-	No more actions

💡 No more document operations, process ends.

Status Tracker

Variable	Start	After 1	After 2	After 3	After 4	Final
docRef.id	undefined	auto-generated ID 1	auto-generated ID 1	auto-generated ID 1	auto-generated ID 1	auto-generated ID 1
collectionRef.docs	empty	1 doc (auto ID 1)	2 docs (auto ID 1, 'user123')	3 docs (auto ID 1, 'user123', auto ID 2)	3 docs (auto ID 1, 'user123' updated, auto ID 2)	3 docs (final state)

Key Moments - 2 Insights

Why does add create a new document each time but set can overwrite?

Because add auto-generates a unique ID for each document (see step 1 and 3), while set uses the specified ID and replaces data if the document exists (see step 2 and 4).

Can set create a document if it doesn't exist?

Yes, set creates the document if it does not exist, as shown in step 2 where 'user123' is created.

Visual Quiz - 3 Questions

Look at the execution table, what is the document ID created by the first add method?

A auto-generated ID 1

B 'user123'

C auto-generated ID 2

D undefined

💡 Hint

Check row 1 under Document ID in the execution_table.

At which step does the document with ID 'user123' get overwritten?

A Step 1

B Step 2

C Step 4

D Step 3

💡 Hint

Look at the Action and Result columns for 'user123' in the execution_table.

If you want to add multiple documents without specifying IDs, which method should you use?

A set

B add

C doc

D update

💡 Hint

Refer to the concept_flow where add auto-generates IDs for new documents.

Concept Snapshot

add(): Adds a new document with an auto-generated ID.
set(): Creates or overwrites a document with a specified ID.
Use add for quick inserts without ID control.
Use set to control document IDs or overwrite.
add returns a reference to the new doc.
set returns a promise after write completes.

Full Transcript

This visual execution shows how Firebase Firestore adds documents using add and set methods. First, add creates a new document with an auto-generated ID, ensuring unique documents each time. Then, set creates or overwrites a document with a specified ID, allowing control over document keys. The execution table traces each step, showing document IDs and actions. Variable tracking shows how document references and collection contents change. Key moments clarify why add always creates new docs and set can overwrite. The quiz tests understanding of document IDs and method choices. The snapshot summarizes usage rules for add and set.

Practice

1. What is the main difference between add and set when adding documents in Firebase?

easy

A. add creates a document with an automatic unique ID, set uses a specified ID.

B. add updates existing documents, set only creates new documents.

C. add deletes documents, set reads documents.

D. add requires a document ID, set generates one automatically.

Solution

1. Step 1: Understand add behavior

   add creates a new document with a unique ID generated by Firebase automatically.

2. Step 2: Understand set behavior

   set creates or updates a document at a specified ID you provide.

3. Final Answer:

   add creates a document with an automatic unique ID, set uses a specified ID. -> Option A

4. Quick Check:

   add auto ID, set specified ID = A [OK]

Hint: Remember: add auto-generates ID, set needs your ID [OK]

Common Mistakes:

• Thinking set always creates new documents only
• Confusing which method generates IDs automatically
• Assuming add can update existing documents

2. Which of the following is the correct syntax to add a new document with an automatic ID in Firebase Firestore?

easy

A. db.collection('users').add({name: 'Alice'})

B. db.collection('users').set({name: 'Alice'})

C. db.collection('users').doc('user1').add({name: 'Alice'})

D. db.collection('users').doc().add({name: 'Alice'})

Solution

1. Step 1: Identify method for automatic ID

   add creates a new document with an automatic ID inside a collection.

2. Step 2: Check syntax correctness

   db.collection('users').add({name: 'Alice'}) is the correct syntax to add a new document with auto ID.

3. Final Answer:

   db.collection('users').add({name: 'Alice'}) -> Option A

4. Quick Check:

   Use add for auto ID = B [OK]

Hint: Use add() on collection to auto-generate document ID [OK]

Common Mistakes:

• Using set() without specifying a document ID
• Calling add() on a document reference instead of collection
• Using doc() without an ID then calling add()

3. What will be the result of this code snippet?

db.collection('products').doc('p1').set({name: 'Book', price: 10});
db.collection('products').doc('p1').set({price: 12});

medium

A. The document 'p1' will have {name: 'Book', price: 12}

B. The document 'p1' will have {name: 'Book', price: 10, price: 12}

C. The document 'p1' will have only {price: 12}, name is removed

D. An error occurs because set is called twice

Solution

1. Step 1: Analyze first set call

   The first set creates or overwrites document 'p1' with {name: 'Book', price: 10}.

2. Step 2: Analyze second set call without merge

   The second set overwrites the entire document with {price: 12}, removing 'name' because merge option is not used.

3. Final Answer:

   The document 'p1' will have only {price: 12}, name is removed -> Option C

4. Quick Check:

   set without merge overwrites whole document = C [OK]

Hint: set without merge replaces whole document, removing old fields [OK]

Common Mistakes:

• Assuming set merges fields by default
• Expecting both name and price to remain
• Thinking calling set twice causes error

4. Identify the error in this code snippet and how to fix it:

db.collection('orders').add({id: 'order1', total: 50});
db.collection('orders').doc('order1').set({total: 60});

medium

A. No error; both lines work fine together.

B. The first line creates a document with a random ID, so the second line updates a different document.

C. The second line should use add() instead of set().

D. The first line should specify the document ID using doc('order1').set() instead of add().

Solution

1. Step 1: Understand add() behavior

   The first line adds a document with a random ID, ignoring the 'id' field inside data.

2. Step 2: Understand doc('order1').set() behavior

   The second line sets data on a document with ID 'order1', which is different from the random ID created before.

3. Step 3: Identify mismatch

   Because IDs differ, the second line updates a different document than the one created by add().

4. Final Answer:

   The first line creates a document with a random ID, so the second line updates a different document. -> Option B

5. Quick Check:

   add() random ID ≠ doc('order1') ID = A [OK]

Hint: add() ignores id field; doc(id).set() targets specific document [OK]

Common Mistakes:

• Assuming add() uses the id field as document ID
• Using set() on a doc without knowing if it exists
• Expecting add() and set() to affect same document automatically

5. You want to update only the 'price' field of a document without removing other fields. Which Firebase method and option should you use?

hard

A. Use add() with the new price data.

B. Use set() without any options.

C. Use update() without any options.

D. Use set() with {merge: true} option.

Solution

1. Step 1: Understand add() behavior

   add() creates a new document with a random ID; it cannot update existing documents.

2. Step 2: Understand set() without merge

   set() without options overwrites the whole document, removing other fields.

3. Step 3: Understand set() with merge option

   set() with {merge: true} updates only specified fields, keeping others intact.

4. Step 4: Consider update()

   update() also updates fields but requires the document to exist; set() with merge works even if document is new.

5. Final Answer:

   Use set() with {merge: true} option. -> Option D

6. Quick Check:

   Partial update without overwrite = set() + merge true = D [OK]

Hint: Use set() with merge:true to update fields without deleting others [OK]

Common Mistakes:

• Using add() to update existing documents
• Using set() without merge and losing data
• Confusing update() with set() merge behavior