느릿늘있

Q1. 과제  이번주 과제의 주제는 React Hooks 였습니다. 회사에서 class 기반으로 개발을 하다보니(Angular) hook을 쓸 일이 없었는데 이번에 확실하게 개념을 잡을 수 있었습니다. hook도 그 근본은 class이다보니 이해하는 데 큰 어려움은 없었습니다. 그래서인지 심화 과제도 hook 그 자체보다는 메모이제이션과 관심사 분리가 주된 내용이었습니다.Q2. 시도  가장 기억에 남는 시도는 useRef를 useState로 구현하는 부분이었습니다.Q3. 문제점  머리 속에 useRef는 리랜더링 되지 않는 값, useState는 리랜더링이 필요한 값이라고 주입식으로 외우다 보니 useRef를 useState를 써서 구현하라는 요구 사항이 처음에는 이해가 되지를 않았습니다. 그러나 잘 생..

Q1. 과제  이번주 과제는 Virtual DOM을 직접 구현해보는 것이었습니다. 전체적인 구조는 잡혀 있는 상태로 미션이 주어졌고 내부 구조를 구현하는 방식이었습니다. 처음에는 이번주에 휴일도 이틀이나 있으니 여유로운 마음으로 시작했는데 AI의 도움이 없었더라면 완성하지 못했을 것 같다는 생각이 들 정도로 구현해야 하는 양도 많고 생각할 거리들이 많았던 것 같습니다.Q2. 시도  Virtual DOM을 직접 구현해 볼 거라고는 생각해본 적도 없었기에 처음에는 감조차 잡히지 않았습니다. 요구 사항에 따라 하나씩 구현을 해 나가다 보니 점점 모습이 갖춰지는 게 재미있었던 것 같습니다.ㅎㅎ 특히 DOM Element를 vNode로 만들어서 비교하고 변경점들을 다시 DOM Element에 주입하는 작업이 어려..

Q1. 과제  이번주 과제는 SPA를 Vanilla JS로 구현하는 것이었다. 이번 주 과제를 진행하면서 마주한 문제들 중 가장 기억에 남는 두 가지를 뽑자면 구조 설계와 클릭 이벤트 처리였다.Q2. 시도  1. 구조 설계시작할 때, 프로젝트 구조를 main -> router -> 각 component 구조로 구성하면 되겠다라고 생각했고 각각의 역할을 아래와 같이 부여했다.1. main : 프로젝트 진입점, router에 현재 url path를 전달하여 컴포넌트를 실행함2. router : 전달받은 path를 기준으로 각 컴포넌트를 실행함3. component : 화면을 그림  2. 클릭 이벤트 처리버튼이면 버튼, a태그면 a태그를 querySelector로 잡아서 addEventListener clic..