# redux saga

React Redux middleware
소프트웨어 공학에서 미들웨어란 운영체제와 응용 소프트웨어 중간에서 조정과 중개의 역할을 수행하는 소프트웨어를 말한다.리덕스 미들웨어는 액션을 디스패치 했을 때 리듀서에서 이를 처리하기에 앞서 사전에 지정된 작업을 실행한다. 미들웨어는 액션과 리듀서 사이의 중간자라고 볼

[TIL] 2023/10/04
: 생각해보면, 진지하게 고민해본적은 없다. redux 아키텍처를 만들면서 보일러 플레이트 코드라고 생각하고 쳤던 것들 중에 리듀서가 있었고, 그 역할에 대해선 이해를 하고 있었지만(특정 액션을 바탕으로 state를 어떻게 변화시킬지를 정의해놓고, 이를 통해 새로운 하
React + Redux + Redux-Saga + Typescript - 로그인 구현 및 로그인 유지 (Feat JWT Token, Cookie)
로그인하면 아마 가장 먼저 token이 떠오를 것이다. 현재 token은 사용자를 식별하는데 중요한 요소로 많은 곳에서 이용되고 있다.오늘은 실제로 프로젝트에서 로그인 기능을 구현하면서 token을 어떻게 사용했는지 즉, 서버로부터 받아온 token을 어떻게 cooki
Redux Saga란 무엇인가요?
Redux Saga는 Redux와 함께 사용되는 미들웨어 라이브러리입니다. Redux Saga를 사용하면 애플리케이션의 비동기 작업, 즉 데이터 가져오기, 서버 요청 처리, WebSocket 연결 등을 보다 간편하고 효율적으로 관리할 수 있습니다.Redux Saga는
Generator 문법
이 문법의 핵심 기능은 함수를 작성 할 때 함수를 특정 구간에 멈춰놓을 수도 있고, 원할 떄 다시 돌아가게 할 수도 있다. 그리고 결과값을 여러번 반환 할 수도 있다. 이 경우에는 무조건 1만 반환하게 될 것이다. 하지만, 제너레이터 함수를 사용하면 함수에서 값을
Redux-saga
delay , call , put , all , takeEvery, takeLatest설정된 시간 이후에 resolve하는 Promise 객체를 리턴한다.\-> 1초 기다리기특정 액션을 dispatch 하도록 한다.\-> INCREMENT action을 dispatc
redux-saga api call delay 해서 가져오는 방법
api를 call 했는데 부르는 시간이 길 때 처리 방법 문제점 api call로 불러올 때 해당 데이터 형태의 빈값이 할당됨 원인 파악

[React] Redux Saga
Thunk 와의 차이Redux Thunk함수를 dispatch 할 수 있게 해주는 미들웨어Redux Saga액션을 모니터링 하고 있다가 특정 액션이 발생했을 때, 미리 정해둔 로직에 따라 특정 작업이 이루어지는 방식Thunk의 단점redux-thunk는 복잡한 비동기
Redux - redux saga
Redux 미들웨어(Middleware)의 일종으로, 비동기 작업을 처리하기 위한 라이브러리이다. Redux Thunk와 마찬가지로 Redux 액션 객체 내에서 비동기 작업을 처리할 수 있다.제너레이터(generator)를 이용하여 비동기 작업을 처리하기 때문에, 비동

Redux-saga 소스 리펙토링
특정 데이터를 api를 call 하는 제네레이터를 사용하여 데이터를 불러오는 작업을 진행하는 데 요청사항으로 특정 url들을 base64로 인코딩을 해줘야 한다.하지만 여기서 해당 이미지들의 url들이 우리 서버에 위치하지 않기 때문에 api를 활용하여 수정하는 작업을

[Redux-saga, JS]_TodoList
일단 여러 에러들을 확인했고, toggle에 대한 saga와 reducer를 작성하지 않았기 때문에 발생했던 것들이 대부분이었다.체크박스를 클릭해도, db에서는 바뀌지 않는다. \-> (toggle reducer, toggle saga 가 없었음)수정할 때, compl

[React] Redux - 비동기 처리 (saga, thunk)
말머리 Notification(알림) 기능을 만들면서 접하게된 이슈와 해결 한 방법을 정리한다. 비동기 처리 상황은 아래와 같다. > 게시글에 댓글 달림 게시글의 작성자에게 알림 보냄 (이건 실시간이 필요 없다 생각해서 DB Table로 만듬) 알림 확인 및 알림 제
Redux(리덕스),Redux-saga
JavaScript 상태관리 라이브러리데이터를 한곳에 집합시켜 데이터 사용 및 관리를 편리하게 만드는 라이브러리폴더 구조를 짜게되면 수많은 컴포넌트들이 존재하는데 여기서 내가 필요한 데이터를 빠르고, 쉽게 꺼내 쓸수 있기 때문이다.쉽게 말하자면 컴포넌트 관리를 내부에서

Weather🌤️ 프로젝트(with react, redux, node.js) 후기
공공 데이터를 활용해 날씨 정보를 알려주는 웹사이트를 만든 weather 프로젝트 후기

Next.js 실행해보기, page와 공통 layout 만들기, eslint와 prettier 사용하기
react의 동작원리는 브라우저가 front server에서 html,js 파일을 최초로 1회만 받아오고, 이후 페이지 요청 시 backend sever에서 직접 data를 받아온다. → CSR(SPA) 방식하지만 웹서비스에 필요한 모든 정적 리소스를 한 번에 다 다운
Redux-saga VS React-query
Reduxredux는 상태관리 라이브러리다. 비동기처리목적이 아니기 때문에 redux-saga ,redux-thunk 등 미들웨어를 사용해야한다.비동기 처리시 상태관리(isLoading, error, success)상황을 관리해야한다.React-query상태관리를 기본