nithin3q / chat_project

real time chat application

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Real-Time Chat Website with MERN Stack, Socket.io, Redux Toolkit, and bootstrap CSS

This is a real-time chat website that allows users to connect with each other and chat in real-time. It was built using the MERN stack (MongoDB, Express.js, React.js, and Node.js), Socket.io, Redux Toolkit, and Tailwind CSS.

Technologies Used

  • MERN stack (MongoDB, Express.js, React.js, and Node.js)
  • Socket.io
  • Redux Toolkit
  • bootstrap CSS

Features

  • Real-time chat: users can send and receive messages in real-time
  • User authentication: users can sign up, log in, and log out
  • Emojis: users can send and receive emojis in messages
  • Responsive design: the website is optimized for different screen sizes and devices

Configuration and Setup

In order to run this project locally, simply fork and clone the repository or download as zip and unzip on your machine.

  • Open the project in your prefered code editor.
  • Go to terminal -> New terminal (If you are using VS code)
  • Split your terminal into two (run the client on one terminal and the server on the other terminal)

In the first terminal

  • cd client and create a .env file in the root of your client directory.
  • Supply the following credentials
$ cd client
$ npm install (to install client-side dependencies)
$ npm start (to start the client)

In the second terminal

$ cd server
$ npm install (to install server-side dependencies)
& npm start (to start the server)
$ cd socket
$ npm install (to install socket.io dependencies)
& npm start (to start the socket)

About

real time chat application


Languages

Language:JavaScript 75.1%Language:CSS 20.3%Language:HTML 4.6%