#readability

리액트에서 리스트를 렌더링하다 보면 손이 먼저 움직이는 순간이 있다. 한 아이템에서 여러 요소를 반환해야 하니 일단 <>...</>로 감싼다. items.map((item) => ( <> <span>{item.title}</span> <span>{item.description}</spa…

Zustand로 스토어를 만들다 보면 처음에는 코드가 꽤 단정해 보인다. 상태 타입을 만들고, create()에 생성 함수를 넘기고, 필요한 미들웨어를 하나씩 감싸면 된다. persist를 붙이면 새로고침 뒤에도 값이 남고, devtools를 붙이면 Redux DevTools에서 변경을…

React를 사용하면서 useEffect 안에서 상태를 참조할 때 의외로 자주 겪는 문제가 있다. 바로 stale closure 문제다. 예를 들어 어떤 값이 변경되었는데, useEffect 내부의 콜백에서는 여전히 이전 값을 읽고 있는 현상이다. 이는 React의 클로저 구조상 자연스…

자바스크립트는 객체 지향 프로그래밍을 지원하기 위해 지속적으로 언어 기능을 확장해왔다. class 문법의 도입, private field(#)의 추가는 그 대표적인 예다. 특히 #을 이용한 프라이빗 멤버는 기존의 관례적 약속(예: _private)과 달리, 언어 차원에서 접근을 차단한다…

언젠가 동생이 내게 이런 질문을 한 적이 있다. “형은 어떨 때 type을 쓰고 어떨 때 interface를 써?” 당시의 나는 대부분의 경우 type을 쓴다고 대답했다. 선언 병합을 제외하면 interface가 제공하는 기능적 이점을 크게 느끼지 못했기 때문이다. 실제로 타입스크립트에…

이 포스트는 Timotius Sitorus가 자신의 dev.to 블로그에 올린 Stop using Array[index], use Array.at() instead 게시글을 번역한 것이다. 번역하는 과정에서 다소 의역이 있을 수 있으며, 일부 번역에는 사견이 포함되어있기도 하다. Arr…