making custom video components

anyone know how i can make a styled component that works with youtube links? or ig more broad how can i store a video and then with a fetch request get the video to style. the ideal route would be youtube as then i can just store a youtube link in the db rather than some file to manage
6 Replies
dysbulic 🐙
dysbulic 🐙11mo ago
I'm pretty sure the only way to play YouTube videos using YouTube as the source is to use their player which is a web component: https://developer.mozilla.org/en-US/docs/Web/API/Web_components There are YouTube downloaders that will give you the source video, but they're against YT's terms of service & they keep getting them shut down. If you have videos of your own that you want to play, you use the <video> element: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video You don't fetch the source, but specify it as a <source> child of the <video> element.
NefariousApe
NefariousApe11mo ago
hmm so if i have the video myself is there anyway to not deal with having to send over an entire video through some http request?
dysbulic 🐙
dysbulic 🐙11mo ago
The file will play as it arrives. The browser will handle buffering and requesting the right parts when you seek. I don't understand what you're trying to avoid. To watch the whole video, you have to download the whole video.
NefariousApe
NefariousApe11mo ago
im trying to avoid having to send a video itself through the http request. idk how costly that is but i cant imagine trying to send 50 videos on every page request is great. so would prefer if i can just store the link itself and then render a video based on the link
Senra
Senra11mo ago
to render it, it still has to be downloaded I suggest for your use case, you can look into what Video CDN's are. I think that is exactly what you might be looking for
NefariousApe
NefariousApe11mo ago
yeah ill give that a look thank you.