realtime-chat-mern

A Realtime Chat Application

A simple realtime chat apoplication made using React JS, a JavaScript library to make awesome UI by Facebook, Node JS, Express JS and MongoDB.

This application uses React JS component oriented UI creation paradigm. All components are written in JSX and ES6 style.

Back end is implemented using Node JS, Express JS and MongoDB. Atlas, the Cloud version of MongoDB is used. Real time communication is done using Socket.io.

This is still a work in progress
If you find any bugs you can report it to me.
Pull requests are always welcome. For major changes, 
please open an issue first to discuss what you would like to change.

Screenshots

Features

• Latest features of JavaScript i.e. ES6, ES7, ES8 is used
• React JS Hooks are used with Functional components
• ES8 async/await is used

• This is Simple Chat Application
• It is a Full Stack Application
• All the data are stored in the [MongoDB Atlas](https://www.mongodb.com/cloud/atlas)
• Login/Signup as well as Logout feature is added
• Error will be shown if the credentials are not correct
• Shows realtime message when a user joins/leaves the room
• User can send emojis along with text which is also persistent
• Real time communication is supported using Socket.io
• All the conversation are stored in the database i.e. persistant

Tech Stack

MongoDB, Express, React, Node, Socket.IO, Tailwind CSS

Usage

Test users

Username	Password
tester	1234567912
john12	123218761
jack12	12345678
jamie34	12345678

Or Simply Register.

Live Demo

https://rooms-mern.onrender.com/

Env Variables

Create a .env file in the server folder and add the following

MONGODB_URL=<YOUR_MONGO_DB_URL>
JWT_SERVER_SECRET=<YOUR_SECRET_KEY>
NODE_ENV="development"

Install Dependencies & Run

npx yarn
npx yarn dev
cd client
npx yarn
npx yarn dev