https://github.com/adeebkhan25/messenger

Messenger App is a full-stack, real-time messaging application designed for seamless and intuitive communication. Built with React on the frontend and Node.js/Express on the backend, it leverages WebSockets for instant messaging and MongoDB for secure data storage.
https://github.com/adeebkhan25/messenger

express javascript mongodb nodejs react tailwindcss ws

Last synced: about 1 month ago
JSON representation

Messenger App is a full-stack, real-time messaging application designed for seamless and intuitive communication. Built with React on the frontend and Node.js/Express on the backend, it leverages WebSockets for instant messaging and MongoDB for secure data storage.

• Host: GitHub
• URL: https://github.com/adeebkhan25/messenger
• Owner: AdeebKhan25
• Created: 2024-08-25T14:06:29.000Z (3 months ago)
• Default Branch: master
• Last Pushed: 2024-08-25T17:56:31.000Z (3 months ago)
• Last Synced: 2024-10-11T04:01:58.244Z (about 1 month ago)
• Topics: express, javascript, mongodb, nodejs, react, tailwindcss, ws
• Language: JavaScript
• Homepage:
• Size: 400 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Messenger App

Welcome to the **Messenger App**! This application allows users to chat in real time, send messages, and share files. Built with modern web technologies, it provides a seamless and interactive messaging experience.

## Features

- **Real-time Messaging**: Exchange messages instantly using WebSockets.

- **File Sharing**: Upload and download files. Send and receive images directly within the chat interface.

- **User Authentication**: Secure login and logout functionality.

- **Offline Support**: Displays offline users and handles messages appropriately.

## Technologies

- **Frontend**: React, Tailwind CSS

- **Backend**: Node.js, Express

- **Database**: MongoDB (using Mongoose)

- **WebSockets**: WS (Node package)

## Getting Started

To get started with this project locally, follow these steps:

1. Clone the repository:

```bash

git clone https://github.com/AdeebKhan25/Messenger.git

cd Messenger

```

2. Navigate to the client directory:

```bash

cd client

```

3. Install dependencies:

```bash

yarn install

```

4. Navigate to the api directory:

```bash

cd ../api

```

5. Install dependencies:

```bash

yarn install

```

6. Create a .env file in the api directory and add your MongoDB URL, JWT Secret, and Client URL.

7. Start the backend server:

```bash

nodemon index.js

```

8. Start the frontend development server:

```bash

yarn run dev

```

## Screenshots

1. Login Page

   

   ![Login](https://github.com/user-attachments/assets/46b9c393-0162-4925-8e22-9d9b6cf3510a)

3. Register Page

   

   ![Register](https://github.com/user-attachments/assets/4d96ea55-d0de-4987-9fdf-4707f6831f2f)

5. Chat Page

   

   ![Chat](https://github.com/user-attachments/assets/51c9c698-69e4-4d8a-8426-bba76add80b2)

### Further Assistance

If you need any more help or have other questions, feel free to ask. Happy coding! 🚀