Show GN: React Query 밑바닥부터 만들어보기
(mugglim.github.io)안녕하세요.
이전에 소개드린 Build Your Own TanStack Query 프로젝트를 홈페이지로 배포하여 공유드려봅니다.
상세한 내용은 아래 링크 확인 부탁드립니다.
https://mugglim.github.io/build-your-own-tanstack-query/ko/
기여는 언제든지 환영입니다!!
kildong21의 댓글은 한국 IT 업계의 문화적·구조적 한계를 적나라하게 드러냅니다. 단순한 트롤링을 넘어서, 왜 이런 댓글이 자연스럽게 나오는지를 되짚어볼 필요가 있습니다.
니 소리가 왜 개솔이냐면 상태관리 라이브러리가 수없이 많은데... 정말 새로 등장한 것이 혁신적이 었다면 모두 한쪽으로 쏠려야 하는데.. 그런 것이 아니거든? 선호의 문제이지... 혁신이 아니란 말이지... 다른말로 또다른 쓰레기의 양산인 거지...
reactjs가 정말 최선이라면 왜 vue, svelte, solid... 등등이 등장하고 사용자 층을 형성하겠니?
물론 난 딱히 vue, svelte같은 코드 스타일을 싫어 하지만....
내가 무식해서 그러는데... 이딴게 왜 필요한 건가요? 자꾸 상태관리에서 거지같은 것들을 만들어 내는지 이해를 못하겠네요. 뭔가 혁신적이기라도 한건가? 쓰레기들좀 그만 양산 했으면 좋겠네요.
Build own your ***는 간단한 버전을 만들며 컨셉을 이해하기 쉽게 만드는 일종의 교육 과정이고요.
tanstack query는 서버상태관리를 위한 시장 지배적인 솔루션입니다.
캐싱/워터풀 요청같은 성능, 로딩/에러같은 요청상태등을 쉽게 다루게 만들어주고요.
모르시면 한번쯤 보시는것을 추천드립니다.
무식하다는 이유로 댓글의 무례함이 설명되지는 않는것 같습니다.
같은 메시지라도 매너있으면 좀 더 전달력이 있을것 같은데 일방적인 비방만 있는것 같아서 아쉽습니다.
널리 알려진 상용 라이브러리의 작동원리를 이해하려고 스스로 비슷하게 작동하는 간단한 버전의 코드를 작성해보고 있다고, 우리팀 신입이 그러고 있으면, 업어줬을텐데요... 되건 안되건, 막 칭찬해주고요. 물에 담가둔 양파에 칭찬 해주듯.
내가 좀 똑똑해서 그러는데… 네가 왜 이런 댓글 쓰는 건지 도통 이해 안 가네. 열심히 만든 사람이 커뮤니티에 공유하는데 터무니없는 불평이나 양산하는 거, 진짜 짜증 나. 뭔가 혁신적인 비판이라도 해본 건가? 너 같은 애들 때문에 한국 개발자들 사이에서 지식 공유하고 성장하는 문화가 쳐지는 거야. 무식 뽐내며 쓰레기 댓글 싸지르지 말고, 기본 개념부터 잡고 와서 똑똑한 척 좀 해라.
React Query 의 필요성을 말씀하시는건가요?
아님 Build Your Own TanStack Query 프로젝트를 말씀하시는건가요?
상태관리라고 말씀하신거 보니 React Query 의 필요성 을 말씀하신것 같다는 생각이 드는데,
ReactQuery 는 혁신적이라고 볼 수 있습니다.
그리고 ReactQuery 에 상태 관리 비슷한 개념도 있긴 하지만, 상태 관리가 목적인 라이브러리는 아닙니다.
https://tanstack.com/query/latest 여기 보시면 해당 라이브러리의 목적이 간단하게 소개되어 있어요.
이런 내용이 아니면, 혹시 어느 부분이 거지 같고 이해가 안되시는지 말씀해 주시면 저도 같이 고민해 볼께요.
web app에서
일단 상태관리가 필요한가? 부터가 의문임.
글로벌 상태관리라고 해봐야 사용자 인증정보, 알림 + 알파 정도일거고... 이건 그냥 세션 스토리지같은 곳에 처 밖아아도 됨.
페이지별 crud 기준으로 어차피 페이지 떠나면 재활용 되는 정보 없으니... 굳이 관리해야 한다면 지역상태로 관리 하면 됨. ( 주식처럼 뷰를 실시간 처리하는 것은 특수한 경우임)
즉 상태관리가 엄청 필요하고 ... 쓰이고 그런 것이 아닌데...
뭘 그리 자꾸 만들어 내는지 이해가 안가는 것임. 왜 상태관리에 그토록 진심인거냐는 거지...
글타고 뭐 다른 상태 관리 라이브러리 대비 딱히 편하거나, 그런것도 없음. 다 거기서 거기임.
혹시 내 의문에 답을 해줄실력이 될까요?
그동안 웹 애플리케이션의 아키텍처 유행이 바뀌어서 그렇습니다
다중 페이지 어플리케이션(MPA, 전통적인 형태)
- 상태 관리 범위: 서버 세션으로 인증, 페이지 전환간 영속성 처리
- 초기 화면 표시: 웹서버 내 데이터 조회 -> 브라우저로 HTML 응답 -> HTML 문서 표시
- 화면 갱신: 필요한 부분만 jquery, AJAX 등으로 별도 구현
단일 페이지 어플리케이션 (SPA)
- 상태 관리 범위: 인증 검사, 데이터 질의, 화면 요소 생성 등 기능의 책임이 브라우저로 이동함. 전체 애플리케이션 상태가 브라우저의 메모리에 저장되어 MPA 대비 클라이언트의 복잡성 증가
- 초기 화면 표시: 기본 UI 표시 -> 인증상태 검사 / 데이터 조회 -> 화면 갱신
- 화면 갱신: 초기화면 표시 로직 중 데이터 조회 -> 화면 갱신 재사용
기술 발전의 흐름을 보면 모든 진보가 발전은 아닌 것 처럼 느껴집니다. 개발자가 이해하고 처리해야 할 일의 총량이 줄어들지 않고, 서버와 클라이언트 사이에서 구현해야 하는 기능이 수시로 이동하는 점이 그렇습니다
네 angular의 경우 저런 것 공부할 필요없이 일단 필요한 기반코드는 다 준비되어 있습니다. 필요한 경우가 생기면 그때 적용하면 되구요. 반면에 리액트는 빠져있는 기술을 채워넣어야 해서 angular보다 협업도 힘들고 코드베이스 표준화도 쉽지 않습니다. 리액트의 범위가 한정되어 있어서 리액트 자체는 가볍고 간단해보일 수는 있지만 실무에 필요한 것들이 빠져있어서 아쉽습니다
혹시 https://tanstack.com/query/latest 여기 먼저 읽고 오셨나요?
질문 주신거 보니까 클라이언트에서의 상태관리 필요성에 대해 말씀하신것 같은데요
이 본문 내용과 그리고 ReactQuery 라이브러리의 효용에 대해 잘못 이해하신것 같아요.
- 본문 내용은 Build Your Own TanStack Query 입니다. 이건 한글로 번역하면 "나만의 TanStack 쿼리 만들기" 입니다.
이 프로젝트의 주 목적은 새로운 라이브러리를 만들어내는게 아니라 만들어보면서 구조에 대해 학습을 하는 내용입니다.
본문에 있는 링크에 들어가보셨으면 바로 아셨을텐데요. 혹시 아직 안들어가보셨나요?
"직접 만들어보는 경험 - 밑바닥부터 구현해보면서 TanStack Query의 이해도를 높일 수 있습니다."
-
React Query 는 클라이언트 상태 관리 라이브러리가 목적이 아닙니다.
Redux 라든가 기타 등등의 라이브러리와 다른 내용입니다.
제가 tanstack 에 대한 강의를 하기엔 좀 그렇고
먼저 https://tanstack.com/query/latest 여기 읽고 오시고 나서 질문 주시면 될 것 같아요.
그리고 ReactQuery 는 React Native 앱에서도 사용 가능합니다 ㅋ -
클라이언트 상태 관리에 대해 하소연 하시는거면 ...
번지수를 잘못 찾으셨습니다.