chatsUp

chatsUp is a real-time chat application built using the MERN stack (MongoDB, Express.js, React, Node.js). It features a modern, responsive design with Tailwind CSS and DaisyUI, utilizes Context API for state management, and provides real-time notifications with React Hot Toast.

Live Link

• Live:

Features

• Real-Time Messaging: Users can send and receive messages instantly.
• User Authentication: Sign up and log in to access the chat functionalities.
• User Profiles: Users can view and edit their profiles.
• Contact Management: Users can manage their contacts and chat only with them.
• Notifications: Real-time notifications for incoming messages with sound alerts.
• Responsive Design: Modern and responsive UI using Tailwind CSS and DaisyUI.

Technologies Used

• Frontend:

  • React
  • Tailwind CSS
  • DaisyUI
  • React Hot Toast (for notifications)
  • Context API (for state management)

• Backend:

  • Node.js
  • Express.js
  • MongoDB
  • Socket.io (for real-time communication)

Installation

Frontend

1. Navigate to the frontend directory:

   cd frontend

2. Install dependencies:

npm install

3. Build the React app for production:

npm run build

4. Start the development server:

npm start

Backend

1. Navigate to the backend directory:

cd backend

2.Install dependencies:

npm install

3. Set up environment variables in a .env file:

MONGO_URI=<your_mongodb_connection_string>
JWT_SECRET=<your_jwt_secret>
PORT=<your_desired_port>

4. Start the server:

npm start

Configuration

Frontend Configuration: Update API endpoints in your React app to match your backend's production URL. Backend Configuration: Ensure your backend server is set to listen on the correct port and handle CORS if necessary.

---

Developed with ❤️ by [Mohamed Irfanullah M]

---