프로젝트/수튜브 : 유튜브 클론코딩

    210718 [수튜브] - 브라우저의 저장소

    학습 시간 약 3시간 To Do 아래 이슈를 해결 학습 내용 수튜브에서 사용자가 같은 광고를 중복 시청하지 않도록 방지하기 위해, localStorage를 사용하고 있습니다. 이번 학습시간에는 localStorage에 대한 이해를 높이기 위해 sessionStorage, cookie와 비교해보겠습니다. 그리고 브라우저별 실제 저장 위치와, 각 도메인별 저장용량 및 위치가 구체적으로 어떻게 되는지 알아보겠습니다. | 브라우저의 저장소 localStorage sessionStorage cookie 공통 - 데이터를 문자열 형태로 저장 (객체를 저장하고 싶다면 JSON 또는 store.js 활용) - key & value로 이루어짐 - same-origin policy에 따라, 도메인별로 다르게 관리 특징 -..

    210710 [수튜브] - 이슈트래킹 + 커스텀 컨트롤러 리팩토링

    학습 시간 약 7시간 To Do 이슈트래커 설정 및 Issue와 PR 템플릿 작성 아래 이슈를 해결 학습 내용 제가 개발하고 있는 커스텀 컨트롤러는 전체 controls영역(보라색)과 그 내부에 위치한 버튼 영역(연두색)의 클릭 이벤트를 구분해야 합니다. 전체 영역(보라색) : video 화면 위에 controls를 보여주거나 숨김 각 버튼 영역(연두색) : 해당 버튼의 기능 수행 각 클릭 이벤트를 구분해야 하지만, 모든 버튼이 전체 controls 영역 내부에 위치하기 때문에 코드가 복잡하고, 조금만 수정해도 동작이 꼬이는 문제가 있었습니다. 이벤트 위임을 적용한 코드 controls.addEventListener('click', function(e) { // ...생략 let target = e.ta..