Advance-Chat-App-Up.

Overview

Advance Chat App is a fully responsive, real-time messaging platform built with modern web technologies. It supports group and personal chats, real-time communication, emoji support, and file handling.

Features

• Frontend: Built with React ⚛️
• UI Components: Powered by ShadCN 🧩
• Styling: Tailored with Tailwind CSS 🎨
• Responsiveness: Fully Responsive Design 📱💻
• Authentication: Secure with JWT Tokens 🔑
• File Handling: Managed with Multer for File and Image Storage 📁📷
• File Download: Easy File Downloading Feature 📥
• Real-time Messaging: Instant Communication using Sockets 💬
• Chat Support: Group Chats and Personal Messages 👥💬
• Fun Conversations: Emoji Support 😄

Images

Below are some of the Images that this project showcases:

Advance Chat App

Screenshots

Backend

• Node.js: Fast, scalable backend built with Node.js 🛠️
• Express: Robust API management using Express 🚀
• Database: Efficient Data Storage with MongoDB 🗄️

State Management

• Zustand: Seamless State Management with Zustand 🧠

API Calls

• Axios: Smooth API Interactions with Axios 🌐

Code Quality

• Structured and Maintainable: Clean, well-organized, and scalable codebase 📚

Installation

1. Clone the repository:

   git clone https://github.com/your-username/advance-chat-app.git
   

2. Install dependencies:

   cd advance-chat-app
   npm install
   

3. Set up environment variables:

   • Create a .env file in the root directory and add the necessary variables.

   MONGODB_URI=your_mongo_uri
   JWT_SECRET=your_jwt_secret
   SOCKET_PORT=your_socket_port
   

4. Run the development server:

   npm start
   

Usage

• Open the app in your browser at http://localhost:3000.
• Sign up and start chatting with friends or in group chats.
• Share files, images, and emojis with ease.

Technologies Used