Virtual Events

How to Build Chat for Virtual Events

Developer Relations Team on Mar 28, 2023
How to Build Chat for Virtual Events

This how-to describes a demo which is built using Chat Components. Chat Components are open source and maintained by our wider developer community; they no longer receive feature updates from PubNub.

Virtual events need chat to keep users engaged, but it’s often a challenge to build a chat solution that works at scale and can handle the network load surges that occur during popular events.  As a developer, you need to select a robust backend API provider capable of transmitting and receiving the high volume of messages that your viewers and participants generate.  

PubNub has been tested with virtual events as the primary chat API and is trusted in production for events by customers like LiveLike or Veeps every day.

To create a safe and welcoming environment for event attendees, PubNub makes it easy to integrate live and extensible profanity filtering, either through PubNub functions or by integrating with one of our third-party partners. 

  • PubNub delivers billions of real-time messages every day, so your virtual event chat room can grow without limits.

  • Messages are persisted, so users can catch up on any messages they miss and jump right back into chat if they step away.

  • Keep users watching and engaged by sending push notifications for iOS and Android through PubNub. 

  • PubNub offers a free account tier, so you can start sending messages and prototyping immediately.

Architecting your Virtual Events app

PubNub offers a lot of flexibility when it comes to building your app.  Choose from one of our dozens of SDKs or rapidly build out your solution with our pre-built Chat Components designed for use with virtual events.  We have a useful guide to help you choose between an SDK or Chat Components but in summary:

  • Use an SDK where you need to support a platform not yet supported by Chat Components or where you have a pre-existing and specific scope in mind.

  • Use PubNub Chat components when you need to rapidly prototype a solution or you want to build your production app using opinionated best practices.  You can enable and disable features and customize the look and feel as needed by your application, leaving you free to concentrate on your application’s core functionality.

Regardless of which path you choose, because you are using PubNub your virtual events app will work at any scale, without channel or concurrency limitations.

The PubNub Chat Components establish best practices for building any chat application, including a virtual events app, so it is worth exploring them in more detail.  If you want to get started immediately, take a look at our virtual events demo or tutorial, both developed using PubNub React Chat Components.

Chat Components currently exist for React, Android, and iOS. Although the underlying implementation will be different on each platform, the functionality of each component is the same, allowing you to have a common chat experience on every platform.  

Your virtual events application is probably going to work something like this: users can choose from a number of streams to view and for each stream, can see & chat with the other viewers.  If we superimpose how Chat Components would look with that typical virtual events app, we get something that appears as follows: 

A component that displays the list of current channels; for virtual events, each stream or ‘room’ would be represented with a different channel.  Use this control to show all the channels a user can join or switch to. 

A component that displays the members present in each channel.  Every viewer or participant would be considered a member of whichever stream they are watching during a virtual event.  

A component to display all the messages sent by channel members and their reactions.  For virtual events, this would be the stream of messages generated by viewers & participants of the event.

A fully customizable component that allows a user to type a message in the chat.  Message input can be configured to include emoji support, the ability to send files and the typing indicator visibility.

A non-visual component that interfaces between PubNub and the rest of your chat components.  The chat provider provides callbacks for your application to register for events such as when viewers join a stream or send a message.  The Chat (Provider) also allows you to set global options including the ‘theme’ to select from a curated list of themes for your components.  Although themes are fully customizable, several predefined themes are included for virtual events designed to display the messages compactly.

Next Steps

This article only covered the principles of developing a virtual events chat application and how PubNub can be used to integrate chat into your app quickly and at an enormous scale.