분류 전체보기(277)
-
[유튜브 클론코딩] 8.3 Enter Fullscreen / Exit Fullscreen
8.3 Enter Fullscreen / Exit Fullscreen 🥞이번시간에 해볼 것: 누르면 전체 화면이 되고 다시 누르면 전체화면이 종료되는 버튼을 기능을 구현해보겠다. 🍪videoPlayer.pug에 아이디 추가하기 늘 그랬듯이 videoPlayer.pug에 아이디를 추가한다. (#jsFullScreen) mixin videoPlayer(video = {}) .videoPlayer#jsVideoPlayer video(src=`/${video.src}`) .videoPlayer__controls .videoPlayer__column span#jsVolumeButton i.fas.fa-volume-up span |00:00 / 10:00 .videoPlayer__column span#jsPlayB..
2021.03.16 -
[유튜브 클론코딩] 8.2 Mute / UnMute
8.2 Mute / UnMute 🍙 이번시간에 해볼 것 : 🔊볼륨 ON(Unmute) / 🔇볼륨OFF(Mute) 참고: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement HTMLMediaElement - Web APIs | MDN HTMLMediaElement The HTMLMediaElement interface adds to HTMLElement the properties and methods needed to support basic media-related capabilities that are common to audio and video. The HTMLVideoElement and HTMLAudioElement element..
2021.03.16 -
[유튜브 클론코딩] 8.1 Play Pause Functionality
8.1 Play Pause Functionality 🍔 assets > js > videoPlayer.js 파일을 만든다 그리고 이것을 사용할 수 있도록 main.js에서 videoPlayer.js 파일을 import 해준다. import "../scss/styles.scss"; import "./videoPlayer"; ↑ main.js 🍔 videoBlock.pug에 id를 따로 추가해준다 오직 자바스크립트에서만 사용하고 싶기 때문에 아이디를 추가하는 것이다. mixin videoPlayer(video = {}) .videoPlayer#jsVideoPlayer video(src=`/${video.src}`) .videoPlayer__controls .videoPlayer__column span i.f..
2021.03.16 -
[유튜브 클론코딩] 8.0 Starting the Video Player
8.0 Starting the Video Player 이번 chapter 8에서는 비디오플레이어에 대한 front-end부분을 해볼 것이다. 원래는 video의 속성으로 autoplay=true, controls=true라고 쓰면 자동으로 비디오플레이어가 될 수 있지만 이걸 직접 구현해보려고 한다! 🍕views > mixins > videoPlayer.pug를 만든다. mixin videoPlayer(video = {}) .videoPlayer video(src=`/${video.src}`) .videoPlayer__controls .videoPlayer__column span i.fas.fa-volume-up span |00:00 / 10:00 .videoPlayer__column span i.fas...
2021.03.16 -
[자료구조] 이진탐색트리 구현 - 중위순회, 전위순회, 후위순회 메소드
중위순회(in-order traversal) : (왼쪽 - 루트 - 오른쪽) 오름차순(작은 값에서 큰 값 순)으로 방문된다. 트리 정렬 시 사용되는 방법임 전위순회(pre-order traversal) : (루트 - 왼쪽 - 오른쪽) 자식 노드보다 노드 자신을 먼저 방문한다. 구조화된 문서를 출력할 때 많이 이용하는 방법 후위순회(post-order traversal) : (왼쪽 - 오른쪽 - 루트) 자식 노드를 노드 자신보다 먼저 방문 디렉토리와 서브 디렉토리의 파일 용량을 계산할 때 쓰는 방법 //in-order traversal 중위순회 (왼쪽 - 루트 - 오른쪽) inOrderTraverse(callback){ this.inOrderTraverseNode(this.root, callback); }..
2021.03.16 -
[유튜브 클론코딩] 7.3 Adding Creator to Video / 7.4 Protecting Video Routes
7.3 Adding Creator to Video 이제 비디오를 업로드한 사람을 추가해볼 것이다. 일단 그 전에 업로드한 비디오는 슬프지만 다 지워본다. console > mongo - help - use mytube - db.videos.remove({}) Video.js에서 creator 항목을 추가해주기 import mongoose from "mongoose"; const VideoSchema = new mongoose.Schema({ fileUrl: { type: String, required: 'File URL is required' }, title : { type: String, required : "Title is required" }, description : String, views:{ ..
2021.03.15