Skip to content

Mohsin370/mern_chat_app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 

Repository files navigation

Ping

Ping is a modern and sleek chat application that utilizes real-time messaging powered by Socket.IO. It provides users with a seamless chatting experience in a visually appealing interface.

Technologies Used

  • Frontend: React
  • Backend: Node.js, Express
  • Database: MongoDB
  • Styling: Tailwind CSS
  • Real-time Communication: Socket.IO
  • Language: TypeScript

Screenshots

HomePage

Signup

Login

Chat screen

Installation

Make sure you have already installed necessary tools such as Node, TypeScript, Nodemon

Frontend

Run the following commands to run the frontend project

$ cd frontend
$ npm install
$ cd frontend
$ npm run dev

Make sure to add .env file at the root of the frontend directory with environment variables

The application should now be running on http://localhost:5173

Backend

Run the following commands to run the backend project

$ cd backend
$ npm install
$ npx tsc && nodemon dist/index.js

Make sure to add .env file at the root of the project with environment variables

The variables include: MONGO_URI (for your MongoDB connection) and JWT_SECRET (for JWT authentication)

Demo

The demo application can be accessed on this URL: Ping Demo

Note: The backend is deployed on render free tier, the server might be inactive at the time you access it. Give application a minute to receive first response from the server.