https://github.com/imhappykumar/any-chat
AnyChat, a real-time chat application developed using React.js, Node.js, Socket.IO, and Firebase. Implemented Firebase Realtime Database for seamless data synchronization and integrated Firebase Authentication for secure user access.
https://github.com/imhappykumar/any-chat
authentication chat-application chatapp chatbot firebase firebaseauth form-validation nodejs react reactjs realtimedatabase socketio
Last synced: about 2 months ago
JSON representation
AnyChat, a real-time chat application developed using React.js, Node.js, Socket.IO, and Firebase. Implemented Firebase Realtime Database for seamless data synchronization and integrated Firebase Authentication for secure user access.
- Host: GitHub
- URL: https://github.com/imhappykumar/any-chat
- Owner: ImHappyKumar
- License: mit
- Created: 2024-02-05T10:28:51.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-03-05T04:45:47.000Z (about 2 years ago)
- Last Synced: 2025-07-31T15:33:01.916Z (10 months ago)
- Topics: authentication, chat-application, chatapp, chatbot, firebase, firebaseauth, form-validation, nodejs, react, reactjs, realtimedatabase, socketio
- Language: JavaScript
- Homepage: https://anychat-happykumar.web.app
- Size: 1 MB
- Stars: 0
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# AnyChat
Developed by Happy Kumar
AnyChat is a real-time chat application built using **React.js**, **Node.js**, **Socket.IO**, and **Firebase**. It uses Firebase Realtime Database for seamless data synchronization and Firebase Authentication for secure user access.
---
## 🚀 Features
- **Real-Time Chat** – Engage in real-time conversations via Socket.IO.
- **Firebase Integration** – Real-time data sync using Firebase Realtime Database.
- **Authentication** – Secure user login with Firebase Auth.
- **Responsive UI** – User-friendly chat interface.
---
## ✅ Prerequisites
Ensure the following are installed:
- [Node.js](https://nodejs.org/)
- [Git](https://git-scm.com/)
- [Firebase Account](https://firebase.google.com/)
---
## 🔧 Installation
1. **Clone this repository:**
```bash
git clone https://github.com/ImHappyKumar/any-chat.git
cd any-chat
```
2. **Install dependencies:**
```bash
cd client
npm install
cd ../server
npm install
```
---
## ⚙️ Configuration
### 🔒 1. Setup Environment Variables
- Rename `.env.example` to `.env` in both `client/` and `server/` folders.
- Replace placeholder values with your actual environment values.
### 📁 2. Configure Firebase – Client Side
- Replace the contents of `client/src/firebase.js.example` with your Firebase config.
- Rename `firebase.js.example` to `firebase.js`.
```js
// client/src/firebase.js
import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";
const firebaseConfig = {
apiKey: "YOUR_API_KEY",
authDomain: "YOUR_AUTH_DOMAIN",
databaseURL: "YOUR_DATABASE_URL",
projectId: "YOUR_PROJECT_ID",
storageBucket: "YOUR_STORAGE_BUCKET",
messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
appId: "YOUR_APP_ID"
};
const app = initializeApp(firebaseConfig);
export const auth = getAuth(app);
export default app;
```
### 🔐 3. Configure Firebase – Server Side
- Rename `serviceAccountKey.json.example` to `serviceAccountKey.json` and add your Firebase Admin credentials.
- In `server/firebaseConfig.js`, make sure it looks like this:
```js
// server/firebaseConfig.js
const admin = require("firebase-admin");
const serviceAccount = require("./serviceAccountKey.json");
admin.initializeApp({
credential: admin.credential.cert(serviceAccount),
databaseURL: "https://your-project-id.firebaseio.com"
});
module.exports = admin;
```
### 🚀 4. Set up Firebase Hosting (Optional):
- Rename `.firebaserc.example` to `.firebaserc`.
- Replace the `default` project ID with your own Firebase project ID:
```json
{
"projects": {
"default": "your-project-id"
}
}
---
## ▶️ Usage
1. **Start the backend server:**
```bash
cd server
npm start
```
2. **Start the frontend app:**
```bash
cd client
npm start
```
3. **Open in Browser:**
- Visit [http://localhost:3000](http://localhost:3000)
---
## 🤝 Contributing
Feel free to fork the repo, create a new branch, and submit a pull request. Issues and suggestions are welcome!