Flutter Real-time Chat App

Project roadmap

1. 01

   Set up authentication

   ~2h

   Create a Firebase project and implement email/password sign-up and sign-in.

2. 02

   Build the WebSocket layer

   ~2.5h

   Create a connection service and message models for sending and receiving chat messages over WebSockets.

3. 03

   Build chat screens

   ~2.5h

   Implement a room list screen and a StreamBuilder-driven message screen with a message composer.

4. 04

   Add presence and typing indicators

   ~2h

   Show which users are online and display a typing indicator while another user is composing a message.

5. 05

   Handle reconnection

   ~2.5h

   Detect dropped connections, reconnect automatically, and queue messages sent while offline.

6. 06

   Add push notifications

   ~2h

   Integrate Firebase Cloud Messaging to notify users of new messages when the app is backgrounded.

Resources

• DocsDart Guides