logo

상태 관리 라이브러리 - Jotai

language-logoJotai
language-logoReactJS
language-logoRecoil

• 상태 관리 툴이 필요한 이유는 많은 컴포넌트들을 뚫고 state를 전달해야 하는 상황에서 props를 추적하기 어려워지기 때문이다. 이를 해결하기 위해 redux, recoil 등의 전역 상태 관리 라이브러리를 사용하여 props drilling을 방지할 수 있다.
• 상태 관리 패턴에는 Flux, Proxy, Atomic 등이 있으며, 각각의 장단점이 있다. Flux는 단방향 데이터 구조로 예측 가능한 상태 관리를 할 수 있지만, 많은 보일러플레이트 코드가 필요하다. Proxy는 store 데이터에 바로 엑세스하여 변경 가능하여 편리하지만, 디버깅이 어렵다. Atomic은 React의 state와 비슷하게 상향식으로 수집 및 공유되는 패턴으로, atom이라는 객체에서 상태를 설정하고, 값의 참조와 조작은 React.useState와 유사하게 수행한다.
• Derived Atom은 다른 atom으로부터 파생된 atom으로, read 함수와 선택적인 write 함수를 전달하여 생성한다. 세 가지 패턴으로 사용할 수 있으며, 이는 Read-Write atom, Read-only atom, Write-only atom이다.
• Atom config는 어디서나 생성할 수 있지만, 참조 동일성이 중요하며, 렌더 함수에서 atom을 생성하려면 useMemo나 useRef를 사용해야 한다. 또한, useAtom은 리액트의 useState와 유사하게 사용 가능하다.

thumbnail
북마크
공유하기
신고하기
12분 분량
조회수 435
profile-image정수현
2년 전
Copyright © 2025. Codenary All Rights Reserved.