본문 바로가기

Project/React.js

React Jotai

 

npm install jotai

 

Jotai 특징

Redux는 reducer 당 하나씩 state 만듬, state여러개가 필요하면 reducer를 여러개 만들어서 결합해야 함.

 

Jotai는 atom 사용(reducer 대신 atom 사용), 필요한 state를 원자(atom)단위로 만들어서 사용

atom으로 생성, useAtom 사용

useState와 유사, 컴포넌트 간에 공유됨

 

Jotai가 Redux보다 훨씬 직관적이고 간단하다.

 

state 변수가

atom을 사용하면 기본적인 스토리지에 생성되고,

atomWithStorage를 사용하면 세션 스토리지에 저장된다.

 

선언한 state변수를 import하고, useAtom으로 사용하면 된다.

useAtom은 상태 변수와 상태 변수를 변경할 수 있는 함수를 리턴한다.

 

아래와 같이 객체의 초기값을 설정하고 선언할 수 있다.

 

Redux의 useSelector 대신 useAtom을 사용하여 로그인 시 user객체를 세션 스토리지에 저장할 수 있다.

 

 

 

'Project > React.js' 카테고리의 다른 글

React Hook/React Redux  (1) 2024.11.04
React.js  (0) 2024.10.28