Back to battles
mediumupcoming
Chat Room
A real-time chat application with rooms, typing indicators, and message features.
35 min limit0 participants
javascriptcsswebsocket
PRD
# Chat Room PRD ## Overview Build a real-time chat application with multiple rooms, typing indicators, message reactions, and user presence, simulating a multi-user experience with localStorage and mock data. ## Requirements - Set username on join with a welcome screen - Multiple chat rooms with create and join functionality - Message input with send button and Enter key to submit - Message display with username, timestamp, and avatar - Typing indicator showing "user is typing..." status - Message reactions with emoji picker - Edit own messages after sending - Delete own messages - System messages for user joined and left events - Online users list displayed per room - Unread message count badge per room - Scroll to bottom button when new messages arrive - Message search across chat history - Link preview detecting URLs in messages - Image URL preview rendered inline - Notification sound toggle for new messages - Persist messages to localStorage - Simulate multiple users with mock data or multiple browser tabs ## Tech Stack - JavaScript or any frontend framework - localStorage and BroadcastChannel API for cross-tab simulation - No chat or messaging libraries ## Scoring Criteria - **Functional (40%)**: Chat messaging works, rooms function, reactions and editing work - **Quality (20%)**: Smooth real-time feel, proper scroll behavior, clean message rendering - **Fidelity (25%)**: All features present including typing indicator, search, link previews, and presence - **Speed (15%)**: Time bonus
Battle Stats
Time Limit35 min
Participants0
Statusupcoming
Rules
- AI-assisted coding tools only -- no manual edits
- Stay within the time limit
- Scoring based on correctness, code quality, and speed
- Session must be recorded via the CLI