Create a chat application using .NET 7 / Angular14 / SignalR

You will create a chat application using .NET 7, Angular14 and SignalR from scratch

What you will learn

Create a chat application from scratch

.NET 7 Web Api

Angular 14


Angular Production Build

Azure deployment


In this course you will learn how to create an awesome but simple chat application using .NET7, SignalR and Angular.

You also learn how to deploy and publish your creative application onto Azure in order for everyone in this world use it and have fun with it.

You will learn how to use .NET Web Api talking with Angular project and how to use SignalR to to send asynchronous notifications to our angular web application where user can chat with each other.

After creating our application and finishing it, then we will use of Angular build cli command to make a production of our angular application. Everything from angular project will be built and stored in our Web API wwwwroot folder and from there we will be able to deploy our awesome application into Azure and make our chat application available for the rest of the world. We also how to use from github to save our changes into repository. We also learn how to design our chat application using Bootstrap 5. By the end of this course you will have the confident to write some basic web api, angular and signalr application from developing to production. We learn how to use of angular services in order to connect to signalr hubs as well.





Setup API and Angular Project

Environment setup and create api project
Implement ChatService
ChatController and Chathub
Create ClientApp
Layout the website
Register form
Reactive form and submition
Designing chatroom part 1
Designing chatroom part 2
Section 2 source code

Design and code chatroom

Display online users
Remove online users
Send public message
Send private message part 1
Send private message part 2
Section 3 source code

Angular Production Build

Angular production build
Azure deployment
Section 4 source code

Check Today's 30+ Free Courses on Telegram!

Ads Blocker Image Powered by Code Help Pro

Ads Blocker Detected!!!

We have detected that you are using extensions to block ads. Please support us by disabling these ads blocker.

Powered By
Best Wordpress Adblock Detecting Plugin | CHP Adblock