Full-Stack Chat App

Goal

Build a real-time global chat room where multiple users can talk instantly.

Architecture Diagram

graph LR
    A[React Frontend] <-->|WebSocket| B(Node.js Server)
    B <--> C[(MongoDB)]

Tech Stack Justification

• React: Great for dynamic UI updates when new messages arrive.
• Node.js & Socket.io: Standard and simplest way to handle persistent WebSocket connections.
• MongoDB: Easy to store unstructured chat logs.

AI Prompting Guide

Drop these prompts into Cursor or ChatGPT:

1. “Scaffold a Vite React application with TailwindCSS for the frontend.”
2. “Create an Express.js server in Node and configure Socket.io for cross-origin requests.”
3. “Write the frontend code to connect to Socket.io and emit a ‘send_message’ event when the user submits a form.”