frontend

갈수록 세분화되고 다양화되면서 복잡도가 높아지고 있는 FE 생태계입니다. 새삼스럽죠. 저는 가급적이면 뭐 하나라도 디펜던시를 줄이려는 편입니다. 가급적 표준안에서 변화하지 않는 영역을 더 늘리려고 하죠. 자바스크립트 애니메이션도 그렇습니다. 공개된 오픈소스들을 이용하면 DOM상에서 복잡하고 나이스 한 움직임을 만들어낼 수 있습니다. 하지만 이렇게까지 애니메...

이벤트 핸들러는 UI를 개발할 때면 항상 사용된다. 웹뿐만 아니라 네이티브 어플리케이션에서도 약간의 차이가 있을뿐 거의 동일한 추상이 사용된다. 자주 사용되는 만큼 중요하지만 사실 너무 자주 사용되다 보니 가볍게 생각하며 습관적으로 고민 없이 좋지 않은 코드를 만들곤 한다. 자주 사용된다는 건 코드의 양적인 비중도 크다는 것이고 그만큼 조금만 더 신경 쓴다...

페이지 가시성 API(Page Visibility API)는 이름에서 짐작할 수 있듯 페이지가 현재 유저에게 보이고 있는지 아닌지를 알 수 있게 해주는 API입니다. 정확히 말하면 모니터상에서 보여질 수 있는 상황인지 아닌지겠네요. 유저가 눈을 감거나 다른 곳을 보고 있으면 알 방법이 없으니까요 :) 예전엔 onblur와 onfocus 이벤트를 사용했었는데...

세션스토리지(sessionStorage), 로컬스토리지(localStorage)로 구성된 웹 스토리지는 이제 너무 익숙합니다. 다루기 힘들었던 쿠키와는 다르게 클라이언트 저장소로 사용 용도를 명확히 하고 더 나은 사용성으로 이미 우리의 친구가 됐죠. 프론트엔드 개발자가 자주 다루는 로컬 스토리지는 이런 것들을 할 수 있습니다. storage.length...

프론트엔드 프로젝트를 시작할 때마다 매번 정해야 하는 것들이 있습니다. 개발 환경과 개발 스택을 정하고 대부분 Git이겠지만 형상관리 도구도 정하고 브랜치를 어떻게 관리할지도 정해야 하고 버저닝은 어떻게 해야 할지 등등 프로젝트를 새로 시작할 때면 매번 점검하거나 새롭게 정해야 할 것들이 많았어요. 물론 이미 오랜 기간 숙련된 팀의 경우 기존의 방식을 활용...