See here how to use Firebase with ChatView Component

I see many users ask for how to use ChatView Component, including myself a few days ago. Here’s how I managed to do it with use of firebase!

How it looks:

How the Firebase looks:

And the blocks I’ve used:

Maybe this is not much of a tutorial, but it’s a guide for using ChatView with Firebase.

Hope this helps alot of you :slight_smile:


@plang58 read this thread !
Tysm @Choofa :slight_smile:


Its Component, not Companion. I’ll correct that sunny :sun_with_face:


Oh, my mistake, it’s now edited :stuck_out_tongue_winking_eye:


I am try your idea but
Why show this error

1 Like

Show me your blocks please.

1 Like

hello thx for your help, but i work a bit different as yours. i dont understand the use for the user img. downcase. Where do you safe the img for the users. i work like this

The last input in the component store value is for the user img. This is only for the test later this will be the url of the uploaded user img what you bget/got if you upload a img to firebase with the addon/extension.

I got this chat to work with some help of a user. i changed a bit that i have a timestamp and a id like yours.


I have only familymembers in my app, so I store the userimage in assets with their name.png, that’s why I use downcase with .png as ending, so it picks the users image from assets and the downcase is becase the username is with CAPITAL first letter, but .png file are with only small letters.

I see you store global username(is this working for you?), cuz then it always will be overwritten by new messages from that username.

yes i want this so. i dont want to have to much msg in the firebase database. if you want it like you make only the id block before you put in the username in the store value block.

Ok, I’ve made a delete function so I delete old messages sometimes. I like to be able to see some of the old messages, like last 10 days or so :slight_smile: If you close your app and someone writes to you, you won’t see it because if they write something after that it’s not showing, if you know what I mean. You will only see what’s written if you have the app running yourself.

It’s also possible to make a autodelete when messages is older than a week it will be deleted, that’s also a way to work it.


yes but if you want to see all the msg you need the get tag list block or? does this work with the data changed block. you get the data if the database was changed. to get all other msgs, you need as i told, the other block, or is this wrong.? or do you this with the other method. or is my thinking wrong?

I only use the blocks you see in picture. I only use when data changed :slight_smile:

I can close the app and run it again and still the chat is there will all messages :wink:

did you id system work if 2 or 3 devices are in the chat?

Yes, it works with 2 and more devices :wink:


because i dont understand how the smatphone will know which id you have

Because I give new id to every new message and not the users.

yes but how does the other device know this you dont get the id in a block. like get value or so

I don’t understand?
Every installed app has the same blocks, like when someone sends a message it’s uploaded with a new unique ID. Then when someone else with this app runs the chat it will check if the data has been changed, and if so, then it will add this message to chat with last ID in bottom of chat.

Tip: If you start sharing some of your blocks and maybe show how your database is shown it would be ALOT easier to help you :slight_smile:

EDIT: I forgot that you shared the blocks in a picture earlier on this topic. I will have a look at it later and see what I can find out. But now I’m going to the doctor, see you later!

Hey, okok i understand i thought the data changed block gives me only the data what is changed i dont knew that the block safe the last input and if the database is changed since the last input you will get all input what is different. I understand the block wrong now i know how this block works correctly.
Thaks this helps a lot for the future, my system works to but you have only a chat if you are online, needs less data. I Implement now to send pictures. I made different chatrooms with project Bucket. user wants to change the chat room than the block for project bucket gets changed. I need a person to person chat. This is what i dont know how to implement. I think with a second component for firebase. and than i have no idea haha.

Good you now understands, if you still need help understanding this component send me a PM :+1:

Add a new topic with this question you need help with, then I can see if I can help you :+1: