Featured image of post [Redux] 20. 실습: RTK로 앱 리팩터링

[Redux] 20. 실습: RTK로 앱 리팩터링

15편의 순수 Redux Counter/Todo 앱을 createSlice·configureStore·createAsyncThunk로 완전히 다시 작성합니다. 코드량 비교와 함께 Phase 4를 마무리하는 종합 실습입니다.

Featured image of post [Redux] 21. Redux 미들웨어의 이해

[Redux] 21. Redux 미들웨어의 이해

09편에서 간단히 본 미들웨어의 next(action) 체인 구조를 직접 손으로 만든 로깅·타이밍 미들웨어로 분해합니다. 미들웨어가 왜 Thunk·Saga·RTK Query 같은 비동기 도구의 공통 기반인지 설명합니다.

Featured image of post [Redux] 22. Redux Thunk - 가장 간단한 비동기 처리

[Redux] 22. Redux Thunk - 가장 간단한 비동기 처리

21편의 미들웨어 구조 위에서 redux-thunk가 정확히 무엇을 하는지 직접 구현해봅니다. thunk 함수가 action 대신 dispatch되는 원리, getState로 조건부 dispatch하는 패턴, extraArgument로 API 클라이언트를 주입하는 방법을 다룹니다.

Featured image of post [Redux] 23. Redux Saga - 강력한 사이드 이펙트 관리

[Redux] 23. Redux Saga - 강력한 사이드 이펙트 관리

제너레이터 함수와 yield로 사이드 이펙트를 선언적으로 기술하는 Redux Saga를 다룹니다. take·call·put·select 기본 이펙트와, all·race·fork·cancel로 동시 실행·경쟁·백그라운드 취소를 구현하는 방법을 코드로 다룹니다.

Featured image of post [Redux] 24. RTK Query - 데이터 페칭의 혁명

[Redux] 24. RTK Query - 데이터 페칭의 혁명

10편에서 언급한 서버 상태 전용 도구의 필요성을 RTK Query로 해결합니다. createApi로 캐싱·자동 재요청·뮤테이션을 다루고, keepUnusedDataFor·skip·useLazyQuery, React Query/SWR과의 관계까지 다룹니다.

Featured image of post [Redux] 25. 실습: RTK Query로 블로그 앱 만들기

[Redux] 25. 실습: RTK Query로 블로그 앱 만들기

게시글 목록·상세·댓글·좋아요 기능을 가진 블로그 앱을 RTK Query로 구현합니다. 세밀한 캐시 태그 설계, 낙관적 업데이트(optimistic update)까지 다루며 Phase 5를 마무리하는 종합 실습입니다.

Featured image of post [Redux] 26. Redux 프로젝트 구조 - 확장 가능한 설계

[Redux] 26. Redux 프로젝트 구조 - 확장 가능한 설계

15·20·25편에서 계속 써온 feature 폴더 구조가 왜 옳은 선택인지 근거를 정리하고, 파일 타입별 구조와의 비교, 배럴 파일의 함정, 공용 로직을 위한 app/shared 계층 분리 방법까지 자세히 다룹니다.

Featured image of post [Redux] 27. 정규화(Normalization) - 복잡한 데이터 관리

[Redux] 27. 정규화(Normalization) - 복잡한 데이터 관리

중첩된 게시글·댓글·작성자 데이터를 배열 그대로 저장할 때 생기는 중복 업데이트 문제를, ID를 키로 쓰는 정규화된 상태 구조와 createEntityAdapter로 해결합니다. selectId·sortComparer로 기본 동작을 바꾸는 법도 다룹니다.

Featured image of post [Redux] 28. Redux와 TypeScript - 타입 안전한 상태 관리

[Redux] 28. Redux와 TypeScript - 타입 안전한 상태 관리

05편의 TypeScript 기초를 Redux에 적용해 RootState·AppDispatch 타입을 추출하고, 타입 지정된 useSelector/useDispatch 훅, createSlice의 PayloadAction, createAsyncThunk의 rejectValue 타입까지 다룹니다.

Featured image of post [Redux] 29. Redux 성능 최적화와 디버깅 심화

[Redux] 29. Redux 성능 최적화와 디버깅 심화

13편의 컴포넌트 최적화를 넘어, Redux DevTools의 액션 필터·상태 diff·시간 여행 디버깅을 실전 워크플로로 정리합니다. 대규모 상태에서 리듀서 자체가 병목이 되는 경우와 그 진단법, 프로덕션 디버깅 전략까지 다룹니다.