Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/trupti0406/pingme
PingMe is a real-time chat application built using the MERN stack with Socket.IO for real-time communication.
https://github.com/trupti0406/pingme
chat-app mern mern-stack realtimechatapp socket-io
Last synced: 21 days ago
JSON representation
PingMe is a real-time chat application built using the MERN stack with Socket.IO for real-time communication.
- Host: GitHub
- URL: https://github.com/trupti0406/pingme
- Owner: Trupti0406
- Created: 2024-09-16T14:19:22.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-09-16T16:19:21.000Z (4 months ago)
- Last Synced: 2024-11-07T13:52:24.290Z (2 months ago)
- Topics: chat-app, mern, mern-stack, realtimechatapp, socket-io
- Language: JavaScript
- Homepage: https://pingme-rkv6.onrender.com/
- Size: 376 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# PingMe
PingMe is a real-time chat application built using the **MERN stack** with **Socket.IO** for real-time communication. It allows users to send text messages, images, and PDFs, with additional features like user authentication and activity status.
## Live Demo
[Click here to view the live demo](https://pingme-rkv6.onrender.com/)
## Key Features
- User Authentication and Authorization (Login, Signup)
- Real-time Text Messaging
- Real-time Image Sharing
- Real-time PDF Sharing and Download
- User Online/Offline Status
- Logout Functionality
- Responsive Design
- Automatically fetches a profile picture based on gender selection
## Tech Stack
- **Frontend:** React, Redux, Axios, React Router, Tailwind CSS, Daisy UI
- **Backend:** Node.js, Express.js, MongoDB, JWT for authentication
- **Real-Time Communication:** Socket.IO
- **File Uploads:** Multer
- **State Management:** Redux, Redux Persist and React Context
- **Other Libraries:** react-hot-toast, date-fns
## Environment Setup
1. Clone the repository.
2. Create an `.env` file in the root directory of the backend:
```
PORT=your_port
MONGO_URI=your_mongo_uri
JWT_SECRET=your_jwt_secret
```
3. Create another `.env` file in the frontend directory:
```
REACT_APP_API_BASE_URL=http://localhost:8080/api
REACT_APP_SOCKET_URL=http://localhost:8080
```
## Installation
1. Install the necessary dependencies for both frontend and backend:
```
cd backend
npm install
cd ../frontend
npm install
```
2. Start the backend and frontend servers:
```
cd backend
npm start
cd ../frontend
npm start
```
---
**Created by Trupti Yadav**