Built to watch a message go from sent to seen.
A group chat app with live seen receipts, image sharing, and Firebase handling auth, data, and storage under one roof.
2023 · first Firebase build. Every screen is a client-side React component talking straight to Firestore — the security rules were the only backend it had. The patterns that grew into later projects' separated backends started here.
Design Team
3 members · live
Try it yourself
Send a message — it's liveTwo devices, one Firestore document. Send a message or an image on your device and watch it land on Alex's — then tick through delivered and seen, exactly as it does in the real app.
Your device
Alex Rivera
Direct message
Alex's device
You
Direct message
What's included
5 core systemsReal-time seen receipts
Sent → delivered → seen
Every message ticks through delivery states the moment the recipient's client acknowledges it — no polling, no refresh, driven by Firestore's live listeners.
Group chat rooms
Multi-participant threads
Conversations aren't limited to two people — rooms hold any number of participants, with membership and messages both synced live to everyone in the thread.
Image sending
Upload, preview, send
Photos upload straight to Firebase Storage and drop into the thread as soon as the upload resolves, sitting alongside text bubbles in the same timeline.
Firebase Auth, Firestore & Storage
One backend, three services
Sign-in, message data, and media all live in Firebase — Authentication gates who can read a room, Firestore holds the live message stream, Storage holds the files.
100% client-side SPA
No server of its own
Every screen is a React component talking directly to Firebase — there's no custom backend here. Firestore's security rules are the only thing standing at the door.
My first app that talked back in real time.
Client-side, Firebase-backed, and still the project every later build's architecture traces back to.