thank you so much Kishan for putting incredible amount of work on this lecture and makeing it public free! it helped me a lot to learn about socket io, and backend stuff!
just wow wow wow, most of the teacher only show the basic socket and msg sending, but you are amazing, from audio to img sending, msg seen , sent , perfect replica ui, fast, sent time is also shown, you are next level and your channel will grow
Successfully created this clone with end to end encryption and added multi lingual support with multiple language thanks kishan for this amazing course.
Fantastic work ! At 1:03:09 the issue is due to the fact that userInfo is not available at re-render. If you try to go back to /login route and login once, the error will go away
see wht its telling me 1 of 1 unhandled error Server Error TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator)) This error happened while generating the page. Any console logs will be displayed in the terminal window. Source src\pages\login.jsx (15:25) @ useStateProvider 13 | const router = useRouter(); 14 | > 15 | const [{}, dispatch] = useStateProvider(); | ^ 16 | 17 | const handleLogin = async () => { 18 | const provider = new GoogleAuthProvider();
The efforts that you put in this video is just WOW, you got me as new subscriber, thank you for this, is awsome, to bad its not with Typescript, i have some struggles with that, but this is just awsome
Kishan, this is an authentic one from start to finish. You are the coolest, brosev. So, easy to follow.. I would like to ask, for some reason, I am not getting my messages real time
proud To see an indian uploading these type of projects .Firstly when i saw thumbnail i thought it's Js Mastery's Video . but after that i read name and i was like damn 😍 man he's indian . and i just saved this in watch later so after learning react and all other technologies i'll watch this video and try to make this app
Sir please make a video how to run an ready made project of your i have purchase a code but it is not working from my side please make a video and show to run that code easilynand what changes i have to made i have an project submission this week
Beother well done a very professional set I have 2 question: Q 1) If we are going to use firebase for authentication why not also use onchangeauth instead of creating a custom hook to check the user state i like prisma and it is the first time working with it, i run in few issues to save the user on the database since I'm not using the next js, I'm using a expo but i was able to fix and save the user Q:2) do i need to regenerate the prisma each time i change the user model Or just do prisma db puch By the why since i have integrated prisma on existing projects with firestore i'm thinking to use the sql database as second data backup Question
Its awesome, Thank you for creating this kinda great videos.... Also I want that Voice Message player in React Native, can you create video in that or any library that I can use it directly for that
Hi, thanks for this amazing project. I have a question: Instead of using PostgreSQL and Prisma, is it possible to use Firestore from Firebase as an alternative for the database in this project?
There is a little error that I encountered. In VoiceMessage.jsx the useEffect used to assign the waveSurfer to the waveform.current returns a callback to destroy the waveform.current but, it will do so only for the initial render, now for the successive render the useEffect will run again However, this time only the waveForm.current is not null, it was destroyed before though and hence the current will not have the waveSurfer and the code will break while accessing the waveform.current.load method inside another useEffect. I solved this by destroying the waveform in the handlePlayAudio func i.e. when the user will play the audio message which will give it time to render all the voiceMessage components. I don't know if it's a good practice or not but it works for me
please tell me you are earning very good amount of money because the effort here is insane.. after learning all this if you are not earning in lakhs or crore then this will definitely demotivate me.. Thanks Please reply with honesty
To be honest. I'm not earning that much. I'm still struggling with sponsorships. And with youtube adsense you won't earn enough. I have been doing youtube for more than 2 years and still not sure if this would succeed, not to demote you but we have to keep trying, one day it would work out 😁
I believe that learning this flow is more important as in the bigger projects they don't rely on nextjs backend. A separate backend is a must. Consider a scenario where you want to use a message broker. In that case you would need the backend. What if you need microservices in your app. So the knowledge of the backend is a must. This is my personal opinion.
@@prashlovessamosa ok bassicaly reverse engineering, is like hacking into the app to see all the code, even the code is is supposed to be hidden to the public, by that, you can see what the app does in it's entirety, TLDR you hack the app to see all the code, and what he "did" was that to make this video
Can you clone this project using react and typescript? I'm learning react and I really want to learn this project of yours, anyway thank you, you're really good
HELLOOO ,😍😍😍😍LIKED YOU CONTENT VERY MUCH. CAN YOU MAKE NEXT PROJECT ON COLLEGE TIMETABLE SYNC APP WHERE ACTIVITIES/EVENTS/EXAMS/CLASS TIME TABLE SCHEDULE EVERYTHING CAN BE UPLOADEDD. ITS AN UNIQUE PROJECT
Het Kishan why are only attend the Payment comments & why you are not cheecking the error comments . Monstly some errors are db connections , i have also same issue . pls replay 🤨
i have a college project and i have seen about half of your video it great thanks for the video i want to ask you how can i add group video / voice calling feature .
the project is outstanding, but there is one doubt is there is any personal space for the user just like whatsapp as there is the google authentication only so ig all the users will be logged in to the single window which is not good, as anyone can enter the chat unlike whatsapp where everyone has its own personal space.
Getting this error at 10:01:58 "ZegoExpressWebRTC.js:8 Uncaught (in promise) TypeError: Failed to execute 'getStats' on 'RTCPeerConnection': parameter 1 is not of type 'MediaStreamTrack'." Please suggest how to fix this.
I will include a separate video for that in the source code in a few days. If you want you could buy out the source code it would help me out a lot and I can create more amazing content.
I will include a separate video for that in the source code in a few days. If you want you could buy out the source code it would help me out a lot and I can create more amazing content.
Awesome thank you. Build looks very clean & functional! Had to make the purchase. Q - Is implementing group chat difficult ? I notice a lot of chat tutorials don't implement it.
It's not difficult but it consumes a lot of time. Nevertheless I will be creating a chat app with group functionalities. I will create a chat app every year with more functionalities. Last year it was just a basic chat app. This year it has many features like file sharing, audio video call, voice messages, online offline status, message read status, and many minute features. Next year I'll create a chat app with group functionalities. If I get a sponsor earlier I'll create it before the end of the year. Cheers 🥂
After disconnecting the call zego cloud instance still running in the background. getting to many console logs Can you check and tell me how to resolve that issue.
I have a problem with the handlePlayRecording in CaptureAudio.js. I'm getting the error in console "CaptureAudio.jsx:128 Uncaught (in promise) DOMException: The element has no supported sources."
sir invalid hook call error in giving in statecontext file.......i am confident that i have only one react instance and my renderer and react version is same......and i syntax is also correct ..plz solve sir
You can use the concept of public keys and private keys for encryption. Actually i did some research for implementing this feature but, it would take a lot of time and It would not be possible to embed all the features in the 12 hour video as this is the limit for youtube videos. I am thinking of releasing a full fledged chat app more features than this, and a more perfect clone than this, but that would be a course instead of a youtube video.
I got an error on '"npx prisma db push" this command. Error: P1001: Can't reach database server at `localhost`:`5432` Please make sure your database server is running at `localhost`:`5432`. Please Help ............
Wow i can't imagine how a single man was seriously able to create a WhatsApp clone that is even better than the original. well done bro
bro is this clone responsive too ?, I haven't started yet just wanted to know this before starting
Nope but you can do that urself it's easy
@@lokeshnegi5051responsive means???
@@GrimReaperAMV how bro
I can tell you put a lot of work into this. Well Done👏
Thanks!
is it responsive?
@user-mx9om1ur4w No it’s not.
Hands raised for this legend ✋!!!!! Literally he created better than real whatsapp😮A single man
thank you so much Kishan for putting incredible amount of work on this lecture and makeing it public free! it helped me a lot to learn about socket io, and backend stuff!
Glad it was helpful!
Hey did u completed the course? is it working properly??
@@MuhammadIrfan-cj1cq yep i downloaded his source code and continued to refactor and to add new feature.
just wow wow wow, most of the teacher only show the basic socket and msg sending, but you are amazing, from audio to img sending, msg seen , sent , perfect replica ui, fast, sent time is also shown, you are next level and your channel will grow
Honestly, this is the first unique video with simplicity that i will follow and had no issues whatsoever. You deserve a coffee
Didn't you get any errors?
@@ababakr_asabro i am getting plethora of errors😢 a lot of care is required while typing the code. Seems like coding this 10hr would take 100hr
Your content is more than a course in udemy bro. Very nice
Glad to hear that
Successfully created this clone with end to end encryption and added multi lingual support with multiple language thanks kishan for this amazing course.
Hi, that’s awesome. Mail me let’s connect. You can contact me on discord as well. I might have some opportunities for you.
Now can you give your github link 🤣
Can you provide us your github as I am getting axios error
Fantastic work ! At 1:03:09 the issue is due to the fact that userInfo is not available at re-render. If you try to go back to /login route and login once, the error will go away
see wht its telling me
1 of 1 unhandled error
Server Error
TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Source
src\pages\login.jsx (15:25) @ useStateProvider
13 | const router = useRouter();
14 |
> 15 | const [{}, dispatch] = useStateProvider();
| ^
16 |
17 | const handleLogin = async () => {
18 | const provider = new GoogleAuthProvider();
1 of 1 unhandled error
Server Error
TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Source
src\pages\login.jsx (15:25) @ useStateProvider
13 | const router = useRouter();
14 |
> 15 | const [{}, dispatch] = useStateProvider();
| ^
16 |
17 | const handleLogin = async () => {
18 | const provider = new GoogleAuthProvider();
@@ejehwayne8586 even im getting this error, what's the solution
si esto tuviera subtitulos llegaria a mucha mas gente, muy
buen trabajo
I see subtitles there 😊😊 try checking now
The efforts that you put in this video is just WOW, you got me as new subscriber, thank you for this, is awsome, to bad its not with Typescript, i have some struggles with that, but this is just awsome
Well done bud. Nicely detailed and very informative.
It was amazing, now im learning React and this is a great project to learn! I love this
Made the complete clone 🙂🙂thank you so much❤❤❤❤
how database is connected
the exit problem made this video more realistic like one was actually trying to make out something in front
hey, have u done with your project??
can u share your source code repo?
Kishan, this is an authentic one from start to finish. You are the coolest, brosev. So, easy to follow.. I would like to ask, for some reason, I am not getting my messages real time
Have you also shown how to deploy it?
proud To see an indian uploading these type of projects .Firstly when i saw thumbnail i thought it's Js Mastery's Video . but after that i read name and i was like damn 😍 man he's indian . and i just saved this in watch later so after learning react and all other technologies i'll watch this video and try to make this app
Do you have the CaptureAudio component code?
Sir please make a video how to run an ready made project of your i have purchase a code but it is not working from my side please make a video and show to run that code easilynand what changes i have to made i have an project submission this week
Thats osmmmmmmmmm!!!
Appreciate the efforts you putted on making this amazing course
Glad you like it!
Beother well done a very professional set
I have 2 question:
Q 1)
If we are going to use firebase for authentication why not also use onchangeauth instead of creating a custom hook to check the user state
i like prisma and it is the first time working with it, i run in few issues to save the user on the database since I'm not using the next js, I'm using a expo but i was able to fix and save the user
Q:2) do i need to regenerate the prisma each time i change the user model
Or just do prisma db puch
By the why since i have integrated prisma on existing projects with firestore i'm thinking to use the sql database as second data backup
Question
Sir kindly make a video to deploy this project
I am going to do it soon.
@@KishanSheth21 🤩
yes please, I get traumatized bc I spent too much time and can't deploy
Amazing work !! It's was my college project and I got the exact project
Its awesome, Thank you for creating this kinda great videos....
Also I want that Voice Message player in React Native, can you create video in that or any library that I can use it directly for that
This build was awesome!! Can you also show us how to host this. Please......
whatttt...this is the most advanced WhatsApp close ive ever seen dude ! ... Gonna build this
Thankyou.
Do you have the CaptureAudio component code?
sir kindly make a video to deploy this project on vercel...............🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏
bro did you deployed this project, if yes can you help me to deploy mine
Subscribed Once i finish learning, I'll look for projects here thank you dude
Hi, thanks for this amazing project.
I have a question: Instead of using PostgreSQL and Prisma, is it possible to use Firestore from Firebase as an alternative for the database in this project?
Yes totally. But you'll need to change the queries for that.
There is a little error that I encountered. In VoiceMessage.jsx the useEffect used to assign the waveSurfer to the waveform.current returns a callback to destroy the waveform.current but, it will do so only for the initial render, now for the successive render the useEffect will run again However, this time only the waveForm.current is not null, it was destroyed before though and hence the current will not have the waveSurfer and the code will break while accessing the waveform.current.load method inside another useEffect.
I solved this by destroying the waveform in the handlePlayAudio func i.e. when the user will play the audio message which will give it time to render all the voiceMessage components. I don't know if it's a good practice or not but it works for me
Hey bro your tutorials are very nice need some react native expo app tutorial😊😊😊
omg bhai you just amazing no video like that in whole youtube
kamal bhai
Thankyou Man.
Very impressive bro... Can make a similar project for zoom application with next13,?
Sir plz Hindi ma videos banow you are the king of web development boss well done
Superb project, Loved it dude.
Thanks a ton!
Thank you for the great video 😀. I have a question. Why you didn't use TypeScript?
it's great that you shared this project, but does your project have a user group creation feature?
No it doesn't have a group feature. Refer to my latest chat app it has group features.
Very good your class of tecnology
please tell me you are earning very good amount of money because the effort here is insane.. after learning all this if you are not earning in lakhs or crore then this will definitely demotivate me.. Thanks Please reply with honesty
To be honest. I'm not earning that much. I'm still struggling with sponsorships. And with youtube adsense you won't earn enough. I have been doing youtube for more than 2 years and still not sure if this would succeed, not to demote you but we have to keep trying, one day it would work out 😁
Awesomeness at its extreme level
Thankyou.
Why creating a separate server and not use the server side part of Nextjs ?
the project is awesome.
why we need server even next js full stack framework...
I believe that learning this flow is more important as in the bigger projects they don't rely on nextjs backend. A separate backend is a must. Consider a scenario where you want to use a message broker.
In that case you would need the backend. What if you need microservices in your app. So the knowledge of the backend is a must. This is my personal opinion.
Wow bro!!!!!!!!! lot of effort man, I'm subscribing now
Thanks for the sub!
everything is open source, if you do a little amount of reverse engineering
Ofcourse 💯
I didn't understand please explain to me please.
@@prashlovessamosa ok bassicaly reverse engineering, is like hacking into the app to see all the code, even the code is is supposed to be hidden to the public, by that, you can see what the app does in it's entirety, TLDR you hack the app to see all the code, and what he "did" was that to make this video
Apoco si tilin?
If there is requirements of reverse engineering then it can't be said as open source
Amazing project❤ aaj lagadi apne thank u too much❤❤
Thankyou man 😁
Please make a short explanatory video on prisma
awesome dude, good job 😎
Thanks! 😁
Can you clone this project using react and typescript? I'm learning react and I really want to learn this project of yours, anyway thank you, you're really good
HELLOOO ,😍😍😍😍LIKED YOU CONTENT VERY MUCH. CAN YOU MAKE NEXT PROJECT ON COLLEGE TIMETABLE SYNC APP WHERE ACTIVITIES/EVENTS/EXAMS/CLASS TIME TABLE SCHEDULE EVERYTHING CAN BE UPLOADEDD. ITS AN UNIQUE PROJECT
Bro can you add message deletion, edit message and show when a user is typing by the way awesome tutorial
have u completed the project?is it working as shown in the vid
amazing bhai ... u got a new subscriber
Cheers 🥂
Earned a sub ❤ keep up the good work brother
Het Kishan why are only attend the Payment comments & why you are not cheecking the error comments . Monstly some errors are db connections
, i have also same issue . pls replay 🤨
Discord is already there for errors, please join discord server and someone might be able to help you there. There are mods there.
Seems a great tutorial! Would it be hard for anyone who hasn't learned Node.js (but have practices in Java, React.js)?
Won't be too hard. Give it a try.
After completing the project, how can I communicate from 2 different devices, sir?
brooo u really need support , looooooooooove that kind of useful projects please keep uploading stuff like this
Thanks, will do!
Bro Please while editing the video Make sure you increase the audio volume. i used fx sound to boost audio still very less volume.
Thanks for this awesome Tutorial. Thhis project is really great .But the projects should be responsive... 🙂
Yes, you are right I should have made this responsive. The Airbnb clone which is coming next would be responsive for sure.
i have a college project and i have seen about half of your video it great thanks for the video i want to ask you how can i add group video / voice calling feature .
You need to make several changes in the DB and you can make it.
Do you have the CaptureAudio component code?
This is super amazing. Great job
Thank you so much!
This guy is not afraid of DRY
Have you tried deploying this on vercel?
amazing project brother, god bless you!!
Thank you! Cheers!
Bhaiya, I don't know about next.js but i know react.js. Can I able to understand and code this project
You can go for it. Nextjs is not that complex.
the project is outstanding, but there is one doubt is there is any personal space for the user just like whatsapp as there is the google authentication only so ig all the users will be logged in to the single window which is not good, as anyone can enter the chat unlike whatsapp where everyone has its own personal space.
for emojis, is it using a library? or use your own component?
this is for beginner who want to be part of practice
You're very talented ❤❤
Thank you so much 😀
well done bro next month im gonna treat you to coffee
Bro
god level project
Awesome
thank you for your effort sir
Amazing and well done for this tutorial
Thanks so much 😊
❤ you too much dude, Great work!
Its really crazy bro nice video
Yeah thanks
Bro, nextjs can handle both of the things, why you used seprate server node for backend?
Getting this error at 10:01:58 "ZegoExpressWebRTC.js:8 Uncaught (in promise) TypeError: Failed to execute 'getStats' on 'RTCPeerConnection': parameter 1 is not of type 'MediaStreamTrack'." Please suggest how to fix this.
did you get the solution? I am having a same issue?
@@N0yce Update the zego cloud library, it will work
@@twinkles13 Thanks
Thanks for awesome project kishen. Will you tell how to deploy such kind of project kishen ??
I will include a separate video for that in the source code in a few days. If you want you could buy out the source code it would help me out a lot and I can create more amazing content.
I will include a separate video for that in the source code in a few days. If you want you could buy out the source code it would help me out a lot and I can create more amazing content.
Amazing project bro, i just sub your channel.. can you make kanban project with drag and drop with local storage or even better? Thanks in advanced!
Sure, I have thought for a project like Jira Clone. This will be coming before the end of the year.
Amazing project, will start this soon.
How long did it take to make this ?
5 months 🫣
@@KishanSheth21 that's a very long time lol. I will try to do this in 30 days
Coming from Spotify 😁
good luck bro
please make more video
Thankyou.
can anyone tell, if you code side by side the video, the proect will worrk fully?
Awesome thank you. Build looks very clean & functional! Had to make the purchase. Q - Is implementing group chat difficult ? I notice a lot of chat tutorials don't implement it.
It's not difficult but it consumes a lot of time. Nevertheless I will be creating a chat app with group functionalities. I will create a chat app every year with more functionalities. Last year it was just a basic chat app. This year it has many features like file sharing, audio video call, voice messages, online offline status, message read status, and many minute features. Next year I'll create a chat app with group functionalities. If I get a sponsor earlier I'll create it before the end of the year. Cheers 🥂
@@KishanSheth21Thanks
@@KishanSheth21 WE WAIT THAT
Hello. I want to buy this but I can only pay with PayPal for online purchases. I don’t have a credit card. Please let me know.
Hi, please reach out to me on my email: kishansheth21@gmail.com
Hello sir
Please 🥺 tell me how to add push notification on WhatsApp clone please......🥺🥺🥺
omgg amazingg, so are u for real sirr.
May i know how long do you spend on creating this high quality side projects?
Depends, this clone took me around 2 months.
damn bro, this is so great for learning
Glad you liked it.
could you please show us how to implement it in a react native app ? I am looking for such a tutorial for so long!
Yes, soon
I get this problem when connecting to the database:
db error: ERROR: zero-length delimited identifier at or near """"
Does it have a group functionality and block unblock aswell?
0:55:50 can you plz help in app jsx facing white screen issue after implementing stateprovider
Were you able to solve it ? If yes then how?
After disconnecting the call zego cloud instance still running in the background. getting to many console logs
Can you check and tell me how to resolve that issue.
I have a problem with the handlePlayRecording in CaptureAudio.js. I'm getting the error in console "CaptureAudio.jsx:128 Uncaught (in promise) DOMException: The element has no supported sources."
Bro please help me whenever i make a call it get disconnected do i need two different microphone and camer for it to work or it should have worked?
Bhai Postgresql account banate time bhi bata diya karo begginers ko issue aate he bht 🤦🙌
kaise link generate hua postgresql wala ?
sir invalid hook call error in giving in statecontext file.......i am confident that i have only one react instance and my renderer and react version is same......and i syntax is also correct
..plz solve sir
Hi I have one question How to provide end to end encryption in our App
You can use the concept of public keys and private keys for encryption. Actually i did some research for implementing this feature but, it would take a lot of time and It would not be possible to embed all the features in the 12 hour video as this is the limit for youtube videos. I am thinking of releasing a full fledged chat app more features than this, and a more perfect clone than this, but that would be a course instead of a youtube video.
I got an error on '"npx prisma db push" this command.
Error: P1001: Can't reach database server at `localhost`:`5432`
Please make sure your database server is running at `localhost`:`5432`. Please Help ............
i raise my hat for this great video