GlobalChat 🌍💬

A simple real-time global chat app built with Express, Socket.IO, and Vue 3. Made as a learning project to understand WebSockets, real-time systems, and PWAs.

🌐 Live demo: Global Chat

✨ Features

• Real-time global chat using Socket.IO
• Username chosen on first visit (saved in localStorage)
• System messages for user join / leave
• Message history on connect
• Send via Enter or Send button
• Modern UI with ShaDCN
• Reactive frontend with Vue 3
• Censorship for moderation

🛠 Tech Stack

Server

Client

🔄 How It Works

1. The client asks for a user on first visit and stores it in localStorage

2. The browser connects to the Socket.IO server, sending the username during the handshake

3. The server:

   • Sends existing messages to the new client
   • Broadcasts a join system message

4. When a user sends a message:

   • It is sent to the server
   • Stored in memory ( for now )
   • Broadcast to all connected clients

5. On disconnect, the server broadcasts a leave system message

6. Vue updates the UI reactively as messages arrive

🚀 Deploying

git clone https://github.com/mastercuber55/GlobalChat.git
cd GlobalChat
npm install
node index.js

⚠️ Limitations

• No authentication currently
• Messages stored in RAM only currently
• Single global room for now
• No spam protection
• No markdown support yet

📄 License

MIT — free to fork, modify, and learn from.