Chat Room is a fully functional real-time chat application with an intuitive UI, robust room management, and an enhanced user experience. Built using React, Supabase, and TypeScript, it provides seamless messaging with real-time updates and user presence indicators.
- Create new chat rooms
- View a list of available rooms
- Select and join rooms
- Delete rooms (for room creators)
- Send and receive messages instantly
- Messages stored securely in Supabase
- Real-time updates with Supabase's Realtime feature
- Auto-scroll to the latest messages
- Modern & Responsive Design (Mobile-friendly UI with a collapsible sidebar)
- Clear Visual Hierarchy (Better spacing, hover effects, and icons)
- Typing Indicators (Know when someone is typing)
- Online User Count (See who is online)
- Smooth Transitions & Animations
- Loading & Empty States
- Toast Notifications for Actions
- Edit & Delete Messages
- Delete Rooms (if you are the creator)
- Real-time presence tracking
- Input validation and error handling
- Confirmation dialogs for destructive actions
- Frontend: React, TypeScript, Tailwind CSS
- Backend: Supabase (PostgreSQL, Realtime)
- State Management: Zustand
- Deployment: Netlify
git clone https://github.com/chiragSahani/chatRoom.git
cd Chat Roomnpm installCreate a .env file in the root directory and add your Supabase credentials:
VITE_SUPABASE_URL=your_supabase_url
VITE_SUPABASE_ANON_KEY=your_supabase_anon_keynpm run devnpm run build
netlify deployCheck out the deployed application: Chat Room
Feel free to contribute by submitting a pull request! 🚀
This project is licensed under the MIT License.
💡 Let's Chat Smarter with ChiragChat! 🚀