Chatter - Real-time Chat Application

Chatter is a fully responsive real-time chat application that enables users to communicate instantly with each other. It is built with a robust tech stack, including React.js and Tailwind CSS for the frontend, Zustand for efficient state management, Node.js and Express.js for the backend, and Socket.io for real-time communication. It provides features like real-time messaging with image sharing capabilities in chats, online/offline user status, user authentication, and profile management.

Technical Description 📃

• Real-time Communication: Implemented real-time messaging and live user status updates using Socket.IO, enabling seamless bidirectional communication.

• State Management: Built efficient state management system using Zustand for optimized performance.

• Navigation: Utilized React Router v6 for client-side routing with dynamic routes for seamless navigation.

• Responsive UI: The frontend is built with React.js and designed fully responsive UI using Tailwind CSS for a modern mobile-friendly experience.

• Authentication: Implemented secure user authentication using JWT and bcrypt.jswith HTTP-only cookies for enhanced security measures.

• Database: Designed and integrated MongoDB database schema using Mongoose ODM for efficient data modeling and relationships.

• API Endpoints: Built RESTful API endpoints with Express.js following MVC architecture for clean code organization.

• File Upload: Integrated Cloudinary cloud storage for media management, handling user profile pictures and message attachments.

Frontend Technologies 🎨	Backend Technologies 🛠
React.js & React DOM	Node.js with Express.js
Tailwind CSS	MongoDB with Mongoose
Zustand for state management	JWT for authentication
Socket.IO Client	Socket.IO for real-time communication
Axios for HTTP requests	Bcrypt.js for password hashing
React Hot Toast for notifications	Cloudinary for image storage
React Router Dom for navigation	CORS for cross-origin resource sharing

Contact

👾 Bhaskar Jha (✉️ @bhaxkar )