사내에서 개발 중인 여러가지 기능 중 이벤트 전파를 중단 시켜야 하는 상황이 생기게 되었다. 한 줄의 코드라도 코드의 대한 명분이 확실해야 한다는 것이 모든 개발자가 생각하는 중요한 것 중 하나이지만, 막상 실무에서 빠르게 자신의 할당량을 채워내기 바쁜 상황이면, 크롬 탭에 새로운 친구( 아.. 좀 이따가 읽어봐야지 하는 개발 관련 글 )를 만드는 현실이다. 이러한 상황들을 조금이라도 무마하기 위해, 또 습득한 지식을 머리 속에 남기기 위해 정리하는 시간을 갖고자 한다. 잘 알고 쓰면 득이 되고, 그렇지 않으면 독이 되는 이벤트 전파와 그에 관련된 기능 stopPropagation, stopImmediatePropagation의 기본적인 설명서에 대한 기록이다. StopPropagation 대부분의 DO..
현재 회사에서 진행중인 프로젝트의 상태 관리는 Recoil이 담당하고 있다. 어떻게 하여 해당 라이브러리를 선택하게 되었는지 간략한 공유 후 Recoil 내부에 있는 함수에 대해서 공유드리는 시간을 가지려고 한다. 하나씩 살펴 보자!! 다른 상태 관리 라이브러리 였다면? 기존에 잘 알려져 있는 상태관리 라이브러리(Redux, Mobx 등)들은 리액트와 공생하고 있다. 상태를 관리하는 문제는 어떤 프로젝트를 하던 항상 대두되는 문제이고, 더 나은 해결책을 찾아나가는 과정속에서 여러 생각들을 하게 된다. 서드파트 라이브러리, 즉 프로그래밍을 도와주는 plug-in 이나 외부의 library들을 가져와 사용을 해야하는 react의 특성상 사이드이펙트는 항상 따라다니던 수식어였다. 상태관리 라이브러리도 마찬가지..
* 이 글은 How are Function Components Different from Classes? 를 번역 및 요약하였습니다. How Are Function Components Different from Classes? They’re a whole different Pokémon. overreacted.io 리액트의 Function Component와 Class Component는 어떻게 다른 걸까? 여기에 대한 통용적인 해답은 Class를 통해 더 많은 기능을 사용할 수 있다는 것이었다. 과거형이기는 하지만, state같은 기능은 함수에서 사용할 수 없었다. 물론 Hook이 탄생하기 전까지 말이다. 그럼 속도가 차이가 날까? 이를 주장하는 벤치마크들이 있긴 하지만, 명분이 부족한 부분은 사실ㄹ이..
* 이 글은 A complete guide to useEffect 를 번역 및 요약하였습니다. A Complete Guide to useEffect Effects are a part of your data flow. overreacted.io 11. 의존성을 솔직하게 적는 방법 (2) - 이펙트가 자급자족 하도록 하자 이펙트의 의존성에 있는 count를 제거해 봅시다. useEffect(() => { const id = setInterval(() => { setCount(count + 1); }, 1000); return () => clearInterval(id); }, [count]); 여기서 생각을 해보죠? 무엇 때문에 deps의 count를 쓰고 있나요? 오직 setCount를 위해 사용하고 있습니..