9.1 Recording Video part.1 우선 start recording을 눌렀으면 버튼의 innerHTML이 "Stop recording"으로 바뀌게 코드를 넣는다. 그리고 finally부분을 추가하여 removeEventListener 구문을 이곳으로 옮긴다 try나 catch 부분 둘 중 하나가 실행된 후 finally구문이 실행된다. 아직 여기까지 한 것은 진짜 녹화를 한 것이 아니라 그냥 프리뷰만 보이게 한 것이니까 함수 이름을 바꾼다. (startRecording => getVideo) const recordContainer = document.getElementById("jsRecordContainer"); const recordBtn = document.getElementById(..

8.5 Volume Bar part.1 비디오가 끝났을 때 시간을 처음으로 다시 돌려 놓을거고 비디오를 멈출것이다. (현재는 비디오가 예를 들어 52초짜리면 다 재생되면 00:00:52/ 00:00:52 라고 떠있다. 그리고 플레이버튼은 ⏸ 에 머물러있다. 우리는 ▶이 되기를 원한다.) function handleEnded(){ videoPlayer.currentTime = 0; playBtn.innerHTML = ''; } function init(){ playBtn.addEventListener("click", handlePlayClick); volumeBtn.addEventListener("click", handleVolumeClick); fullScreenBtn.addEventListener("c..

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..

6.8 Github Login Part.3 githubLoginCallback 함수 수정하기 export const githubLoginCallback = (accessToken, refreshToken, profile, cb) => { console.log(accessToken, refreshToken, profile, cb); }; 지난시간에 깃허브 로그인 누르고 콜백함수로 돌아올 때 console에 주어진 정보를 확인만 했었다. 이제 그것을 수정하려고 한다. 사실 accessToken, refreshToken이런건 필요 없고 profile에 있는 github ID, 이메일, 이름, 그리고 아바타(프로필 사진) 이게 중요하다! 그리고 여기서 cb 함수는 passport에서 제공된 callback 함수..

6.7 Github Login Part.2 사용자를 깃허브로 보낼 함수 작성하기(githubLogin) 위에서는 사용자가 깃허브에서 돌아왔을 때 실행할 함수를 작성한 거고 사용자를 깃허브로 보낼 함수도 작성해야 할 것이다. userController에서 하나를 더 생성한다. export const githubLogin = passport.authenticate('github'); ↑ userController.js 이전에 local방식으로 인증했던 거랑 똑같은 코드이다. 공식 문서를 보면 이렇게 나와있는데 즉 누군가 저 루트로 접속하면 passport에서 github 방식으로 사용자를 인증해주겠다는 의미이므로 이걸 위한 루트도 만들어야 한다. 깃허브 로그인을 위한 루트 만들기 routes.js에서 먼저 ..

6.5 MongoStore and Middlewares 서버가 재시작되어도 로그인이 유지되도록 하기 js 파일을 수정해서 서버가 재시작된다고 하더라도 쿠키를 계속 보존하고 여전히 로그인 상태를 유지하게 할 수 있는 것을 할 것이다. --> 원래는 그냥 아무것도 설정하지 않아서 메모리를 사용해서 저장을 했었기 때문에 데이터베이스를 사용해서 세션을 저장하도록 하면 된다. mongoDB, 즉 데이터베이스를 사용해서 세션을 저장하도록 하기 connect-mongo(mongo와 연결하기)를 써서, session에게 데이터를 MongoStore라는 저장소에 저장하라고 알려주어야 한다. connect-mongo설치 및 설정 설치 : npm install connect-mongo **현재 connect-mongo 버전..