UsamaBinKashif / whatsapp-web-clone

WhatsApp Web Clone

Home Page:https://whatsapp-clone-ubk.web.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Frontend Mentor Linkedin

WhatsApp Web Clone

This is a solution to the WhatsApp Web Clone. Learned it from Clever Programmer Youtube Channel.

Table of contents

Overview

Things coverd in this built

Users are able to

  • Sign in with Google Authentication.
  • Users can add rooms like whatsapp groups.
    • all the other user can see your chat and can chat with you(will fix this in future like actual whatsapp)
    • Users can delete the room.
    • Its whatsapp web clone so for better results try it on desktop or laptop.
  • Users can log out.

Screenshots

solution solution

Links

My process

Built with

  • HTML using BEM naming convention

  • SCSS (css preprocessor)

  • Flexbox

  • CSS Grid

  • React - JS library

  • Vite - Next Generation Frontend Tooling

  • Firebase - For Backend (Authentication, Database, Hosting)

What I learned

This challenge was a great learning opportunity, I learned the react context for complex state management and also I discoverd Firebase features like Google Auth and Firestore Database.

(back to top)

About

WhatsApp Web Clone

https://whatsapp-clone-ubk.web.app/


Languages

Language:JavaScript 65.1%Language:SCSS 29.7%Language:HTML 5.3%