Создание чата в Bubble.is (Bubble.io) (Часть 4 / 5)

YOUTUBE · 23.11.2025 05:33

Ключевые темы и таймкоды

Создание чата

1:02
  • Пользователь ищет продавца на сайте, фильтруя по роли.
  • Создается чат с выбранным продавцом.

Переход на страницу чата

3:14
  • При нажатии на кнопку "Написать сообщение" пользователь переходит на страницу чата.
  • Если чата с выбранным пользователем нет, он создается.

Отображение данных на странице чата

6:52
  • При переходе на страницу чата передается параметр "селектор чата", который содержит идентификатор созданного чата.
  • При загрузке страницы, если параметр "селектор чата" не пустой, выполняется действие.

Подключение данных к элементам страницы

10:27
  • При выборе элемента в списке чатов, список сообщений переключается.
  • При клике на иконку пользователя, его фотография, имя и время отправки сообщения отображаются на странице.

Создание механики выбора чата

14:10
  • Удаление и создание нового пользователя в группе.
  • Использование айдишки для упрощения процесса.

Отображение сообщений в чате

17:56
  • Вывод фотографии создателя сообщения, времени отправки и текста сообщения.
  • Использование кастомного оформления для отображения времени и даты.

Создание командного интерфейса

22:01
  • Создание кнопки отправки сообщения и настройка флоу.
  • Создание сообщения в чате и его закрепление за активным чатом.

Сортировка и обновление сообщений

26:58
  • Сортировка сообщений по дате создания.
  • Обновление списка чатов и отображение последних сообщений.

Тестирование чата

29:19
  • Авторизуются в приложении в роли покупателя и выбирают поставщика.
  • Создают чат с выбранным поставщиком и отправляют сообщение.

Авторизация в роли продавца

31:29
  • Авторизуются в приложении в роли продавца и проверяют, что сообщение было получено.
  • Добавляют иконку пользователя и просматривают сообщения.

Отправка файлов

33:22
  • Отправляют файлы в виде картинок в сообщении.
  • Сортируют сообщения по дате и времени.

Финализация чата

35:06
  • Добавляют имя пользователя в чат и выделяют его жирным шрифтом.
  • Добавляют количество непрочитанных сообщений и время последнего посещения сайта.
  • Планируют добавить функцию чтения сообщений и их удаления из списка.