For anyone confused about where the Real Time Messaging SDK is, it is now called Signaling and as of February 2nd, 2024, you can follow this tutorial using version 1.5.1 of the SDK. Do not use version 2.1.5 or 2.1.7.
Guys, I reaaly want to thank you both (Dennis and Brad) for all that content you put out there for us. Ever since I started developing Web applications with your advice and tutorials I got significantly better and last month, I've been hired by a large company as a Software Engineer without any CS degree. Thank you guys. Wilfried.
Hi guys! In the section "Set camera quality settings" - 2:45:40 if your camera does not support 1080p it will not work, I've tested this project on Logitech C270 HD WEBCAM which support 720p and when i've tried to set the quality like on this tutorial it didn't work, but when u will change it to 1280x720 then everything will be ok :) anyway this tutorial is amazing, thank u for uploading this video on this YT channel :) *edit encoderConfig: { width: { min: 640, ideal: 1280, max: 1280 }, height: { min: 480, ideal: 720, max: 720 }, },
@@anshvora9119 ik its a bit late but at 2:46:28 the line he changes just let it remain as is and don't do any changes to it your video should work on the auto settings
@@DennisIvy 2:22:47 at this point my another user image is not fully loading it is showing only the half image inside the circle how to fix this anyone knows pls help me out with this !
MY GOD THANK YOU! I AM WORKING ON THIS BRAD AND THERE IS NO OTHER TUTORIAL OR HELP ABOUT THIS , I CAN'T THANK YOU ENOUGH FOR ARRANGING THIS! I WILL FOREVER BE IN DEBT DENIS IVVY AND BRAD!
I'm just learning JavaScript, I'm basically at a level when I can get references to elements and manipulated them. This tutorial is very advanced for beginners, but I think it's an excellent project to build. Not only will it give you a challenge - trying to follow along and digest what's being done, but you're going to have very cool app you can use in your portfolio. So, if you're like me and just getting started, don't sweat how complex it may appear. Just code along blindly. Doing so will not only help reinforce what basic information you do have, but will allow you to be inspired by building a real, working project that has real, practical application. Thanks to Brad, and Dennis for putting this out there. Good stuff guys!
@@DenzelHooke Good to know! Can you explain this to me? I'm a little confused about it. Thanks. peerConnection.ontrack = (event) => { event.streams[0].getTracks().forEach((track) => { remoteStream.addTrack(track); }) }
@@scottonanski4173 yeah of course. ontrack is a function (or more commonly called a method) that gets called anytime tracks are added to the peerConnection object. When a track is added by the other remote user, that function will loop though the available tracks and add them to the remote stream object. Basically copying those audio and video tracks onto our screen so we can see the user.
This is great. Wow I worked on Web rtc a couple of years back and I got stacked at how to make it work over the Internet because it worked perfectly fine when within the same network
That content is Awesome to clearly understand the concept of WebRTC. Thanks to every members of travery media. Hope you guys always splendid course like this. So, Head up for your hard work.
No It's not. Signalling is basically coordination between two or more than two users by using third party server which is in public IP address if your application is getting served over internet.
You are the best, i was actually reaching on this. MAN I LOVE YOU. and i just finish your MERN Stack.. and i really loved it, thanks. GOD bless you, i love you I love you
Thanks for the amazing projects! But I still don't quite understand the whole signaling process. I get the idea of exchanging ICE candidates, but in the demo at the beginning of the video, although there's nothing done related to exchanging ICE candidate, it still works. That's what I don't understand.
Thank you Dennis because I need this for my project! can I ask for your help for a video tutorial like how to deploy something something like this? or like what server are you using like in the app live demo?
Great video on the big picture of WebRTC! Despite the sparse tutorials and complex documentation, this video clarifies a lot. I'm curious about one thing: In a mesh network, once devices establish an initial connection, can they automatically reconnect if someone goes offline and then comes back online? Could this reconnection occur seamlessly without user intervention?
Thank you so much for this helpful tut Dennis and Brad.🙇 The only issue (from production pov) is the buggy audio at localstream end. There's lots of echo and noise when we speak, while peer's audio comes to us clearly. Any help would be great, thanks again!
Thanks a million for such a wonderful video tutorial. You guys are just AWESOME!!!! I have a question though - how can audio transcription using Google Speech - to - Text API be added to this code? Your input will be highly appreciated.
Congratulations on the video. I have a question. I have a video on vmix and copying the url of the video on the browser works and in Inspect I have a Json object called vMixCall in which the answer is present. vMixCall: {"type": "answer", "sdp": "v = 0 \ r \ no = IceLink ......."} how can i show this video of vMix on my webpage in localhost: 3000?
Great tutorial!! so good thanks. --constraints syntaxis did not work for me, either on the live demo. fixed: let constraints = { video:{ width:"min:640, ideal:1920, max:1920", height:"min:480, ideal:1080, max:1080", }, audio:true }
I really appreciate you for sharing your knowledge, I hope that I can become a professional like you and do this. A big thumbs up !! 👍 I have a question, is it possible to add an emotion and face recognition script to this script? Does the variable "localTracks[1]" contain video and should I work on it?
Hey, amazing video, you were very thorough with the networking part of it. Nothing short of amazing though I have only covered 10% of the video. One request, can you guide me to resources where I can read more about the underlying networking aspects of it, or where exactly you learnt it all from?
Best technical breakdown I’ve seen was from a video from Husain Nasar. It’s call webrtc crash course. Should be one of the first videos when you look up webrtc
I just have a very simple query if anybody can solve, what exactly is the Agora service doing, if building webrtc applications is not that difficult, like how do you explain that pricing?
Well, I have it going when I put the code on a separate server with https facility (did you mention that as a requirement) and serve the pages to two separate computers each with their own camera. But I can't get it running on a single computer with 1 or two cameras as you have on your video. It seems even when I use 2 cameras on one computer with two separate browsers (even different types, such as edge for one and chrome on another with each browser using a different camera source) that it still won't run. For some reason opening a camera on one browser blocks out the camera. on the other browse, even if they are separate video streams. It would be nice to run it on a single machine so that I can run the debugger on the IDE, but no joy. Any tips would be greatly appreciated.
When you're testing the app on one computer, is there any way to share the video source between two instances of the web page? Seems I've almost got this going, except I can't open a second browser page because the webcam is in use by the first web page.
How can I make the first project video call work on different networks? Like I want to video call someone in a different location connected to an other network.
hello great job... a question when a connection is made with a device connected to a wifi network and the other device to a gsm 4g network, the video does not play, do you know the reason?
For anyone confused about where the Real Time Messaging SDK is, it is now called Signaling and as of February 2nd, 2024, you can follow this tutorial using version 1.5.1 of the SDK. Do not use version 2.1.5 or 2.1.7.
Can you tell me where the data is stored.
Is there a database...
How can I contact you?
Thanks a Lot!!!!
did u get it@@ahammedmushfiq4588
@@maheshkeshwala62 no
all the other thing works right?
0:55 I cant' believe it made it on the World-famous Brad's UA-cam Channel. Thank you Dennis!
I'm definitely gonna give this tutorial a shot🚀
@@yashsolanki069 go for that!
because you are a gem
@@aldrinseanpereira140 I am not crying now
Guys, I reaaly want to thank you both (Dennis and Brad) for all that content you put out there for us. Ever since I started developing Web applications with your advice and tutorials I got significantly better and last month, I've been hired by a large company as a Software Engineer without any CS degree. Thank you guys.
Wilfried.
How do you advise that I sell the video call skill I learnt from this video
@@SteveOluwatobisharing a link to your repo..? 😳
Hi guys! In the section "Set camera quality settings" - 2:45:40 if your camera does not support 1080p it will not work, I've tested this project on Logitech C270 HD WEBCAM which support 720p and when i've tried to set the quality like on this tutorial it didn't work, but when u will change it to 1280x720 then everything will be ok :) anyway this tutorial is amazing, thank u for uploading this video on this YT channel :)
*edit
encoderConfig: {
width: { min: 640, ideal: 1280, max: 1280 },
height: { min: 480, ideal: 720, max: 720 },
},
@@iam-Coderpls let me know
where do we make these changes?
@@anshvora9119 ik its a bit late but at 2:46:28 the line he changes just let it remain as is and don't do any changes to it your video should work on the auto settings
Thank you so much Brad and Dennis! You guys are my all time heroes🔥❤
😊
Great video Dennis you definitely put in a lot of work in this project.
🙏
@@DennisIvy 2:22:47 at this point my another user image is not fully loading it is showing only the half image inside the circle how to fix this anyone knows pls help me out with this !
MY GOD THANK YOU! I AM WORKING ON THIS BRAD AND THERE IS NO OTHER TUTORIAL OR HELP ABOUT THIS , I CAN'T THANK YOU ENOUGH FOR ARRANGING THIS! I WILL FOREVER BE IN DEBT DENIS IVVY AND BRAD!
☺️
@@DennisIvy You're a lifesaver ! Thank you for putting out the amazing content , I am really grateful to you 💙
Thank you for this free lesson. It will help me build a side project idea I have been planning to work on for a while now.
I'm just learning JavaScript, I'm basically at a level when I can get references to elements and manipulated them. This tutorial is very advanced for beginners, but I think it's an excellent project to build. Not only will it give you a challenge - trying to follow along and digest what's being done, but you're going to have very cool app you can use in your portfolio.
So, if you're like me and just getting started, don't sweat how complex it may appear. Just code along blindly. Doing so will not only help reinforce what basic information you do have, but will allow you to be inspired by building a real, working project that has real, practical application.
Thanks to Brad, and Dennis for putting this out there. Good stuff guys!
It may look very advanced but It's not too hard to comprehend as long as you take it slow and dissect the info he's delivering.
@@DenzelHooke Good to know!
Can you explain this to me? I'm a little confused about it. Thanks.
peerConnection.ontrack = (event) => {
event.streams[0].getTracks().forEach((track) => {
remoteStream.addTrack(track);
})
}
@@scottonanski4173 yeah of course. ontrack is a function (or more commonly called a method) that gets called anytime tracks are added to the peerConnection object. When a track is added by the other remote user, that function will loop though the available tracks and add them to the remote stream object. Basically copying those audio and video tracks onto our screen so we can see the user.
@@DenzelHooke I see it now!
This is great. Wow
I worked on Web rtc a couple of years back and I got stacked at how to make it work over the Internet because it worked perfectly fine when within the same network
Oh wow didn't expect a WebRTC tutorial from this channel. That's a sphere most tech youtubers don't touch lol. Very nice :)
Awesome!
I was actually waiting for it
You two guys are the smartest tutors online.
I can't thank you enough !
Merci beaucoup !
Muchas gracias !
From DRC.
That content is Awesome to clearly understand the concept of WebRTC.
Thanks to every members of travery media.
Hope you guys always splendid course like this. So, Head up for your hard work.
Realtime messaging is now called Signaling, and you can find that in the API reference documentation mentioned at 38:08
When I type AgoraRTM is says it's not definened in my console.
@@isazisempi3896 Maybe you don't call the script in the html file ? 34:30
Thanks man, i love you!
@@isazisempi3896 same.. did you figure out how
No It's not. Signalling is basically coordination between two or more than two users by using third party server which is in public IP address if your application is getting served over internet.
Was struggling to find a good and very well-explained tutorial on WebRTC. Then I saw Dennis.
Daym my man 👌🏻
Saved my ass.
Thanks alot Denis and brad for all your efforts towards nurturing up coming developers through all your amazing free tutorials here
This is the best video ever on youtube, thank you guys for your share. A big Thanks to every members of travery media ❤❤❤❤
Thank you so much for posting this video. It made WebRTC concept 100 times easier to understand.
You are the best, i was actually reaching on this. MAN I LOVE YOU. and i just finish your MERN Stack.. and i really loved it, thanks. GOD bless you, i love you I love you
Amazing video. The timing was impeccable! Just what I need for my project
Brilliant Brilliant Brilliant. About time someone posted something that makes total sense when it comes to WEBRTC
this channel make us to be another level skill. thank you
Thank you for the tutorial and insights on using agora as third party SDK/ API. I really appreciate it!
Have u completed
ohhhhhhh myyy gooddd WebRTC FULL TUTORIAL? am i dreaming
Amazing... You are amazing programmer 😇😇😇.. A million of thankful🙏...
You’re very welcome 😉
Thanks for everything @Dennis you got a new subscriber and already subscribed to this channel
Dennis is on his way to disrupting Zoom and Google Meet..! 😂😂
Coming after them!
Can you do a website where two random people can be connected with a click of a button. And can you do the full version? Like on one's own server
Awesome projects. Mumble IPO in 3 months
Haha!
This exactly what I'm looking for. I am personally a huge fan of Dennise.
Take a bow , this guy is our hero
Must see video.. thank you guys !!!
Hope you enjoy!
I've been waiting for this 😍👍
Haha then the timing is perfect!
Finally a WebRTC course!
I'm just here to see what's up, and man, it's so exciting!!! :) Never have enough time, so I leave now, bye. Going back to my side project. :)
No words i wanted this project
Now that’s what I call a fine
job !!!! 👍👍👍
Couldn’t have done it better
myself .
Thankyou very Dennis and Brad 👍
Absolutely amazing , thank you
Brilliant! thank you so much!
Thanks Brad & Dennis for this video :)
This is great. Love this!
Thank you so much 👍🏼🎉🤛🙏⭐,. Really Cool application
Thanks for sharing!!!!
This is just great content
🙏
Let's go Ivy
You guys are doing the most
Amazing!
Thanks a lot sir god bless you Brad and Dennis
Thanks for the amazing projects! But I still don't quite understand the whole signaling process. I get the idea of exchanging ICE candidates, but in the demo at the beginning of the video, although there's nothing done related to exchanging ICE candidate, it still works. That's what I don't understand.
Much love from Ghana
Thank you Dennis because I need this for my project! can I ask for your help for a video tutorial like how to deploy something something like this? or like what server are you using like in the app live demo?
Great video on the big picture of WebRTC! Despite the sparse tutorials and complex documentation, this video clarifies a lot. I'm curious about one thing: In a mesh network, once devices establish an initial connection, can they automatically reconnect if someone goes offline and then comes back online? Could this reconnection occur seamlessly without user intervention?
Hi Brad, could you have someone to do an Angular project please?
Love your work , always 🎉🎉❤❤🎉🎉😊😊
Yeah, I can look for someone. I haven't used Angular in about 2 years that's why I haven't had much on it.
Thank you so much Brad, you are legend , stay blessed 😊🙏❤️😊.
Thank you so much for this helpful tut Dennis and Brad.🙇
The only issue (from production pov) is the buggy audio at localstream end. There's lots of echo and noise when we speak, while peer's audio comes to us clearly. Any help would be great, thanks again!
Good Tutorial. Can you please provide more information regarding TURN Servers and how to host and use it? Thank you
👍👍👍👍
Awesome ⚡⚡⚡⚡
Amazing.
Thank you ❤️
excellent, thank you very much, very clear to learn
Thanku so much from Karakalpakstan
Nice work
This is awesome!!!🤩
How do i like this twice...
😄
Thanks a million for such a wonderful video tutorial. You guys are just AWESOME!!!!
I have a question though - how can audio transcription using Google Speech - to - Text API be added to this code? Your input will be highly appreciated.
Pls tell is Agora video SDK is working for project 2?
this guy is on fire
Amazing, thank you ❤🥹
It helps me a lot, Appreciate !
Very Helpful Thanks man!!
Thanks this is extremely useful! I would like to ask if you could share the desktop wallpaper too hehehe it's so soothing!
Thank yo for making this video
Congratulations on the video. I have a question. I have a video on vmix and copying the url of the video on the browser works and in Inspect I have a Json object called vMixCall in which the answer is present. vMixCall: {"type": "answer", "sdp": "v = 0 \ r \ no = IceLink ......."}
how can i show this video of vMix on my webpage in localhost: 3000?
Hey there! Thanks for the great video! On the demo page all rooms are shown, that are currently active. How did you achieve that?
Thanks :)
Great tutorial!! so good thanks. --constraints syntaxis did not work for me, either on the live demo. fixed:
let constraints = {
video:{
width:"min:640, ideal:1920, max:1920",
height:"min:480, ideal:1080, max:1080",
},
audio:true
}
Wooooow
Great course! Easy to follow! How to convert webRTC to rtmp stream?
Wish I can like this twice,
Legend 🙏
I really appreciate you for sharing your knowledge, I hope that I can become a professional like you and do this.
A big thumbs up !! 👍
I have a question, is it possible to add an emotion and face recognition script to this script?
Does the variable "localTracks[1]" contain video and should I work on it?
Great! Thank You!
Hey, amazing video, you were very thorough with the networking part of it. Nothing short of amazing though I have only covered 10% of the video.
One request, can you guide me to resources where I can read more about the underlying networking aspects of it, or where exactly you learnt it all from?
Best technical breakdown I’ve seen was from a video from Husain Nasar. It’s call webrtc crash course. Should be one of the first videos when you look up webrtc
@@DennisIvy oh I already follow him! I also have his course on Udemy! 😀
New intro!
❤❤❤❤❤
Thunks
I just have a very simple query if anybody can solve, what exactly is the Agora service doing, if building webrtc applications is not that difficult, like how do you explain that pricing?
Getting error Uncaught (in promise) RtmUnauthenticatedError: Error Code 5 - The vendor enabled the dynamic key, but uses the static key.
Well, I have it going when I put the code on a separate server with https facility (did you mention that as a requirement) and serve the pages to two separate computers each with their own camera. But I can't get it running on a single computer with 1 or two cameras as you have on your video. It seems even when I use 2 cameras on one computer with two separate browsers (even different types, such as edge for one and chrome on another with each browser using a different camera source) that it still won't run. For some reason opening a camera on one browser blocks out the camera. on the other browse, even if they are separate video streams. It would be nice to run it on a single machine so that I can run the debugger on the IDE, but no joy. Any tips would be greatly appreciated.
When you're testing the app on one computer, is there any way to share the video source between two instances of the web page? Seems I've almost got this going, except I can't open a second browser page because the webcam is in use by the first web page.
Nice
How can I make the first project video call work on different networks? Like I want to video call someone in a different location connected to an other network.
The best chanel
Hello Dennis. We need the first project without Agora please. Thank you for your videos ❤
great work
Perfect video
Very helpful thank you
Thank you for this amazing work. Do you have any video like this for Java?
🔥🔥🔥
very nice
What's RTC? And what OS are you on?
Really a great project.. 👌
hello great job... a question when a connection is made with a device connected to a wifi network and the other device to a gsm 4g network, the video does not play, do you know the reason?