Node Package Manager 지난주 수요일에 AWS FE 세미나를 다녀왔습니다. Next.js와 StoryBook과 관련된 1시간 30분 간의 난상토론이었는데 토론이 막바지에 다다를 때쯤 Package Manager에 관련된 이야기가 나왔습니다. yarn berry에 관련된 이야기를 하다가 다른 분께서 Phantom Dependency를 해결해주긴 하지만 Git에 yarn berry 모듈을 모두 올리면 다운로드하는데 모두 리소스다. 최대로 Git에서 지원해 주는 용량도 한계가 존재한다. 그래서 pnpm을 더 많이 쓴다. 현재 제가 가장 많이 쓰고 있는 것은 yarn v1입니다. 다른 패키지 매니저도 다 사용을 해보았지만 yarn berry : git에 용량 제한이 걸림 pnpm : react n..

이번 포스트에서는 저번 포스트에서 Json에 대해 알아보았으니 이번에는 AST 추상 구문 트리와 nearly.js를 이용한 Json Parser를 만들어보는 것을 다뤄보도록 하겠습니다. https://ww8007-learn.tistory.com/13 [1] Json에 대해서 알아보기 - 기초 웹 개발을 하다 보면 Json을 수도 없이 마주치게 되는데요 요번 글에서는 Json에 대해서 좀 더 깊이 알아보고 이를 파싱할 수 있는 Parser까지 만들어보는 포스트를 1, 2 편에 나눠서 다뤄보려고 합니 ww8007-learn.tistory.com parser를 만들기 위한 첫 번째 관문 : AST - 추상 구문 트리 AST가 뭘까요? 위키백과에 따르면 다음과 같습니다. 컴퓨터 과학에서 추상 구문 트리 (abs..

Intersection Observer란? 일단 MDN의 설명을 보면 다음과 같다는 것을 알 수 있습니다. 대상 요소와 상위 요소, 또는 대상 요소와 최상위 문서의 뷰포트가 서로 교차하는 영역이 달라지는 경우 이를 비동기적으로 감지할 수 있는 수단을 제공함 이게 무슨 말 인가요? 쉽게 말해서 Element가 뷰포트에 보이는지? 보이지 않는지에 따라서 이를 감지할 수 있는 수단을 제공한다는 것을 의미합니다. 아래와 그림과 같이 현재 뷰포트에 보이는 Element는 3개가 존재하죠. 만약 3째의 Element가 등장할 때 어떤 이벤트를 실행 하고 싶다면 어떻게 할까요? 이럴 때 저희는 Intersection Observer를 사용하면 됩니다. 윈도우 scroll을 지원하는데 이걸 굳이 사용해야 하나요? 스크..