💬 Connectly

A modern real-time chat application built with React, Firebase, and Vite. Features instant messaging, user authentication, profile management, and image sharing capabilities with a clean, responsive interface.

✨ Features

• 💬 Real-time Messaging - Instant chat with Firebase Firestore
• 🔐 User Authentication - Register, login, and password reset
• 👤 Profile Management - Update profile with avatar and bio
• 📷 Image Sharing - Upload and share images in chats
• 🔍 User Search - Find and connect with other users
• 📱 Responsive Design - Works on desktop, tablet, and mobile
• 🟢 Online Status - See when users were last active
• 🔔 Message Notifications - Toast notifications for better UX

🎨 Features Overview

• Authentication Flow: Secure login/signup with Firebase Auth
• Real-time Chat: Live message updates using Firestore listeners
• User Discovery: Search and add new chat contacts
• Media Sharing: Upload and display images in conversations
• Profile Customization: Personalize your profile with avatar and bio
• Responsive UI: Clean interface that works across all devices

🛠️ Tech Stack

• Frontend: React 19, Vite, React Router DOM
• Backend: Firebase (Authentication, Firestore, Storage)
• Styling: CSS3 with custom styles
• Notifications: React Toastify
• State Management: React Context API

🚀 Quick Setup

Prerequisites

• Node.js (v18+)
• Firebase account and project setup

Installation

1. Clone the repository:

   git clone https://github.com/tlamDson/chat-app.git
   cd chat-app

2. Install dependencies:

   npm install

   npm run dev

💡 How to Use

1. Sign Up/Login - Create a new account or login with existing credentials
2. Profile Setup - Update your profile with name, avatar, and bio
3. Find Users - Search for other users by username in the left sidebar
4. Start Chatting - Click on a user to start a conversation
5. Send Messages - Type and send text messages or share images
6. Real-time Updates - Messages appear instantly for all participants

Built with ❤️ by tlamDson