# How to use Firebase's Realtime DataBase in Thunkable Drag And Drop

**URL:** https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164
**Category:** Feedback
**Tags:** firebase, realtimedb
**Created:** [April 29, 2021, 2:56pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164 "2021-04-29T14:56:06Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![tulsiyandev7659du](https://avatars.discourse-cdn.com/v4/letter/t/9de0a6/32.png) [@tulsiyandev7659du](https://community.thunkable.com/u/tulsiyandev7659du)
#### Post date: [April 29, 2021, 2:56pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/1 "2021-04-29T14:56:06Z")

</div>

There is no option to add Realtime DB UI Component in Thunkable Drag and Drop Interface.

---

<div class="post-metadata">

### Author: ![codeswept](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/codeswept/32/87755_2.png) [@codeswept](https://community.thunkable.com/u/codeswept)
#### Post date: [April 29, 2021, 2:56pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/2 "2021-04-29T14:56:55Z")

</div>

DnD users are intended to use cloud variables.

---

<div class="post-metadata">

### Author: ![tulsiyandev7659du](https://avatars.discourse-cdn.com/v4/letter/t/9de0a6/32.png) [@tulsiyandev7659du](https://community.thunkable.com/u/tulsiyandev7659du)
#### Post date: [April 29, 2021, 2:57pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/3 "2021-04-29T14:57:48Z")

</div>

I Haven’t Learned Using It yet. I Only Knew About Realtime DB

---

<div class="post-metadata">

### Author: ![codeswept](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/codeswept/32/87755_2.png) [@codeswept](https://community.thunkable.com/u/codeswept)
#### Post date: [April 29, 2021, 2:59pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/4 "2021-04-29T14:59:42Z")

</div>

It’s just a much quicker way of user RTDB. Check out the docs [Variables - Thunkable Docs](https://docs.thunkable.com/variables#cloud-variables)

---

<div class="post-metadata">

### Author: ![tulsiyandev7659du](https://avatars.discourse-cdn.com/v4/letter/t/9de0a6/32.png) [@tulsiyandev7659du](https://community.thunkable.com/u/tulsiyandev7659du)
#### Post date: [April 29, 2021, 3:01pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/5 "2021-04-29T15:01:16Z")

</div>

But I Have Taken A Corse And I Am Going To Learn It Later.

---

<div class="post-metadata">

### Author: ![codeswept](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/codeswept/32/87755_2.png) [@codeswept](https://community.thunkable.com/u/codeswept)
#### Post date: [April 29, 2021, 3:12pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/6 "2021-04-29T15:12:53Z")

</div>

Then you’ll have to use the legacy UI. By the way, which course have you taken? I’m interested in Thunkable courses.

---

<div class="post-metadata">

### Author: ![cyberdriver](https://avatars.discourse-cdn.com/v4/letter/c/5e9695/32.png) [@cyberdriver](https://community.thunkable.com/u/cyberdriver)
#### Post date: [April 29, 2021, 6:56pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/7 "2021-04-29T18:56:17Z")

</div>

> [@Are there plans to add proper support for Firebase RT database to the new UI?](https://community.thunkable.com/t/are-there-plans-to-add-proper-support-for-firebase-rt-database-to-the-new-ui/1176442/3):
>
> Oops, the “set app variable” is supposed to be “set cloud variable” but you can change that in the drop down.

---

<div class="post-metadata">

### Author: ![tulsiyandev7659du](https://avatars.discourse-cdn.com/v4/letter/t/9de0a6/32.png) [@tulsiyandev7659du](https://community.thunkable.com/u/tulsiyandev7659du)
#### Post date: [April 30, 2021, 7:30am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/8 "2021-04-30T07:30:21Z")

</div>

In One Of my project in Drag And Drop, I actually Get RealTime DB in the blocks section. But in another Project I Get Nothing.

 ![2021-04-30_13-02-32](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/b/c/bcd3df890fe41aa305cf3983a616e3aebd5fc175.png)  
This is drag and drop interface as UI Components are Above Core.

---

<div class="post-metadata">

### Author: ![muneer](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/muneer/32/75210_2.png) [@muneer](https://community.thunkable.com/u/muneer)
#### Post date: [April 30, 2021, 7:46am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/9 "2021-04-30T07:46:59Z")

</div>

It looks to me that you have imported this code from a saved screen. I noticed when you import a “saved screen” the component list changes to one similar to the old UI every time you are using the saved screen but when you switch to any of the new screens the component list goes back to the new component list.

See this screenshot from the new UI but I imported the **switch** from an old “Saved Screen”

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/3/3/334fa903688af93e645fd40a006758457e317283.png)

---

<div class="post-metadata">

### Author: ![tulsiyandev7659du](https://avatars.discourse-cdn.com/v4/letter/t/9de0a6/32.png) [@tulsiyandev7659du](https://community.thunkable.com/u/tulsiyandev7659du)
#### Post date: [April 30, 2021, 8:10am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/10 "2021-04-30T08:10:56Z")

</div>

Oh ok

---

<div class="post-metadata">

### Author: ![student.education.20](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@student.education.20](https://community.thunkable.com/u/student.education.20)
#### Post date: [December 29, 2021, 10:57am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/11 "2021-12-29T10:57:56Z")

</div>

Hi  
I am little confused in this.  
Can anyone tell me how to use this code as cloud variable one? I mean how to convert this code using cloud variable?  
(with a specific key in RTDB)  
 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/d/1/d189cf1acf6b3e060f87304c753d6e4e47dfc1e5.jpeg)

---

<div class="post-metadata">

### Author: ![muneer](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/muneer/32/75210_2.png) [@muneer](https://community.thunkable.com/u/muneer)
#### Post date: [December 29, 2021, 11:11am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/12 "2021-12-29T11:11:03Z")

</div>

> [@student.education.20](#):
>
> (with a specific key in RTDB)

See this example

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/c/2/c2c9f847c00d02d0187919b271d110136450bf25.png)

---

<div class="post-metadata">

### Author: ![student.education.20](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@student.education.20](https://community.thunkable.com/u/student.education.20)
#### Post date: [December 29, 2021, 11:14am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/13 "2021-12-29T11:14:28Z")

</div>

Thank you @muneer !!  
I’ll try this out and let you know if I have any doubts!

---

<div class="post-metadata">

### Author: ![student.education.20](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@student.education.20](https://community.thunkable.com/u/student.education.20)
#### Post date: [December 29, 2021, 11:30am UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/14 "2021-12-29T11:30:55Z")

</div>

Thank you so much @muneer It worked!! 😃

---

<div class="post-metadata">

### Author: ![muneer](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/muneer/32/75210_2.png) [@muneer](https://community.thunkable.com/u/muneer)
#### Post date: [December 29, 2021, 12:21pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/15 "2021-12-29T12:21:33Z")

</div>

> [@student.education.20](#):
>
> Thank you so much

Welcome

---

<div class="post-metadata">

### Author: ![student.education.20](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@student.education.20](https://community.thunkable.com/u/student.education.20)
#### Post date: [December 29, 2021, 1:00pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/16 "2021-12-29T13:00:07Z")

</div>

@muneer  
Just a small doubt… What if I have to save an image? I will do that using a “url” block right? And also for location?  
Can you please clear this too? And if possible can you share a code for the same?  
Thank you.  
Regards,  
A learner.

---

<div class="post-metadata">

### Author: ![muneer](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/muneer/32/75210_2.png) [@muneer](https://community.thunkable.com/u/muneer)
#### Post date: [December 29, 2021, 3:25pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/17 "2021-12-29T15:25:31Z")

</div>

> [@student.education.20](#):
>
> I will do that using a “url” block right? And also for location?

Firebase RealtimeDB will not save an image directly in the database. However, you can upload the image to any cloud storage and obtain the URL to the image and save it in a key in the database.

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/4/0/40fd2e4b24ee88011d9267d593b8208c215e87df.png)

To upload images from the app you need to use `Cloudinary` and `Media DB` components.

---

<div class="post-metadata">

### Author: ![student.education.20](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@student.education.20](https://community.thunkable.com/u/student.education.20)
#### Post date: [December 29, 2021, 3:34pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/18 "2021-12-29T15:34:32Z")

</div>

Ok Thank you!

---

<div class="post-metadata">

### Author: ![sellymitramailandash](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/sellymitramailandash/32/128377_2.png) [@sellymitramailandash](https://community.thunkable.com/u/sellymitramailandash)
#### Post date: [March 10, 2022, 3:20pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/19 "2022-03-10T15:20:13Z")

</div>

Hi There,

I am interested in drag and drop Thunkable right now and then I tried to make Chat App on DnD Thunkable. After I read the problem on this room discussing and then I realized that I have the same problem like I can’t find block for Realtime Database on DnD Thunkable. Can anybody or you help me? Because this is 2022 maybe someone has been found the trick for the block of Realtime DB on DnD Thunkable, because I didn’t understand if I am using cloud on DnD Thunkable for Realtime DB block.

---

<div class="post-metadata">

### Author: ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)
#### Post date: [March 10, 2022, 3:21pm UTC](https://community.thunkable.com/t/how-to-use-firebases-realtime-database-in-thunkable-drag-and-drop/1253164/20 "2022-03-10T15:21:36Z")

</div>

> [@sellymitramailandash](#):
>
> find block for Realtime Database on DnD Thunkable. Can anybody or you help me? Because this is 2022 maybe someone has been found the trick for the block of Realtime DB on DnD Thunkable, because I didn’t understand if I am using cloud on Dn

Hey @sellymitramailandash, the answer is 2 posts above yours. In the DnD version, to use firebase, you’ll use the cloud variables. Here is a link to the relevant [docs](https://docs.thunkable.com/variables#cloud-variables)
