OBS studio is cool but lets create our very own screen recorder using JavaScript.
And guess what? Its not limited to just recording the browser scr...
For further actions, you may consider blocking this person and/or reporting abuse
Great article! Keep it up! However, I have question...
Why you need to create chunks when
e.data
indataavailable
is already a blob?Isn't that part kinda unnecessary?
Couldn't we just use it like this?
as you keep recording the
dataavailable
event will run multiple time. So basically instead you giving you the entire video once recording is done it will give you data in small parts as the video is being recorded.Ok cool! Thank you
YOU ARE AWESOME MAN!!
Do you have a YouTube channel, blog or something like that?
Many many Thank.
Yes, I have a YouTube channel.
But I am introvert so I struggle to talk which is why my videos are not that good. But I'm trying to improve
youtu.be/mD_QQvJYQAI
Very clear explanation. Loved it
Many many Thanks
The minute I saw the tutorial, the next thing I knew was that I'm gonna make this thing my self. Created in React and deployed. Thank you once again.
Damn thats really great.
If you want something way more challenging you can try this
Damn. You just earned a follower and my respect. Keep those challenges coming coach.
Thanks a lot.
I also followed you back.
It's pretty cool !!! thank you man
You're most welcome
TL;DR: your solution generates broken files for chrome.
There's an issue with Chrome, that leads to losing metadata on video files created using MediaRecorder. The file is playable, yet, it has no duration so you can't scroll it and it's always 00:00 / 00:00. You've added
let video = document.querySelector("video")
video.src = url
Which is meaningless, unless you're trying to implement this workaround. But it requires changing the
currentTime
and doesn't actually work for saved file, only for<video>
tag in document.I'm not being toxic about your topic, just struggling myself to solve this. Any ideas are welcome.
Great Article mate , getDisplayMedia isn't supported in android& ios. Is thre any work around ?. All I'm looking for is to record a webpage as a video don't have to record out side browser like getDisplayMedia.
Why bother when you can use the usual programs like this and not bother. I just like such programs for their simplicity and convenience. Even a child can relax with them.
Nice
Thank you
awesome, this is a great extension to all the zoom clone tutorials 👍
Glad you liked it
Nice tutorial!
I'm really glad that you liked it.
That's really great!!
Glad you found this helpful
Nice tutorial, i was wondering how to do this, your step-by-step tutorial is awesome
I am really glad that you liked it
Thank you buddy. İt's very beautiful
Many Thanks I am glad you liked it
Really awesome tutorial !
I am glad you liked it.
Your script is just awesome. This script only record video. Can you please add audio option when recording screen.
This is a cool tutorial. Liked a lot.
Could you please include an Internal Audio record method with this?
Did you repost this to Medium?
javascript.plainenglish.io/lets-us...
Great post. Thank you!
Glad you liked it
wow
hello
I am web developer. I have to build new site.
but I have to capture image from stream-video when user click capture button.
Also I have to extract from that images.
Help me.
stackoverflow.com/questions/259705...
Great Tutorial here.. Please i cant fin where the recorded files are been saved.
In your downloads folders.
Very nice article, thank you.
Yes
developers.google.com/web/fundamen...
But its hard to to both at once
Dear Shupvo,may I translate your all dev articles into Chinese?I would like to share it with more developers in China. I will give the original author and original source.
Sure, You're most welcome
This was a good article. Step by step articles like this are really a good idea. Good Job.
Many thanks, I apprecate your valuable comment a loy
Can I export the video in MP4 format?
amazing tutorial!! but can we remove the share screen dialog before it start recording?
Hi there, great tutorial!
My question, is there any chance, that I can record a fixed area off the screen x- and y-Position with a fixed width and height?
Thx