Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rtewari056/bitchat
BitChat is a real-time chat application made using MERN stack with user authentication. It allows multiple users to have a private and group chat.
https://github.com/rtewari056/bitchat
chakra-ui chat-application css express-js html javascript jwt mern-project mongodb-atlas node-js react react-chat-app react-router socketio
Last synced: about 2 months ago
JSON representation
BitChat is a real-time chat application made using MERN stack with user authentication. It allows multiple users to have a private and group chat.
- Host: GitHub
- URL: https://github.com/rtewari056/bitchat
- Owner: rtewari056
- License: mit
- Created: 2022-10-11T06:09:09.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-03-17T19:15:10.000Z (10 months ago)
- Last Synced: 2024-03-18T07:55:52.689Z (10 months ago)
- Topics: chakra-ui, chat-application, css, express-js, html, javascript, jwt, mern-project, mongodb-atlas, node-js, react, react-chat-app, react-router, socketio
- Language: JavaScript
- Homepage: https://bitchat.rohittewari.live
- Size: 1.89 MB
- Stars: 27
- Watchers: 1
- Forks: 8
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Real-time chat application powered by socket.io
## 🚀 Demo
This application is deployed on DigitalOcean. Please check it out :smile: [here](https://bitchat.rohittewari.live).
## 🖥️ Tech Stack
**Frontend:**
**Backend:**
**Database:**
**Deployed On:**
[](https://bitchat.rohittewari.live)
## ⚡️ Features
- [x] Real time communication is supported using [Socket.io](https://socket.io/)
- [x] Fully Responsive UI
- [x] User authentication using email with Login as well as Logout feature.
- [x] Passwords are encrypted.
- [x] Toast notifications for user actions.
- [x] Users can create group chat.
- [x] Typing Indicators while other user typing something.
## 📁 Project structure
```terminal
├── client/
│ ├── public/
│ │ ├── favicon.ico
│ │ ├── index.html
│ │ ├── logo192.png
│ │ ├── logo512.png
│ │ ├── manifest.json
│ │ └── robots.txt
│ ├── src/
│ │ ├── animations/
│ │ │ └── typing.json
│ │ ├── components/
│ │ │ ├── Authentication/
│ │ │ │ ├── Login.jsx
│ │ │ │ └── Signup.jsx
│ │ │ ├── UserAvatar/
│ │ │ │ ├── UserBadgeItem.jsx
│ │ │ │ └── UserListItem.jsx
│ │ │ ├── miscellaneous/
│ │ │ │ ├── GroupChatModal.jsx
│ │ │ │ ├── ProfileModal.jsx
│ │ │ │ ├── SideDrawer.jsx
│ │ │ │ └── UpdateGroupChatModal.jsx
│ │ │ ├── ChatBox.jsx
│ │ │ ├── ChatLoading.jsx
│ │ │ ├── MyChats.jsx
│ │ │ ├── ScrollableChat.jsx
│ │ │ ├── SingleChat.jsx
│ │ │ └── index.js
│ │ ├── config/
│ │ │ └── ChatLogics.js
│ │ ├── context/
│ │ │ └── ChatProvider.js
│ │ ├── pages/
│ │ │ ├── Chat.jsx
│ │ │ ├── Home.jsx
│ │ │ └── index.js
│ │ ├── App.css
│ │ ├── App.js
│ │ └── index.js
│ └── package.json
├── config/
│ ├── connectToMongoDb.js
│ ├── generateHashedPassword.js
│ ├── generateToken.js
│ ├── index.js
│ └── verifyPassword.js
├── controllers/
│ ├── chatControllers.js
│ ├── index.js
│ ├── messageControllers.js
│ └── userControllers.js
├── middleware/
│ ├── authMiddleware.js
│ ├── errorMiddleware.js
│ └── index.js
├── models/
│ ├── Chat.js
│ ├── Message.js
│ ├── User.js
│ └── index.js
├── routes/
│ ├── chatRoutes.js
│ ├── index.js
│ ├── messageRoutes.js
│ └── userRoutes.js
├── .env.example
├── .gitignore
├── LICENSE
├── package-lock.json
├── package.json
├── README.md
└── server.js
```
## 📖 Prerequisites
In order to run the project you need `node>=16` and `npm>=8` installed on your machine.
## 🚩 Getting Started
### 1. Clone the `bitchat` repository:
```bash
git clone https://github.com/rtewari056/bitchat.git
```
### 2. Navigate into repo:
```bash
cd bitchat
```
### 3. Rename `.env.example` into `.env` and put all creadentials:
```bash
PORT=5000
MONGO_URI="YOUR_MONGO_CONNECTION_URL"
JWT_SECRET="YOUR_JWT_SECRET"
JWT_EXPIRE=2d
NODE_ENV=development # Change to "production" when deploying
```
### 4. Install package dependencies:
```bash
npm install # Server dependencies
cd client
npm install # Client dependencies
```
### 4. Run project:
In the `root` directory, open two terminal sessions and run both commands separately:
```bash
npm run client
npm run server
```
### 5. Open your browser and go to `http://localhost:3000`
## 👤 Developer
[Rohit Tewari](https://github.com/rtewari056)
## 📬 Contact
If you want to contact me, you can reach me through below handles.
## 📃 License
bitchat is licensed under the MIT License.
### Show your support by 🌟 the project