Skip to content

Subhadarsini-10/Whatsapp-clone

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

WhatsApp_Clone web app using ReactJS and firebase-auth

To see the project output click on the below ##below link:

Techstack used:

1.HTML 2.CSS 3.Javascript 4.ReactJS 5.Redux 6.Material-UI 7.Firebase-auth 8.Firebase-db

Description

You can add a new chat and can also send messages in the chatbox.

1. HTML, CSS, and JavaScript:

HTML provides the structure, CSS styles the elements, and JavaScript adds interactivity to the web pages. These foundational technologies are essential for creating the basic layout and behavior of your WhatsApp clone.

2. ReactJS:

ReactJS is a popular JavaScript library for building user interfaces. It allows you to create reusable UI components and manage the state of your application efficiently. In your project, you would use React to design the user interface of your WhatsApp clone, breaking down the application into smaller components for easier management and maintenance.

3. Redux:

Redux is a state management library commonly used with React applications. It helps you manage the state of your application in a predictable way, making it easier to debug and test. In your WhatsApp clone, Redux can be used to handle application-wide state, such as user authentication status and chat messages.

4. Material-UI:

Material-UI is a popular React UI framework that provides pre-designed components and styles following Google's Material Design guidelines. By using Material-UI, you can create a visually appealing and responsive user interface for your WhatsApp clone without having to design every component from scratch.

5. Firebase Authentication (Firebase-auth):

Firebase Authentication is a service provided by Google Firebase that allows you to authenticate users in your application. It provides various authentication methods like email/password, Google, Facebook, etc. In your WhatsApp clone, Firebase Authentication would enable users to sign in securely, ensuring that only authorized users can access the messaging features.

6. Firebase Realtime Database (Firebase-db):

Firebase Realtime Database is a NoSQL cloud database provided by Firebase. It allows you to store and sync data in real-time, making it ideal for real-time applications like messaging apps. In your WhatsApp clone, Firebase Realtime Database can be used to store chat messages, user data, and other relevant information. Messages sent by one user can be instantly updated and visible to others in the conversation due to the real-time synchronization feature of Firebase.

I have designed the user interface using HTML, CSS, and React components and managed the state of the application using React's built-in state management and Redux. Material-UI components is used for designing a visually appealing user interface. Firebase Authentication would handle user sign-ins and ensure secure access, while Firebase Realtime Database would store and synchronize chat messages in real-time.

This combination of technologies enables you to create a feature-rich messaging application with real-time capabilities, ensuring a seamless user experience similar to WhatsApp.