atomicdev 님의 블로그

Redux Toolkit을 사용한 성능 최적화Redux Toolkit을 사용하여 복잡한 설정 과정을 간소화하고, 각 기능을 사용하여 성능을 최적화하는 방법을 알아보겠습니다. 이번 포스팅에서는 React 애플리케이션 생성부터 실행까지의 세부 과정과 파일 구조를 함께 설명하겠습니다.1. React 애플리케이션 생성 및 Redux Toolkit 설치먼저 Redux Toolkit을 사용할 애플리케이션을 생성합니다.npx create-react-app my-redux-toolkit-appcd my-redux-toolkit-appnpm install @reduxjs/toolkit react-redux2. 전체 파일 구조애플리케이션의 전체 파일 구조는 다음과 같습니다:my-redux-toolkit-app/├── sr..

Redux Toolkit의 createAsyncThunk를 사용한 비동기 처리와 미들웨어 간소화이번 포스팅에서는 Redux Toolkit의 createAsyncThunk를 사용하여 비동기 처리를 간소화하고, 미들웨어 설정을 어떻게 개선할 수 있는지를 Before -> After 형식으로 설명하겠습니다. createAsyncThunk는 비동기 작업을 위한 간편한 방법을 제공하여 코드의 복잡성을 줄이고 유지보수를 쉽게 만듭니다.1. 비동기 처리를 위한 미들웨어 사용의 필요성Redux에서 비동기 작업(예: API 호출)을 처리하기 위해서는 미들웨어가 필요합니다. 기존 Redux 방식에서는 Redux Thunk나 Redux Saga와 같은 미들웨어를 설정해야 하며, 이는 코드의 복잡성을 증가시키는 원인이 됩니다..