# Managing database data

Now that you've added your Firebase database as the data source, you can start managing its data. Here, you'll learn how to perform *CRUD operations* with [Firebase Realtime DB](#firebase-realtime-db-operations) and [Firestore](#firestore-operations).

## Firebase Realtime DB operations

### Read data

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code:

```javascript
const userId = firebase.auth().currentUser.uid;
return firebase
  .database()
  .ref('/users/' + userId)
  .once('value')
  .then(snapshot => snapshot.val());
```

<figure><img src="/files/DQnBHt9W1DewNEAqmoRl" alt=""><figcaption></figcaption></figure>

2. Click **Execute action** and check the *Result* tab - the data should be there.

### Add a record

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code:

```javascript
const listRef = firebase.database().ref("list/");

listRef.set({
   record1: {
      field1: newValue1,
      field2: newValue2,
   },
});
```

<figure><img src="/files/dVD6qoC6RXmYE9eD8LTM" alt=""><figcaption></figcaption></figure>

2. Click **Execute action** and check the *Result* tab - the new record should be created.

### Update a record

Updates can be executed using *two methods* - `set()` and `update()`. Below you'll find an example of both methods.

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code depending on the selected method:

* `set()`

```javascript
const listRef = firebase.database().ref("list/record");

listRef.set({
      field1: newValue1,
      field2: newValue2,
});
```

{% hint style="warning" %}
Please note that `set()` can overwrite your data, while `update()` only updates the required fields.
{% endhint %}

* `update()`

```javascript
const recordRef = firebase.database().ref("list/record");

recordRef.update({
   field1: newValue1,
});
```

2. Click **Execute action** and check the *Result* tab - the requested records should be updated with the new values.

### Delete a record

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code:

```javascript
const recordRef = firebase.database().ref("list/record");
recordRef.remove();
```

<figure><img src="/files/PArPUBd7JtOokpe52tR3" alt=""><figcaption></figcaption></figure>

2. Click **Execute action** and check the *Result* tab - the specific record should be removed.

All other operations with the Realtime Database data like *Filter, Order, etc.* can be done via the Firestore API. You can find the API reference [here](https://firebase.google.com/docs/database/web/lists-of-data?authuser=1).

***

You can also check out more useful articles on how to further manage your data in UI Bakery:point\_down:

{% content-ref url="/pages/FlXv8DDV9LepOxZWK1Z5" %}
[Data mapping & transforming](/build-from-scratch/getting-started/transform-data-with-javascript/mapping-and-transforming-data.md)
{% endcontent-ref %}

{% content-ref url="/pages/A1K6ffkaBf0Sq0hH1au3" %}
[Bind data to UI](/build-from-scratch/getting-started/bind-data-to-ui.md)
{% endcontent-ref %}

## Firestore operations

### List data

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code to load your Firestore collection:

```javascript
const collection = await firebase.firestore().collection("collectionName").get();
const result = [];
collection.forEach(doc => {
    const data = doc.data();
    result.push({ id: doc.id, ...data });
});
return result;
```

<figure><img src="/files/zq3d10wV20xgWAEOReSJ" alt=""><figcaption></figcaption></figure>

2. Click **Execute action** and check the *Result* tab - your collection data should be displayed.

### Read a document

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code to fetch data about a specific document:

```javascript
const doc = await firebase.firestore().collection('collectionName').doc('docID').get();
return doc.data();
```

<figure><img src="/files/NAnApKW1LK4JB4z2LRDe" alt=""><figcaption></figcaption></figure>

2. Click **Execute action** and check the *Result* tab - document data should be displayed.

### Create a new record

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code:

```javascript
const newUser = { name: "Nik" };
const doc = await firebase.firestore().collection("collectionName").add(newUser);
return doc.id;
```

<figure><img src="/files/f8QOsuRN0bHb7o8oY2YQ" alt=""><figcaption></figcaption></figure>

2. Click **Execute action** and check the *Result* tab - the new record should be there.

### Delete a record

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code:

```javascript
await firebase.firestore().collection('collectionName').doc('docID').delete(); 
```

2. Click **Execute action** and check the *Result* tab - the record should be deleted.

### **Update a record**

Updates can be executed using *two methods* - `set()` and `update()`. The difference between them is that `set()` will overwrite the whole document while `update()`will update only specific fields that need to be updated. \
Below you'll find an example of both methods.

1. [Create a new action](/concepts/actions/action-basics.md#creating-actions) of the **JavaScript Code** type and add the following code depending on the selected method:

* `set()`

```javascript
const doc = await firebase.firestore().collection('collectionName').doc('docID').set({
    docField: newFieldValue
});
```

{% hint style="info" %}
If you don't want to overwrite your data, you can add `merge: true` to your code so that only the required fields will be updated.
{% endhint %}

* `update()`

```javascript
const doc = await firebase.firestore().collection('collectionName').doc('docID').update({
    docField: newFieldValue
});
```

2. Click **Execute action** and check the *Result* tab - the requested records should be updated with the new values.

All other operations with the Firestore collections like *Filter, Order, etc.* can be done via the Firestore API. You can find the API reference [here](https://firebase.google.com/docs/firestore/query-data/get-data).

***

You can also check out more useful articles on how to further manage your data in UI Bakery:point\_down:

{% content-ref url="/pages/FlXv8DDV9LepOxZWK1Z5" %}
[Data mapping & transforming](/build-from-scratch/getting-started/transform-data-with-javascript/mapping-and-transforming-data.md)
{% endcontent-ref %}

{% content-ref url="/pages/A1K6ffkaBf0Sq0hH1au3" %}
[Bind data to UI](/build-from-scratch/getting-started/bind-data-to-ui.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.uibakery.io/reference/data-sources/firebase/realtime-database.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.