Add Threads to Your Messaging Web App
In this third and final part of the series on creating a Messaging app using Bubble.is, you’ll learn how to create the actual messaging functionality of the app. Between the three videos in this series, you’ll learn how to create your own Messaging App using Bubble in less than an hour, start-to-finish.
In this third and final video in the series, I’ll show you how to create a new Thread (including adding Users to the thread), display your list of Threads and show how to message Users in each Thread. The three areas I’ll cover are:
1) Create Threads
In this part of the video, you’ll learn how to create the data structure in Bubble needed to support Messaging. There’s the Message data type which is for the actual message and the Message Thread data type which is used as a “container” for all the Messages in a Thread (or List of Messages). You’ll also see how to add Users using a Multi-dropdown input. This ability is made possible because of the Contacts created in the second video.
2) Display Message Threads
In the second part of the video, you’ll learn how to create a Repeating Group which shows all of the different Message Threads you belong to. You’ll also learn how to create a Custom State which will be used to show (or hide) the Message Thread Repeating Group as well as the actual Messages in a thread (the third part).
3) Display and Submit Messages
In the last part of the video, you’ll learn how to Submit Messages to the Thread. This part of the design uses a Repeating Group to show the Messages. It also uses a multi-line input for submitting the messages to the Messages Repeating Group. At the end of the video, you’ll also see a demo of two Users creating and sending messages and to each other.
In case you missed them, you can see the first and second blog posts or the YouTube playlist on this Messaging App series.
