리액트

* 이 글은 React useEffect: 4 Tips Every Developer Should know 번역하였습니다. useEffect: 4 Tips Every Developer Should Know Check out these 4 tips that will save your code. Use useEffect with React Hooks correctly by avoiding these common pitfalls. medium.com React hooks에 useEffect의 대하여 이야기해볼까요. 절대로 잊어버리면 안 될 4가지 팁을 공유드립니다. Use a useEffect for a SIngle purpose React Hook을 사용할 때 복수의 useEffect 함수를 사용할 수 있습니..

* 이 글은 Iceberg of React Hooks 번역하였습니다. The Iceberg of React Hooks React Hooks, unlike Class Components, provide low-level building blocks for optimizing and composing applications with minimal boilerplate. medium.com Class Component와는 달리 React Hooks은 application을 최소한의 보일러플레트로 구성 및 최적화하기 위해 low-level 빌딩 블럭을 제공합니다. 깊이있는 지식없이는 미묘한 버그나 추상화로 인해 성능 문제가 발생할 수 있고 코드 복잡성이 높아집니다. 저는 공통적인 문제를 증명하고 그것들을 고치기..

현재 회사에서 진행중인 프로젝트의 상태 관리는 Recoil이 담당하고 있다. 어떻게 하여 해당 라이브러리를 선택하게 되었는지 간략한 공유 후 Recoil 내부에 있는 함수에 대해서 공유드리는 시간을 가지려고 한다. 하나씩 살펴 보자!! 다른 상태 관리 라이브러리 였다면? 기존에 잘 알려져 있는 상태관리 라이브러리(Redux, Mobx 등)들은 리액트와 공생하고 있다. 상태를 관리하는 문제는 어떤 프로젝트를 하던 항상 대두되는 문제이고, 더 나은 해결책을 찾아나가는 과정속에서 여러 생각들을 하게 된다. 서드파트 라이브러리, 즉 프로그래밍을 도와주는 plug-in 이나 외부의 library들을 가져와 사용을 해야하는 react의 특성상 사이드이펙트는 항상 따라다니던 수식어였다. 상태관리 라이브러리도 마찬가지..

* 이 글은 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를 위해 사용하고 있습니..