React에 Redux 대신 Effector를 써보자!
React에 Redux 대신 Effector를 써보자! " Effector "가 react-material-ui-datatable에서 사용되는 것을 보고, 이것은 무엇일까 싶어서, 한번 훌터봤다. 개인적인 소감으로는 Redux보다 훨씬 직관적이고, 코드(파일 구성 및 코드 생성)가 간결했다. 우선, Redux로 counter 예제를 구현했다. 같은 코드를 Effector로 구현했다. 동작 상황을 확인하기 위해, Redux에는 reducer에 console 로 log를 출력했다. 대신, Effector에는 "watch"를 이용하여 출력했다. 이부분도 훨씬 간결하다. (혹시, Redux 출력이 잘못이라면, 지적 부탁한다.) 코드를 보자면, "event 생성 -> store 생성, 필요하면 watch -> component에 event 등록"으로 이뤄져 있고, Redux 대비, 파일의 분화, store의 추적 등이 용이합니다. import React from "react" ; import { createEvent , createStore } from "effector" ; import { useStore } from "effector-react" ; const increment = createEvent ( "increment" ); const decrement = createEvent ( "decrement" ); const resetCount = createEvent ( "reset count" ); const counter = createStore ( 0 ) . on (increment, count => count + 1 ) . on (decre