Add chat to bubble app


I’ve been wanting to add a chat to my single page application, but I don’t know how. The chat just needs to allow messaging between 2 people.

Another way I’ve been thinking about implementing a chat feature is through Twilio’s proxy service. Like when door dash connects the customers & drivers through random masked phone numbers.

If anyone knows or can help with any of this, it would be very appreciated!!

Do the two people have accounts on your platform already? You could create a table of Chats that has a list of Chat Messages in them. The table of Chats could have a chat owner and then chat members.

Yes, they do have accounts with the platform.

How would I create a table of chats?

Take a look at this whatsapp clone I am building.

Forum post:

In bubble your tables are basically called data types. It would be a new custom data type that you create to represent what the use would see within the chats.

How would you design the user interface to show each users messages? & how would you keep each users’ messages on the right side of the screen while the person they are chatting with has their messages on the other side?

I would recommend designing a flexible layout using one container/ground set as a row. Give it 100% width and 100% height then inside of that group put yourself two more groups. One can be set to like 20% and one can be set to 80%. Of course you will need to tune those values to your specific needs. Then in the individual chat group you’d use a repeating group but use the chat modifier so that the messages go from the bottom up. Then the narrow column would be a repeating group of all of the different chats.

This tutorial will give you good intro on the topic

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.