Build a real time chat app with Firebase and React.js | Beginner tutorial

In this video you will learn to create a group chat app using Firebase and its database of firestore. All of this is created using Vite and React js. Also, this project has google auth with firebase.
Source code: gist.github.com/Mif2006/a1207...

[@YassineEnnachat]

I think it would be better if you explained what the imported functions do upon writing the import that way we can understand why they need to be imported. and how each section of the line does like the snapshot.docs.map what does each one do "snapshot" "docs" "map"

[@fiend_1108]

is there a way where we cn have multiple chats, instead of one global chat where anyone can join with email

[@WebChainDev]

Yes, that's possible. I believe the structure would be something like this: a chats collection which would hold each chat as a document. This document would have fields with the people who own the chat and a messages collection like the one in this video.

[@fiend_1108]

@@WebChainDev could you possibly make a small tutorial on it, it would be really helpful

[@anishgupta2915]

@@WebChainDev sir how join other in chatroom with his mail

[@anishgupta2915]

yes sir @@fiend_1108

[@MujahidulIslam]

firstly thanks for make this video,, i didn't understand your source code 79 and 80 number line code. Can you explain to me? because i am beginner.

[@WebChainDev]

In this block of code we are mapping through all of the messages. msg.data.uid === user.uid checks if the sender of the message is the current user (by seeing if their uids are the same) , and if so, places the message of the right side of the screen, otherwise putting it on the left. The next line does the same thing but applies some styles to the background and text color. Hope this helped

[@lorenzoj7925]

Everything was going well but at last i got this error while connecting to local host [plugin:vite:react-babel] C:\Users\loren\OneDrive\Desktop\Loren Chat\src\App.jsx: Unexpected keyword 'const'. (10:4) 13 | It cannot verify the word const

[@WebChainDev]

In these cases the error is usually a typo in some other place. I suggest checking the source code to see where it is

[@ranviee]

Source Code?

[@WebChainDev]

Here it is: gist.github.com/Mif2006/a12076e9d48444df7b3f348634a3caba

[@ranviee]

thank you 😆@@WebChainDev