Real-time communication system using SignalR

Introduction

This chat system provides essential features for an interactive and seamless experience. Users can easily connect by providing their username. Once connected, they can send messages to other connected users. Thanks to the power of SignalR, all users receive messages in real-time without having to refresh the page. Additionally, our system displays a list of connected users, offering a convenient overview of the online community. Enjoy instant and convenient communication with our SignalR-based chat application!

Contributors

The following individuals have contributed to the development of this application:

• FRIKH SAID
• DAAOUAN MOHAMMED

table of contents

• Web Socket

• SignalR

• .Net & Angular

• Our application

Web Socket

WebSockets enable real-time, bidirectional communication between clients and servers. With a persistent connection, data transmission becomes efficient and instant. Widely used in applications requiring instant updates, WebSockets power chat systems, collaboration tools, and live streaming apps. Leveraging this protocol creates interactive web experiences, enhancing user engagement and performance.

SignalR

SignalR is a powerful real-time communication library for web applications. It simplifies the development process by handling connections and real-time updates. With SignalR, developers can easily implement features like chat systems and live notifications. It supports various transport mechanisms for compatibility across platforms and browsers.

.Net & Angular

.Net

.NET is a versatile framework developed by Microsoft, offering a wide range of tools and libraries for application development across different platforms. It provides developers with a solid foundation for building scalable, secure, and high-performance software solutions.

Angular

Angular is a powerful front-end framework developed by Google, providing a robust set of tools for building dynamic web applications. It follows a component-based architecture, allowing for modular and reusable code. With Angular, developers can create responsive and scalable applications with ease.

Our application

First page

Username invalid

Username already exist

Note that the user connected is in green color

Conversation from user1 "Mohammed" connection

Conversation from user2 "Said" connection

Conversation from user3 "Sara" connection

The back-to-home button will get you back to the first page and the username will disappear from the users list

Private chat option: on click on the user who we want to talk to, a private chat modal form will display