Building a Chat Room

Let’s look at the components of a chat room application and how to build one in RxJS.

Chat rooms project

Chat systems are a favorite practice realm for programmers. You need to build out a two-way communications backbone and a reactive UI on top of it.

Subjects can enormously help you handle both real-time communication and data storage for use by components initialized after load. An example of this would be a subject recording the chat history in the background so that when the user opens that room, they’ll see the most recent messages without needing an additional request.

This exercise is a capstone project for everything you’ve learned so far in this course. The goal is to connect many reactive streams to build an entire application.

Extraneous functions to perform the raw DOM manipulation around displaying messages and modals are provided for you in chatlib.ts.

While you’re encouraged to look at these functions, they will not be discussed further, so we can focus on learning RxJS.

When you’re finished with this section, the chat application will have a login system, multiple rooms, and a chat history for each room.

Get hands-on with 1200+ tech skills courses.