Skip to content

A modern real-time chat application built with MERN stack and Socket.IO, featuring instant messaging, user authentication, online status tracking, and image sharing capabilities.

License

Notifications You must be signed in to change notification settings

kanak227/Convosync

Folders and files

NameName
Last commit message
Last commit date

Latest commit

94fcb9bΒ Β·Β Β· Jul 27, 2025

History

15 Commits
Jul 27, 2025
Jul 27, 2025
Jul 27, 2025
Jul 27, 2025
Jul 27, 2025
Jul 27, 2025

Repository files navigation

✨ ConvoSync - Real-Time Chat Application ✨

ConvoSync Logo

ConvoSync is a modern real-time chat application that allows users to communicate instantly with each other. Built with a robust tech stack including React, Node.js, Express, MongoDB, and Socket.IO, this application provides a seamless and responsive chatting experience.

πŸš€ Live Demo

πŸ”— Check out the live application

πŸ“± App Screenshots

Sneak-Peek Sneak-Peek

βœ… Features

  • πŸ’¬ Real-time Messaging: Instant message delivery using Socket.IO
  • πŸ” User Authentication: Secure signup, login, and logout functionality
  • πŸ‘€ Profile Management: Update profile pictures using Cloudinary integration
  • 🟒 Online Status: See which users are currently online
  • πŸ“œ Message History: View past conversations with any user
  • πŸ“± Responsive Design: Works on desktop and mobile devices
  • πŸ–ΌοΈ Image Sharing: Send images in chat messages
  • 🎨 Theme Support: Multiple theme options

πŸ› οΈ Tech Stack

🌐 Frontend

  • βš›οΈ React 19
  • 🧭 React Router v7
  • πŸ—ƒοΈ Zustand (State Management)
  • πŸ”Œ Socket.IO Client
  • 🎨 Tailwind CSS with DaisyUI
  • ⚑ Vite (Build Tool)
  • πŸ”„ Axios (HTTP Client)

βš™οΈ Backend

  • πŸ“¦ Node.js
  • πŸš‚ Express.js
  • πŸƒ MongoDB with Mongoose
  • πŸ”Œ Socket.IO
  • πŸ”‘ JWT Authentication
  • πŸ”’ Bcrypt.js (Password Hashing)
  • ☁️ Cloudinary (Image Storage)

πŸ“‚ Project Structure

β”œβ”€β”€ backend/                # Backend server code
β”‚   β”œβ”€β”€ src/
β”‚   β”‚   β”œβ”€β”€ controllers/    # Request handlers
β”‚   β”‚   β”œβ”€β”€ lib/            # Utilities and configurations
β”‚   β”‚   β”œβ”€β”€ middleware/     # Express middleware
β”‚   β”‚   β”œβ”€β”€ models/         # Mongoose models
β”‚   β”‚   β”œβ”€β”€ routes/         # API routes
β”‚   β”‚   └── index.js        # Server entry point
β”‚   β”œβ”€β”€ .env.example        # Environment variables template
β”‚   └── package.json        # Backend dependencies
β”‚
β”œβ”€β”€ frontend/               # Frontend React application
β”‚   β”œβ”€β”€ public/             # Static assets
β”‚   β”œβ”€β”€ src/
β”‚   β”‚   β”œβ”€β”€ components/     # Reusable UI components
β”‚   β”‚   β”œβ”€β”€ lib/            # Utilities and helpers
β”‚   β”‚   β”œβ”€β”€ pages/          # Page components
β”‚   β”‚   β”œβ”€β”€ store/          # Zustand state stores
β”‚   β”‚   └── App.jsx         # Main application component
β”‚   └── package.json        # Frontend dependencies
β”‚
└── package.json            # Root package.json
 # Root package.json

πŸš€ Getting Started

πŸ“‹ Prerequisites

  • πŸ“¦ Node.js (v16 or higher)
  • πŸƒ MongoDB
  • ☁️ Cloudinary account (for image uploads)

πŸ’» Installation

  1. Clone the repository

    git clone https://github.com/kanak227/Convosync.git
    
    cd convosync
  2. Install dependencies

    # Install root dependencies
    npm install
    
    
    
    # Install backend dependencies
    
    cd backend
    npm install
    
    
    
    # Install frontend dependencies
    
    cd ../frontend
    npm installl
  3. Set up environment variables

    • Copy .env.example to .env in the backend directory
    • Fill in your MongoDB URI, JWT secret, and Cloudinary credentials
  4. Start the development servers

    # Start backend server (from backend directory)
    npm run dev
    
    
    
    # Start frontend server (from frontend directory)
    npm run devv
  5. Open your browser and navigate to http://localhost:5173

πŸš€ Deployment

The application is configured for easy deployment:

  • πŸ”„ Backend serves static frontend files in production mode
  • βš™οΈ Environment variables control configuration for different environments
  • 🌐 Deployed on Render

πŸ‘₯ Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.

πŸ™ Acknowledgments

  • Thanks to all the open-source libraries that made this project possible
  • Inspired by modern chat applications like Slack and Discord

Built with ❀️ by Kanak

⭐ Star this project β€’ πŸ› Report Bug β€’ ✨ Request Feature

About

A modern real-time chat application built with MERN stack and Socket.IO, featuring instant messaging, user authentication, online status tracking, and image sharing capabilities.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages