Social Networking and Chatting WebApp

Project Demo Images

Login Page ->>

Chat Screen Page ->>

Overview

This project is a real-time social media chat platform designed to facilitate seamless communication and interaction among users. The application is built using modern web development technologies to ensure a smooth, interactive, and scalable user experience.

Technologies Used

• React.js: For creating a modern and interactive user interface.
• Context-API: For managing state across the application.
• Firebase: For backend infrastructure, real-time database, and hosting.
• Firebase Auth: For secure user authentication, including Google Authentication.
• Materialize-CSS: For responsive and stylish UI components.

Features

• Real-time Chat: Instant messaging capability to connect with friends and family.
• User Authentication: Secure login and registration process using Google Authentication.
• Scalable Backend: Firebase backend to handle a growing user base and ensure reliable performance.
• Modern UI: Intuitive and user-friendly interface created with React.js and Materialize-CSS.
• Search Functionality: Allows users to search through messages, ensuring they can find relevant messages quickly even if there are many messages.
• Limit Message Factor: New users are allowed to send only 2 messages initially. After that, they must enter a passkey to send more messages. To obtain the passkey, they need to contact the admin.

Getting Started

Prerequisites

• Node.js
• npm or yarn
• Firebase account

Installation

1. Clone the repository:

   git clone https://github.com/your-username/social-networking-chat-app.git
   cd social-networking-chat-app

2. Install dependencies:

   npm install

   or

   yarn install

3. Set up Firebase:

   • Create a new project in Firebase.
   • Enable Firestore and Firebase Authentication.
   • Copy your Firebase config object and replace the placeholders in src/firebaseConfig.js.

4. Start the development server:

   npm start

   or

   yarn start

Usage

• Open your browser and navigate to http://localhost:3000 to see the application running.
• Register or log in using Google Authentication.
• Start chatting in real-time with other registered users.

Contributing

Contributions are welcome! Please fork the repository and create a pull request with your changes. Ensure that your code follows the project's coding standards and includes relevant documentation.

Contact

If you have any questions or suggestions, feel free to contact me at ratneshmaurya2001@gmail.com.