Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/amhjadkhan/chat_-massanger

Last synced: 8 days ago
JSON representation

Host: GitHub
URL: https://github.com/amhjadkhan/chat_-massanger
Owner: AmhjadKhan
Created: 2024-08-16T19:58:45.000Z (5 months ago)
Default Branch: main
Last Pushed: 2024-08-23T13:53:42.000Z (5 months ago)
Last Synced: 2024-11-08T20:12:18.514Z (2 months ago)
Language: JavaScript
Size: 381 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

        # Messenger Application

## Live Demo

[![Live Site](https://img.shields.io/badge/Live%20Site-000000?style=for-the-badge&logo=vercel&logoColor=white)](https://your-live-site-link.com)

This is a simple messenger application that allows users to send and receive messages in real time. The app is built using React and Socket.io, providing a smooth and responsive messaging experience.

![HTML5](https://img.shields.io/badge/HTML5-E34F26?logo=html5&logoColor=white)

![CSS3](https://img.shields.io/badge/CSS3-1572B6?logo=css3&logoColor=white)

![TailwindCSS](https://img.shields.io/badge/TailwindCSS-38B2AC?logo=tailwind-css&logoColor=white)

![DaisyUI](https://img.shields.io/badge/DaisyUI-5A0EF8?logo=daisyui&logoColor=white)

![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?logo=javascript&logoColor=black)

![React](https://img.shields.io/badge/React-61DAFB?logo=react&logoColor=black)

![Node.js](https://img.shields.io/badge/Node.js-339933?logo=node.js&logoColor=white)

![Express](https://img.shields.io/badge/Express-000000?logo=express&logoColor=white)

![MongoDB](https://img.shields.io/badge/MongoDB-47A248?logo=mongodb&logoColor=white)

![Socket.io](https://img.shields.io/badge/Socket.io-010101?logo=socket.io&logoColor=white)

## Features

- **Real-time Messaging:** Send and receive messages instantly with the help of Socket.io_clint.

- **User Authentication:** Users can sign up and log in to the application.

- **Responsive UI:** The application is fully responsive and works across all devices.

- **Notifications:** Get notifications for new messages with `react-hot-toast`.

- **Conversations List:** View all conversations and easily switch between them.

## Tech Stack

- **React** - Frontend library

- **Socket.io Client** - Real-time communication

- **Zustand** - State management

- **React Router DOM** - Routing

- **React Hot Toast** - Notifications

- **React Icons** - Icons for UI

## Installation

Follow these steps to set up and run the project on your local machine.

### Prerequisites

Make sure you have the following installed:

- [Node.js](https://nodejs.org/) (v14.0.0 or higher)

- [npm](https://www.npmjs.com/) or [yarn](https://yarnpkg.com/)

### Clone the Repository

```bash

git clone https://github.com/AmhjadKhan/chat_-massanger

cd chat_messenger-app

# Using npm

npm install

# Using npm

npm run build