개발/Node.js2024. 11. 24. 00:27Comment

0. Before start - 댓글을 구현할 건데 우리가 했던 모든 것들을 복습할거임 - 새로운 모델, 컨트롤러, 라우터, 바닐라JS, 상태코드, populate, mongoose relationship 등등 - 동적인 댓글을 구현하고 이게 끝나면 배포할 거임 - 실제 db를 사용하고 assets은 서버에 저장하면 안되니 그런 것들을 전부 수정 - 모든 시작은 데이터부터 이므로 모델 먼저 만들거임1. Comment Modelimport mongoose from "mongoose";const commentSchema = new Mongoose.Schema({ text: { type: String, required: true }, owner: { type: mongoose.Schema.Types.Obj..

개발/Front-end2024. 11. 17. 23:05Video Duration and Time Formatting

1. Loaded meta data event - 메타데이터는 비디오를 제외한 모든것을 말함   - 비디오의 시간이나 비디오의 크기 같은 것들 - handleLoadedMetaData 함수에서는 event로 아무것도 하지 않고 있음   - 하지만 총시간에 video.duration을 넣는 이유는 이 함수가 호출해서 비디오의 길이를 알 수 있기 때문   - 즉 함수가 실행되기 전에는 우린 비디오의 총 시간을 알 수가 없음 - 이제 재생되고 있는 시간은 1초마다 계속 새로고침 되어야함   - 기존 비디오 플레이어의 재생 바를 클릭해도 새로고침이 되어야함   - 영상이 얼마나 진행되었냐에 따라 시간도 따라가야함 - 우린 timeupdate 이벤트를 사용함 2. Time Formatting - data cons..

Video Player
개발/Front-end2024. 11. 16. 20:09Video Player

1. 우선 설정 - 브라우저에서 제공받은 플레이어를 가지고 있지만 너무 기본적임 - 하지만 어떤 스타일도 적용할 수 없고 바꾸려면 우리가 직접 만들어야 함 - HTML CSS 자바스크립트까지 전부 만들어야 함 - 먼저 작동은 되지만 못생긴 자바스크립트를 만들거임 - 그다음 CSS를 사용하여 예쁘게 바꿀거임 - 그전에 webpack이 어떻게 설정됐는지 봐야함 - client의 main.js는 base.pug에 의해 모든 페이지에 포함되어있음 - 여기서 문제는 비디오 플레이어를 만들어 보는건데, 비디오 플레이어 코드를 검색화면에 로드하는게 말이 되는지가 중요함   - 별로 좋지 않음 - 다른 자바스크립트 파일을 만들어서 그 놈을 다른 페이지에 포함시킬거임   - 홈페이지에서는 어떤 자바스크립트도 로드하지 않..

image