1. Redux와 MobX와 같은 라이브러리 이다 하지만 엄청 쉽다
2. 클라이언트 state 저장 라이브러리

설치법

npm i zustand # or yarn add zustand //설치법

store 생성

// store.js

import create from 'zustand'
import { devtools } from 'zustand/middleware'

const store = (set) => ({
  bears: 0,
  increasePopulation: () => set(state => ({ bears: state.bears + 1 })),
  removeAllBears: () => set({ bears: 0 })
})

const useStore = create(devtools(store))

export default useStore

store에 생성한 useStore를 불러와서 사용하기

// App.js

import useStore from '../store.js'

const App = () => {
  const { bears, increasePopulation, removeAllBears } = useStore(state => state)
  
  return (
    <>
      <h1>{bears} around here ...</h1>
      <button onClick={increasePopulation}>one up</button>
      <button onClick={removeAllBears}>remove all</button>
    </>
  )
}