Hello friends, SignalR is a concept through which servers and clients communicate instantly without waiting for each other. So in this blog, we will create a real-time chat application using SignalR with Blazor. So let’s start,
Introduction to SignalR
SignalR is a library for developers that can be used for creating real-time web functionality where clients can get new data without refreshing a web page. Using the SignalR server and the clients can communicate with each other instantly.The client is hosted in a browser and the server is hosted in our local machine where clients are connected with the server so clients can send and receive data to the server as shown in the above image, the server is SIgnalR Hub and the Clients are hub connections. So the Server can send data to clients and vice-versa.
Requirements for Create Chat app
Visual Studio 2022 or later versions.
.NET 6.0 SDK
Steps to Create Chat Application
- Create a new project in the visual studio 2022.
- Choose Blazor WebAssembly App template and click Next.
- Set a meaningful project name “BlazorSignalRChatApp” and location for project setup and click Next.
- Select .NET 6.0 framework and ASP.NET Core hosted checkbox.
- Click on the Create button
Install SignalR client library Package
Right-click on the BlazorSignalRChatApp.Client project from Solution Explorer and select Manage NuGet Packages.
Select nuget.org for managing NuGet Package sources.
In the Browse section, type Microsoft.AspNetCore.SignalR.Client and select the stable version and click the install button.
Click on the I Accept button to install the package
Add SignalR hub
In the BlazorSignalRChatApp.Server project, create Hubs folder and add class ChatHub.cs in that folder.
Add services and endpoint for SignalR Hub
Open Program.cs file from BlazorSignalRChatApp.Server project.
In this Program.cs file we need to follow the steps:
- Add Namespaces
- Add SignalR
- Add Response Compression Services
Have a Look at our Internship Program
Related Blog: Mobile App Development