목록2022/11 (23)
Silver Library (Archived)
Axios 와 XMLHttpRequests 가 나온다면 무엇을 의미할까? XMLHttpRequest XMLHttpRequest (XHR) 객체는 서버와 상호작용할 때 사용합니다. XHR을 사용하면 페이지의 새로고침 없이도 URL에서 데이터를 가져올 수 있습니다. 이를 활용하면 사용자의 작업을 방해하지 않고 페이지의 일부를 업데이트할 수 있습니다. 이름에 XML이 들어가긴 하지만, XMLHttpRequest은 XML 뿐만 아니라 모든 종류의 데이터를 가져올 수 있습니다. 이벤트 데이터나 메시지 데이터를 서버에서 가져와야 하는 통신의 경우, EventSource 인터페이스를 통한 서버발 이벤트(Server-sent events)의 사용을 고려하세요. 완전한 양방향 통신의 경우에는 WebSocket이 더 좋은..
이 두가지가 react-query 를 사용 할 지에 대한 정보글로 보기에 좋았습니다. (다만 굳이 안 읽으셔도 됩니다. 어디까지나 필자의 background knowledge 편의상 남기는 링크글...) How and Why You Should Use React Query Simplify data fetching with react-query’s custom hooks. blog.bitsrc.io What I learned from React-Query, and why I will not use it in my next project The beginning was exciting. The company’s lead front-end architect suggested checking out React-..
Intro react query 와 axios 의 사용법을 알겠으나, 계속 안되는 것을 보고 감이 왔습니다. 결론부터 기록하자면, 우선 중요한 사실... react-query 는 v3 격에 속하고, tanstack 은 일종의 v4, 나온지 얼마 안된 최신본을 의미한다 합니다. 그리고 어째선지 react-query 가 훨신 더 다운로드 횟수가 많죠. 그래서 저는 이 버전을 일종의 stable version 으로 여기기로 했습니다. 이 문제를 해결하기에 앞서, 자바스크립트에서 react, 그리고 axios에서 react-query 까지. 쭈욱...한번 처음부터 어디에서 지식 공백이 생긴건가 싶어 디스크 조각모음 하는 마음으로 종일 잡고 해봤습니다. 어쩌면, 제가 모르는 곳에서 원인이 있었는지도 모를일이지만...
지난번에는 Jikan API 로 Fetch API 와 함께 react 에서 개략적인 구성을 해 봤으니, 이번에는 GraphQL 을 이용해서 Jikan API 를 다시 한번 건드려 보고자 합니다. Jikan API 대신, 다른 API 를 사용해서 간단한 테스트 구동을 진행해보고자 합니다. 개요. react-query 를 주요하게 사용해서 REST API 데이터를 불러오기. 왜 이 실험을 하나요? 1. useEffect 보다도 보다 안정적이다 하기에. 2. 지난 인턴 때 겪었던 고충을 계기로 개선점을 알아가던 중, 추천받은 react-query. 3. axios 로 fetch 를 대체할 수 있다는 사실을 알게됨. 4. 아무튼 코드 길이가 줄어 듬. 5. hook 로 코드 개선하는게 꼭 나쁜건 아님 (적어도 ..