Real-time Chat App with SignalR

Project roadmap

1. 01

   Create the hub and send messages

   ~2h

   Create an ASP.NET Core project with a ChatHub mapped at /hubs/chat, and a simple page using the @microsoft/signalr JavaScript client. Add a simple login (cookie authentication with a username is enough), and require it on the hub. SendMessage validates the text (1 to 1,000 characters) and broadcasts it with the sender's name from Context.User, never from the client. Done when: two browsers can exchange messages through the hub.

2. 02

   Add rooms with groups

   ~1.5h

   Add JoinRoom and LeaveRoom methods that add and remove the connection from SignalR groups, and send messages only to the room's group. Show a room list on the page and let users switch rooms. Validate room names. Done when: messages sent in one room only reach people in that room.

3. 03

   Track who's online

   ~2h

   Keep a thread-safe record (a ConcurrentDictionary in a singleton service) of which users are in which rooms, remembering that one user may have several connections (tabs). Update it in JoinRoom, LeaveRoom and OnDisconnectedAsync, and broadcast user joined and user left only when a user's first connection joins or last one leaves. Show the online list in each room. Done when: opening and closing tabs keeps the online list correct.

4. 04

   Add typing indicators

   ~1h

   When the user types, send a Typing notice to the room at most once every 2 seconds (throttled in the client), and show Name is typing… to others, hiding it after 4 seconds without a new notice or when that user's message arrives. Don't send typing notices back to the sender. Done when: typing indicators appear and disappear correctly in other browsers.

5. 05

   Save message history with EF Core

   ~2h

   Store messages (room, user, text and time) in a database with EF Core (SQLite or PostgreSQL), saving them in SendMessage before broadcasting. When a user joins a room, send them the last 50 messages, and let them load older ones by paging. Add an index on room and time. Done when: joining a room shows its history, and it survives a server restart.

6. 06

   Handle reconnection and scaling

   ~2h

   Use withAutomaticReconnect in the client, show the connection state (connected, reconnecting or disconnected), and after reconnecting, rejoin rooms and fetch messages missed while disconnected (by the last seen message id). Write SCALING.md explaining why presence stored in memory breaks with several servers, and how to add a Redis backplane (AddStackExchangeRedis) and move presence into Redis. Done when: stopping and starting the server makes clients reconnect and catch up, and SCALING.md explains multi-server setup.

7. 07

   Test it

   ~2h

   Write integration tests with WebApplicationFactory and the .NET SignalR client (HubConnectionBuilder using the test server's handler): messages reach only the right room, presence with multiple connections, history on join, validation of message length, and unauthenticated connections refused. Done when: dotnet test passes.

Resources

• DocsASP.NET Core SignalR overview
• DocsSignalR: manage users and groups
• DocsSignalR JavaScript client
• DocsSignalR: Redis backplane
• DocsEF Core: getting started