리덕스 툴킷 2

[프로젝트] 날씨 칵테일 | 2. 리덕스 툴킷으로 비동기 통신 하는 법 (axios, createAsyncThunk)

리액트 리덕스 툴킷에서 비동기 통신하는 법은 두 가지가 있다: 첫번째는 일반적인 axios(또는 fetch)를 활용하는 것이고, 두번째는 createAsyncThunk를 활용하는 것이다. 본 글에서는 두 가지를 모두 이용하여 그 차이점을 설명하고자 한다. 비동기 통신하기 (1) axios 활용하기 // GetWeather.tsx // 중략... useEffect(() => { const getCurrentWeather = async () => { try { const position = await getLocation(); const { latitude, longitude } = position.coords; const weatherData = await fetchWeatherData(latitude, ..

[Redux-Toolkit] Redux와 Redux Toolkit 사용법 비교하기

항상 헷갈렸던 react-redux를 이번 기회에 복습해보았다. 대세로 자리잡은 react-redux-toolkit과 toolkit을 사용하지 않은 버전은 어떻게 다른지 비교해보고자 한다. 내용은 생화코딩 강좌의 리덕스편을 참고하였다. [리덕스란?] 리덕스는 리액트와 가장 많이 사용되지만, 사실 자바스크립트 기반이기만 하면 사용할 수 있는 상태관리 라이브러리이다. 상태는 오로지 읽을 수만 있고, 상태를 변경하기 위해서는 액션(action)을 발생시켜야 한다. [리덕스 툴킷이란?] 리덕스 툴킷은 리덕스에서 공식적으로 추천하는 helper 라이브러리이다. redux-devtools, redux-thunk 등의 라이브러리가 미리 포함되어 있다. 먼저 코드로 다른점을 파악해보자. [1. React-Redux] ..

React/react-redux 2023.09.20
728x90
LIST