인프런 커뮤니티 질문&답변

87rlaehdus님의 프로필 이미지
87rlaehdus

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

reducer함수에서 로컬 데이터에 find,filter,push등 해주는 이유가 궁금합니다.

작성

·

173

0

안녕하세요 요즘 SWR과 redux를 섞어쓰고 있는 초보 학생입니다.

지식이 미약해서 부족한 질문이라도 들어주시면 감사하겠습니다.

리듀서 함수에서는 예를들면 이런 코드가 있으면 action.data를 mainPosts 맨앞에 둔다는 뜻인데

case ADD_POST_SUCCESS: draft.mainPosts.unshift(action.data); break;

이 코드는 프런트 환경에서 store에 있는 mainPosts에 action.data를 추가한다는 뜻으로 서버에 요청 상관없이 프론트 환경에서 새로고침 없이 view 변동을 보여주려고 쓰는 건가요?

저는 swr을 사용하면서 서버에서 mainPosts를 불러올때 데이터가 추가되면 mutate 로 체크를 해주었는데요.

swr을 사용해서 data를 가져올 경우 굳이 전역스토어에 추가 게시글 데이터를 추가해야되는지?? 의문입니다. 

그냥 서버에서 처리해주고 가져오면 되는거 아닌가? 이런 생각이 드는데 경험이 적다보니 아직 잘모르겠습니다.

그리고 선생님 최신강의를 보던중 swr로 전역상태를 관리할수있다는 말을 들었습니다.

근데 이기능은 react-query에 정식 릴리즈 되어있는것 같은데 이걸로 

api 콜+전역상태관리 둘다 하게되면 굳이 리덕스를 사용하지 않아도 되는 걸까요??

리덕스 세팅이나 코드량이 너무 긴 단점이 있지만 반면에 에러 헨들링은 쉽다는 장점이 있어? 의견을 여쭈어 보고싶습니다.

답변 2

1

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 react-query나 swr을 사용하면 리덕스를 안 써도 됩니다. 이걸 제가 슬랙클론코딩 강좌로 만든 것이고요. react-query는 devtool도 제공해서 디버깅도 어느 정도 쉽습니다. 

1

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

서버의 부담을 최소화하기 위함입니다. 서버가 부담할 것을 프론트가 부담하게 만드는 것이 좋습니다. 서버는 한 대지만 프론트는 접속자 수만큼 있는 것이라서 한 대가 할 일을 여러 대가 부담하면 좋으니까요. 그리드 컴퓨팅 원리와 비슷합니다.

swr에서도 mutate한 후 revalidate하지 않으면 서버요청없이 데이터를 수정할 수 있는데 이 작업을 리덕스에서 똑같이 하는 겁니다.

또한 서버 요청이 왔다갔다하는 시간도 없어서 화면에 더 빨리 표시됩니다.

87rlaehdus님의 프로필 이미지
87rlaehdus
질문자

첫번째 문단 선생님 강의에서 들었던 기억이 납니다.. 제가 복습이 부족했던 것 같네요. 

추가적으로 너무나 좋은 답변 감사합니다. 가려운곳을 긁어준 느낌이에요 ㅠㅠ

swr이나 react-query의 경우엔 서버에 부담문제등을 해소해주기도 하나요??

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 언제 요청을 보내고 언제 캐싱을 쓸 지 조절할 수 있습니다.

87rlaehdus님의 프로필 이미지
87rlaehdus

작성한 질문수

질문하기