# Saga

darcyu83

/\* all(함수,함수들) : 함수들을 동시에 실행한다. fork(함수) : 비동기 함수를 실행한다.(non-blocking) call(api 함수) : 동기 함수 호출 (blocking) (asynchronous -> synchronous) take : 1회성 동작

taek_jini

쿼리스트링을 통해 데이터를 보낸다.현재 스크롤을 내리면 같은 게시글을 계속 불러오는 버그가 있습니다. 여러 방법 중 lastId 방식으로 이 문제를 해결하는데, 먼저 mainPosts의 마지막(첫번째) 게시글의 id를 찾아서 이걸 lastId로 데이터를 전달해줍니다.

taek_jini

encType="multipart/form-data" 이미지를 올리게되면 multipart 라는 form-data로 데이터가 전송이 되게 됩니다. 하지만, 지금의 백엔드에서는 json 형식과 이미지나 비디오 같은 데이터를 받을 수 없는 일반적인 Form 데이터만 받을

taek_jini

데이터의 흐름을 기억하면서 코드를 작성하는 것이 좋습니다.dispatch한 postCard.js → 리듀서 → 사가 →백엔드 라우터순으로 작성하면 됩니다. axios.patch(/post/${data}/like, data) 로 data를 2번쓰게 되면 불필요한 용량

taek_jini

게시글을 불러오기 위해 posts.js를 만들어 줍니다. findAll로 여러개의 항목을 DB에서 찾아올 수 있습니다. 시퀄라이즈의 find 메소드는 SELECT 쿼리문으로 이해하면 됩니다.findOne : 특정된 하나의 레코드만 찾는다findAll: 모든 레코드를

taek_jini

데이터가 어떻게 이동하는지 잘봐야 됩니다. 그래야 코드를 짤 때 수월하게 할 수 있습니다. PostForm에서 Submit → dispatch({ addPost(text) })reducers/addPost의 data로 text 데이터를 받음sagas/addPost로

taek_jini

Redux-middleware 리덕에 없던

0715yk

Despite its simplicity, thunks have limitations. One of the most cited limitations is the inability to run code in response to dispatched actions or s

0715yk

: 흔히 redux의 비동기 처리 로직 혹은 사이드 이펙트를 처리하기 위한 용도로 redux-thunk나 redux-saga를 많이 사용한다. 이번 포스팅에서는 앞서 말한 redux와 연관되는 라이브러리가 필요한 이유부터 시작해서 각 라이브러리의 장단점을 가지고 서로를

jrl103

오늘은 매니저님께서 여기저기 돌아다니시면서 '리덕스의 흐름'에 대해 질문을 던지시는 것 같아서 미리 대비할 겸 정리하고자 한다..대충은 알고 있는데 이를 누군가에게 설명할 정도로 확실하고 빠삭하게 인지하고 있지는 않으니 이번 기회에 복습한다고 생각해야겠다.: State

0715yk

: 본래 React를 쓰면서 'state 끌어올리기'에 부담을 느끼거나, 불필요한 props drilling 등이 이슈가 되면서 전역적인 state 관리법이 필요해졌고, 그에 대한 해답(?)으로 나온 것이 Redux라고 할 수 있다(React + Flux 패턴). 하지

leyuri

[React] saga 설치하고 generator 이해하기

darcyu83

Saga 적용 후 dispatch로 getMovies action creator를 전달하였다. 무한 로딩 로딩 로딩 ... 멈춤 왜? 이유는 1줄의 코드가 ... redux thunk와 헷갈려서 ... 원인을 찾앗다... 내시간... 오류 코드 아래는 red

darcyu83

리덕스 사가 구현 중 마주친 yield call 타입 에러가 나왔다. 'yield' expression implicitly results in an 'any' type because its containing generator lacks a return-type ann

mong-head

https://github.com/mong-head/error/blob/master/images/saga_infinite_loop_problem.PNG?raw=true문제상황 : mount하는 시점에 dispatch실행mount, action은 한번씩만 불렸지

mong-head

Unhandled Rejection (Error): When called with an action of type "CONTACTS_SET", the slice reducer for key "contacts" returned undefined. To ignore an

sklsh917

Redux Thunk와 Saga에 대해 알아봅시다.

ysg81

react-redux에서 로그인과 같은 비동기 작업을 해야 할 때는위 흐름과 같이 진행되어야 했다. 하지만 비동기 작업을 redux-thunk라는 미들웨어를 통해 비동기 작업을 조금 더 편리하게 관리할 수 있다../redux-action.js 파일에서 thunk 액션을

secho

직접 작성한 예제를 기반으로 작성코드와 같이 보시면 더욱 도움될 것 같습니다이전 글 에서 크게 달라지는 것이 없다.Action, Reducer은 완전하게 동일하다.달라지는 점은, Context API에선 전역 데이터에 접근하기 위해 Provider에 등록했고 Reduc

broccoliindb

사가에서는 에러핸들링하는 방법이 2가지 종류가 있다.일반적으로 아래와 같이 사용한다. 이 방식은 😟😟간단하지만 응답에 에러메세지를 실어보내는 경우 원하는 메세지를 보여주지 않는다.위 방식대로 한다면 백엔드에서 res.status(401).json(err)를 해줄 때