Building a Real-Time Group Chat Application with WebSocket, React, and Node.js
GitHub Repository
> version 1.0.0
Check out the source code on GitHub
mahmud-r-farhan
/
AnonyChat
A real-time anonymous group chat application with modern UI and privacy features.
Annoy Group Chat Application
A real-time anonymous group chat application with a modern, responsive UI, privacy-focused design, and dynamic background customization.
Features
- Real-time Messaging: Powered by Socket.io for instant message delivery and updates.
- Anonymous User Profiles: Automatically generates random usernames and avatars using DiceBear API, ensuring user anonymity.
- Dynamic Backgrounds: Offers customizable backgrounds with a mix of curated static images and dynamic fetching from the Unsplash API for virtually unlimited options.
- Collapsible Active Users Sidebar: Displays online users with avatars and status indicators, toggleable on both mobile and desktop for a streamlined experience.
- Typing Indicators: Shows when other users are typing, enhancing real-time interaction.
- Message Persistence: Stores chat history in MongoDB with date-based grouping (e.g., "Today," "Yesterday") for easy navigation.
- Spam Protection: Enforces a 255-character limit per message and validates content to prevent spam or harmful messages.
- Modern UI: Responsive design with…
🌐 Live Demo
Annoy Chat | Anonymous Group Chat
Join the best real-time chat experience. Secure, fast, and private messaging with modern UI.
anonychat-app.vercel.app
Key Features
This chat application includes:
✅ Real-time messaging using WebSocket
✅ User profile setup with random image API
✅ Active users display for real-time presence tracking
✅ Spam protection for harmful links and text
✅ Anonymous chat with privacy policy
✅ Left/Right message alignment for clarity
✅ Secure and private communication
✅ Message storage in MongoDB with timestamps
✅ Modern 2025 UI with Tailwind CSS and Framer Motion
Tech Stack
- Frontend: React, Tailwind CSS, Framer Motion
- Backend: Node.js, Express.js, WebSocket
- Database: MongoDB
- Security & Spam Protection: Middleware validation for harmful content
Final Thoughts
This project was an exciting challenge. It combined real-time WebSocket communication with a modern front-end design. The end result is a secure, scalable, and user-friendly chat application that anyone can use.
I plan to improve the app by adding file sharing, typing indicators, and private chat rooms. Let me know your thoughts!
More -
Top comments (4)
Its Amazing but it would be better if the data stored in mongodb
Glad you liked it! I'm already working on storing the data in MongoDB.
Auto scroll make it better also
Its amazing
Thanks !
Thank you so much! 🙌 I'm really glad you liked it. The auto-scroll feature adds a nice touch, and it's going to be even more polished in the next update! I appreciate your support and stay tuned for more improvements. 🚀