Skip to content

README.md

Latest commit

 

History

History
102 lines (77 loc) · 2.89 KB

README.md

File metadata and controls

102 lines (77 loc) · 2.89 KB

🚀 SirTheProgrammer Chat Space

A real-time chat application where users can seamlessly share thoughts and ideas with a personal identity. Experience fast, secure, and engaging conversations like never before! 💬✨

🌟 Features

✔️ User Authentication – Signup, login, and logout securely 🔒
✔️ Real-Time Messaging – Instant chat powered by Firebase ⚡
✔️ Personal Identity – Messages are uniquely tied to users 🆔
✔️ Beautiful UI – A sleek, responsive design for all devices 🎨
✔️ Firestore Security Rules – Protecting user data at all times 🛡️

🛠️ Setup Instructions

1️⃣ Install Dependencies

Make sure you have Node.js installed, then run:

npm install

2️⃣ Firebase Configuration

  1. Go to Firebase Console and create a project.
  2. Enable Authentication (Email/Password method).
  3. Set up Firestore Database.
  4. Copy your Firebase config keys and paste them into a .env.local file:
REACT_APP_FIREBASE_API_KEY=your-api-key
REACT_APP_FIREBASE_AUTH_DOMAIN=your-project-id.firebaseapp.com
REACT_APP_FIREBASE_PROJECT_ID=your-project-id
REACT_APP_FIREBASE_STORAGE_BUCKET=your-project-id.appspot.com
REACT_APP_FIREBASE_MESSAGING_SENDER_ID=your-messaging-sender-id
REACT_APP_FIREBASE_APP_ID=your-app-id

3️⃣ Deploy Firestore Rules

Ensure data security with Firebase security rules:

  1. Install Firebase CLI: 
    npm install -g firebase-tools
  2. Login to Firebase: 
    firebase login
  3. Initialize Firebase (if not already done): 
    firebase init
    • Select Firestore
    • Choose your project
    • Accept default file paths
  4. Deploy rules: 
    firebase deploy --only firestore:rules

4️⃣ Start the Development Server 🚀

Run the following command to start the app:

npm start

The app will be live at http://localhost:3000/ 🎉

🔐 Firestore Security Rules Explained

🔹 Only authenticated users can read messages.
🔹 Users can only create messages with their own user ID.
🔹 Users can only edit or delete their own messages.
🔹 Messages must contain required fields (text, timestamp, user info).

These rules ensure a secure and smooth chat experience! 🛡️

📂 Project Folder Structure

/src - Main application source code
  ├── /pages - Core app pages (home, login, signup, chatroom)
  ├── /components - Reusable UI components
  ├── /firebase.js - Firebase configuration

📜 License

This project is licensed under the MIT License. Feel free to use and improve it! 🚀

💡 Contributions are welcome! If you have ideas to make this chat app even better, feel free to open a pull request or issue! 🤝

@sirTheprogrammer 2025