100일은 해야지

🤔 Redux 미들웨어란? 👉 Redux 애플리케이션에서 액션과 리듀서 사이에서 동작하는 중간 소프트웨어이다. 👉 Redux 미들웨어는 Redux의 동작을 확장하고 액션 디스패치 과정을 가로채서 추가적인 작업을 수행할 수 있다. 🤔 Redux 미들웨어를 사용해서 수행할 수 있는 작업?? 👉 Redux Thunk 나 Redux Saga와 같은 미들웨어를 사용해서 비동기 작업을 관리할 수 있다. 👉 액션과 상태 변경을 로깅하고 디버깅 정보를 수집할 수 있다. 👉 액션을 가로채서 수정하거나 다른 액션으로 대체할 수 있다. 👉 특정 조건이 충족되었을 때만 액션을 디스패치 할 수 있다. 👉 리액트 라우터와 통합하여 라우팅 관련 작업을 처리할 수 있다. 👊 Redux 미들웨어 사용해보기 1. 리덕스 미들웨어를 만들..

일단 할 일 목록을 만들기 전에 count랑 같은 레포에 넣을 것이기 때문에, counter를 누르면 counter가 나오고 todolist를 누르면 ToDoList가 나오도록 UI를 바꿔줬다. 👊 Todo-List 만들기 1. 액션 타입, 액션 생성자 함수, 리듀서 설정 src/modules/todo.js 2. 루트 리듀서 만들기 한 프로젝트에 여러 개의 리듀서가 있을 때 한 리듀서로 합쳐서 사용한다. 이를 루트 리듀서라고 부른다. 나는 counter와 todos 두 개의 리듀서가 있다. 고로 합쳐야 한다. 리듀서를 합치는 것은 리덕스 내장 함수인 combineReducers를 사용한다. 👉🏻 'modules' 폴더에 index.js 파일을 생성한다. src/modules/index.js 👉🏻 'src..

Redux는 Context API가 개선되기 전에 프로젝트에서 글로벌 상태 관리 용도로 많이 사용되어 왔지만, 요즘에는 글로벌 상태 관리 용도로 사용할 것이라면 Context API와 useReducer Hook으로 충분히 가능하다고 한다. 리덕스는 프로젝트가 크고, 성능을 최적화하거나 개발자의 경험과 선호도에 따라서 사용한다고 하는데... 일단 상태관리 도구에 대해서 배우고, Redux, Recoil, Context API에서 더 정감이 가는 걸 더 공부해 보려 한다. 🤙 리덕스 규칙 단일 스토어 (Single Store) : Redux 애플리케이션은 하나의 중앙 스토어만 사용해야 한다. 이 스토어에 애플리케이션의 모든 상태가 중앙 집중식으로 저장된다. 읽기 전용 상태 (Read-Only State) ..

😳 Redux란? 👉 Redux는 "action(액션)"이라는 이벤트를 사용하여 애플리케이션 상태를 관리하고 업데이트하는 패턴과 라이브러리이다. 👉 전체 애플리케이션 내에서 사용해야 하는 상태에 대한 중앙 저장소 역할을 하며, 상태 업데이트를 예측 가능한 방식으로 제어한다. 😳 왜 Redux를 사용하는 것일까? 👉 중앙화된 상태 관리 : 리덕스는 애플리케이션의 상태를 중앙에서 효율적으로 관리할 수 있는 중앙 저장소를 제공하기 때문에 상태를 한 곳에서 관리하고 업데이트하는 것이 쉬워진다. 👉 예측 가능한 상태 업데이트 : 리덕스는 순수 함수인 리듀서를 사용하여 상태를 업데이트하므로 상태 변경이 예측 가능하며, 어떻게 변화하는지 이해하기 쉽다. 👉 디버깅 : time-travel 디버깅 기능을 활용하면 이전..