Full Stack Chat Application

Overview

This is a full stack chat application that allows users to communicate in real-time. Built using the MERN stack with Socket.io, this application offers a modern chat experience with a focus on performance and user experience.

Tech Stack

• Frontend: React, Tailwind CSS, Daisy UI
• Backend: Node.js, Express, MongoDB, Socket.IO
• Authentication: JWT (JSON Web Tokens)
• State Management: Zustand

Features

• 🌟 MERN Stack: Full integration of MongoDB, Express, React, and Node.js for a robust application.
• 🎃 Authentication & Authorization: Secure user login and registration using JWT.
• 👾 Real-time Messaging: Instant messaging capabilities using Socket.io.
• 🚀 Online User Status: Displays the online status of users in real time.
• 👌 Global State Management: Efficient state management with Zustand.
• 🐞 Error Handling: Comprehensive error handling on both the server and client sides.
• ⭐ Deployment: Learn to deploy your application like a pro for FREE!
• ⏳ And much more!

Installation

Prerequisites

• Node.js
• MongoDB (if using MongoDB)

Getting Started

1. Clone the repository:

   git clone https://github.com/yourusername/fullstack_chat.git
   cd fullstack_chat
   

2. Install dependencies for the backend:

   cd backend
   npm install
   
   

3. Set up the environment variables: Create a .env file in the backend directory and add the following variables:

     MONGODB_URI=your_mongodb_connection_string
    PORT=5001
    JWT_SECRET=your_jwt_secret_key
    
    CLOUDINARY_CLOUD_NAME=your_cloudinary_cloud_name
    CLOUDINARY_API_KEY=your_cloudinary_api_key
    CLOUDINARY_API_SECRET=your_cloudinary_api_secret
    
    NODE_ENV=development
   

4. Start the backend server:

   npm start
   

5. Install dependencies for the frontend: Open a new terminal window, then:

   cd frontend
   npm install
   

6. tart the frontend application:

   npm run dev
   

7. Open your browser and navigate to http://localhost:5173 to access the chat application.