# usequery

20개의 포스트

useQuery 사용 시 렌더링이 2번 씩 일어나는 문제

useQuery를 적용해보던 중 컴포넌트 렌더링이 두번씩 일어나는 상황이 발생했다.쿼리문은 아래와 같고, 받은 데이터를 props로 전달하는 아주 간단한 코드이다.전달받은 데이터는 아래의 과정을 거친다.전달받은 컴포넌트 중 좋아요 버튼이 클릭되면 좋아요 post 요청을

2022년 6월 20일
·
0개의 댓글

[React] React Query

useQuery는 서버로부터 비동기로 데이터를 조회할 때 사용되는 custom hook이다. useQuery를 사용하면 기존에 isLoading, isError, refetch, 데이터 캐싱 등 개발자가 직접 구현하려면 꽤 귀찮거나 까다로웠던 기능을 제공해주기 때문에,

2022년 6월 12일
·
0개의 댓글
post-thumbnail

24) Yup,, 왜 이제 알았는지?

Algorithm Self Study, Common-Component, Control Components, Non-Control Components, react hook form, useApolloClient, use query, yup, Algorithm Class

2022년 6월 10일
·
0개의 댓글
post-thumbnail

[6/2 TIL] useQuery 사용하기

1. polling 방식 쿼리가 일정 주기마다 실행되도록 하여 서버와 실시간에 가까운 동기화를 제공한다. 쿼리에 대한 polling을 활성화 하려면 pollInterval 옵션얼 설정해준다. refetching 방식 polling 방식처럼 일정 간격으로 update

2022년 6월 2일
·
0개의 댓글

Flatlist, useQuery

들어가기seeFeed Query를 useQuery를 이용해서 data를 불러온 다음에Flatlist로 뿌려줌, web에서는 map으로 뿌렸는데app에서는 Flatlist로 뿌려줌.Scrollview를 이용해도 되지만, 이어서 infiniteScroll까지 사용하기 위해

2022년 5월 27일
·
0개의 댓글
post-thumbnail

[TIL] 원티드 프리온보딩_16일차_220518

오늘은 react-query공부 ❕react-query를 사용하는 이유는 아래와 같다Server와 Client 사이 비동기 로직들을 쉽게 다룰 수 있다.캐싱, 동기화, 업데이트가 쉽게 이루어진다.npm install react-queryreact-query사용을 위해

2022년 5월 18일
·
0개의 댓글

follow, unfollow (1)

들어가기front부분에서 user를 follow, unfollow하는 부분,일단은 cache부분은 생략하고 useMuataion, useQuery 부분만 마무리 한다.Profile에서 follow, unFollow할 수 있게 구성한다.\-styled부분에 대한 설명은

2022년 5월 10일
·
0개의 댓글

useUser, useQuery, useReactiveVar

들어가기useUser는 page어디에서나 loggedInUser의 정보를 받아서 사용할수 있음.useQuery는 server의 Query를 frontEnd에서 사용해서 정보를 뿌릴 수 있음.useReactiveVar는 page어디에서나 loggedIn 여부를 확인 및

2022년 5월 2일
·
0개의 댓글

React Query를 통한 실시간 서버 통신 (useQuery)

React Query를 사용하는 법을 간단히 알아보고, React Query를 통해서 서버의 최신 데이터를 실시간으로 받아오는 코드를 작성해보았다.

2022년 5월 1일
·
0개의 댓글

useApolloClient

useQuery 요청 : 자동 그림 : 자동 useLazyQuery 요청 : 수동 그림 : 자동 실행만 내가 원하는 곳에서 할 수 있음 useApolloClient 요청 : 수동 그림 : 수동 axios와 비슷 자동으로 그려주지 않음 받아오는 것 까지.

2022년 4월 14일
·
0개의 댓글
post-thumbnail

24일) useQuery로 바로 안불러오고 useApolloClient로 axios처럼 원하는 위치에서 data 불러올래요! YUP! react HOOK! code camp FE 6기

오늘의 알고리즘 문제 ! 마지막에 갓범수님한테 int의 범위에 대해 듣게되고 맞추었다...!숫자의 타입 정리해놓차오늘 배울것요청과 그림을 그려주는 부분(리렌더링) 모두 자동 화면이 그려질때 요청이가고 , data로 받아오고 자동으로 그 데이터를 가지고 화면에 그리게 된

2022년 4월 14일
·
0개의 댓글
post-thumbnail

DetailPage(1.typescript, 2.navigation, 3.setOPtions, 4.route, 5.params, 6.useQuery, 7.Linking, 8.LinearGradient),

type RootStackParamList = { Detail: Movie }==>ai.ts 에서 만들었던 interface Movie를 타입으로 불러온다.여기서 받는 params가 Movie에서 오기 떄문이다.2.type DetailScreenProps = Nativ

2022년 4월 10일
·
0개의 댓글

React Query - useQuery 재사용

그동안 서버상태를 가져다 리액트 기반의 앱에서 화면에 표출하려면 참 많은 방법들을 사용했었다. 뭐 직접 axios 같은 것을 호출해서 useState 를 업데이트 하기도 하고 좀 더 고급진 방법으로는 redux 와 같은 상태관리 라이브러리 내에서 미들웨어를 통해서 ap

2022년 3월 20일
·
0개의 댓글

리액트 쿼리 useQuery 사용법

리액트 쿼리는 fetching, caching, updating 등을 다양한 옵션과 간단한 로직으로 해결할 수 있게 해줍니다. 그 중에서 useQuery는 GET 요청을 보낼 때 사용합니다. 초기 설정은 Context API와 비슷합니다. Context API에서

2022년 3월 11일
·
0개의 댓글

동기 & 비동기 / 220113

TIL 네걸음 Day 4.동기 & 비동기 1.동기&비동기란? 1)동기 > 게시글이 등록되고 서버컴퓨터로부터 등록완료가 된 후에 (응답완료) 요청하는 통신. 즉, 서버 컴퓨터가 작업이 끝날 때까지 기다리는 통신을 뜻한다. > 요청1이 완료 되기전에 요청2를 불러오

2022년 1월 14일
·
0개의 댓글
post-thumbnail

useQuery

갑자기 hook 들어오는, use어쩌고 리액트 훅의 하나이다.useState는 이제 익숙하지만 useQuery는 또 무엇에 쓰는 명령어인고...그렇다. 지금 배우는 것이 어렵게 느껴진다면 더 어려운 것을 배워보자. 어렵게 느껴졌던 것이 상대적으로 쉬워보이는 효과가 있을

2021년 9월 9일
·
0개의 댓글
post-thumbnail

[7일차] codecamp 첫 주말/ 복습2

어제에 이어 두번째 페이지 만들기 도전.아직 완벽히 이해 안가는 부분도 있으나 일단은 따라해보며 파악해보자.버튼 클릭 시 결과화면에 띄우기 -> 데이터 조회 요청 -> query\-필요 기능 목록-통신 기능(조회) - API -> apollo -> usequery,

2021년 5월 16일
·
0개의 댓글
post-thumbnail

Poke Docs 만들기 - NextJS, react-query

서론에서 썻던것과 같이 페이지는 총 3개로 구성하였습니다.index.tsxdocs.tsxitem/id.tsx일단 Next js 에 나온것 과 같이 시작을 하였습니다.기본적으로 typescript, eslint, prettier 를 추가하였습니다.1.nextJS 에서 t

2021년 2월 8일
·
0개의 댓글