타입스크립트를 사용하는 Next.js 프로젝트에서 특정 라이브러리를 사용할 때 한 가지 오류가 발생했습니다.아래와 같이 props에서 변수를 할당하려고 했습니다.const { children, className, node ...rest } = props;그런데 ref를 할당하지 않으면 오류가 발생했습니다. 정확한 이유는 알 수 없었지만, ref를 포함하니 오류가 사라졌습니다.그러나 빌드 시점에서 ref와 node가 실제로 사용되지 않기 때문에 ESLint의 no-unused-vars 규칙에 걸려 빌드가 실패했습니다. 이 문제를 해결하기 위해, // eslint-disable-next-line @typescript-eslint/no-unused-vars 주석을 추가하여 특정 줄에서만 no-unused-va..

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Date Date - JavaScript | MDNJavaScript Date 객체는 시간의 한 점을 플랫폼에 종속되지 않는 형태로 나타냅니다. Date 객체는 1970년 1월 1일 UTC(협정 세계시) 자정과의 시간 차이를 밀리초로 나타내는 정수 값을 담습니다.developer.mozilla.org여러 개의 개인 프로젝트를 진행하면서 Date 객체를 자주 사용하였습니다.자주 쓰이는 만큼, 이번 기회에 Date 객체를 정리하고, 이를 활용해 구현한 메서드들도 함께 정리해보려 합니다.Date 객체란?Date 객체는 자바스크립트에서 날짜와 시간을 표현하기 위한 기본 객체..

https://developer.mozilla.org/en-US/docs/Web/API/Geolocation_API Geolocation API - Web APIs | MDNThe Geolocation API allows the user to provide their location to web applications if they so desire. For privacy reasons, the user is asked for permission to report location information.developer.mozilla.org1. Geolocation API란?Geolocation API는 웹사이트가 사용자의 기기에서 위치 정보를 요청할 수 있도록 해주는 기능입니다.위치 정보는 사용자의 허락..

https://developer.mozilla.org/ko/docs/Web/API/IntersectionObserver IntersectionObserver - Web API | MDNIntersection Observer API의 IntersectionObserver 인터페이스는 대상 요소와 상위 요소, 또는 대상 요소와 최상위 문서의 뷰포트가 서로 교차하는 영역이 달라지는 경우 이를 비동기적으로 감지할 수 있는developer.mozilla.org1. IntersectionObserver란?IntersectionObserver는 웹 API로, 특정 요소가 뷰포트(화면 영역) 안에 들어오거나 나가는 시점을 감지하고, 이에 따라 콜백 함수를 실행할 수 있는 기능을 제공합니다.무한 스크롤, 레이지 로딩, ..

쿠키 설정하기function setCookie(cookieName, value, exdays, domain, secureBool) { const exdate = new Date(); exdate.setDate(exdate.getDate() + exdays); let cookieValue = encodeURIComponent(value) + "; path=/;"; if (exdays) { cookieValue += " expires=" + exdate.toUTCString() + ";"; } if (domain) { cookieValue += " domain=" + domain + ";"; } if (secureBool === tr..

https://hy-un.tistory.com/entry/HTMLCSS-Video-Controls-%EC%BB%A4%EC%8A%A4%ED%85%80%ED%95%98%EA%B8%B0-1 [HTML/CSS] Video Controls 커스텀하기 - 1태그에서 제공하는 기본 컨트롤 디자인 대신, 다른 디자인을 적용하고 싶었습니다.하지만 HTML5 에서는 이러한 커스텀 디자인을 기본적으로 지원하지 않기 때문에, 기본 컨트롤을 숨기고 HTML과 CShy-un.tistory.com이전 글에 이어, 이번에는 HTML과 CSS로 커스텀한 비디오 컨트롤에 JavaScript를 사용하여 기능을 입히려고 합니다.완성 페이지는 아래 링크에서 확인할 수 있습니다.https://ganghyun95.github.io/video-c..