WhatsApp Clone

This repository contains the code for a WhatsApp clone created following the tutorial by CleverProgrammer. The project aims to replicate the core functionality of WhatsApp and is built using the MERN (MongoDB, Express, React, Node) stack.

Table of Contents

• Features
• Technologies Used
• Setup
• Usage
• Pictures
• Contributing
• How to Fork This Repository

Features

• Real-time messaging between users.
• User authentication using Firebase.
• Create and join chat rooms.
• Send text and image messages.
• Responsive design for various screen sizes.

Technologies Used

• MongoDB: A NoSQL database for storing user data and chat messages.
• Express.js: A web application framework for handling API routes.
• React: A JavaScript library for building the user interface.
• Node.js: A runtime environment for running server-side JavaScript.
• Firebase: Used for user authentication and real-time database functionality.
• Material-UI: A popular UI framework for styling the application.
• Pusher: Enables real-time communication between clients and the server.

Setup

1. Clone the repository:

   git clone https://github.com/'yourusername'/whatsapp-clone.git

   Note: You should fork this repo and replace with your GitHub username above.

2. Change to frontend/client project directory:

   cd whatsapp-clone/wac-frontend
   

3. Install frontend/client dependencies:

   npm install || npm i
   

4. Change to backend/server project directory:

   cd whatsapp-clone/wac-backend
   

5. Install backend/server dependencies:

   npm install || npm i
   

6. Start the backend development server:

   You can install Nodemon globally using npm by running the following command:

   npm install -g nodemon
   

   Within whatsapp-clone/wac-backend run command:

   nodemon server.js
   

7. Start the frontend development client:

   Within whatsapp-clone/wac-frontend run command:

   npm start
   

8. Access the application at http://localhost:3000

Usage

• Login with Google Sign-in using Firebase authentication.
• Create a new chat room or join an existing one.
• Start sending and receiving real-time messages with other users in the chat room.

Pictures

Contributing

Contributions are welcome! If you want to contribute to this project, please follow these steps:

1. Fork this repository.

2. Create a new branch for your feature or bug fix:

   git checkout -b feature/your-feature

3. Make your changes and commit them:

   git commit -m 'Add some feature'

4. Push to your branch:

   git push origin feature/your-feature

5. Create a pull request.

How to Fork This Repository

1. Click the "Fork" button at the top right of this repository's page. This will create a copy of the repository in your own GitHub account.

2. After forking, you will have your own version of the repository that you can freely modify.

3. Clone the repository to your local machine:

   git clone https://github.com/your-username/your-forked-repo.git