REACT JS - PRACTICE

Dadjokes 앱을 만들면서 콜트가 짠 코드를 보았다. 그리고 로직이나 메소드를 구성하는 측면에서 많은것을 배웠다 살펴보자.upvote/downvote 구현할때 나같은 경우는 jokeRow에다가 구현했다. 그것도 buttonType에 따라서 vote++/vote--

유데미에서 yahtzee 라는 게임을 만들어보았다. 주사위를 돌리고나서 나온 숫자를 보고 스코어에 해당하는 점수를 클릭한다. 주사위 결과가 점수를 받을 수 있는 조건에 부합하면 점수를 획득하고 아니면 0점을 얻는다.모든 스코어를 클릭하면 게임이 끝나고 총합이 기록되면서

color palette을 만들면서 배웠던 것을 정리해보았다.이렇게나 많이 배웠다니.. 역시 한 프로젝트만 패는(?)것이 나에게 맞는 공부법인것 같다는 생각이 든다.깃헙 코드stopPropagation을 드림코딩에서는 부모 이벤트까지 모두 차단하기 때문에 예상치 못한

Karl Hadwen의 insta clone 프로젝트를 참고로 하여 나만의 사진 공유 프로그램을 만들어 보았다. 그리고 그 과정에서 새로 알게된 지식, 디버깅 했던 것들을 정리해보려고 한다.usePhotos를 사용해서 photos를 자동 업데이트 하려고 했다.그런데 이

react에서 1초씩 카운트 하면서 화면에 출력해주는 함수가 있다고 하자. 그럼 코드를 요렇게 작성할 것이다.그럼 잘 작동할까? 놀랍게도(?) 잘 작동하지 않는다.왜냐면 리랜더링할때마다 setInterval이 새로 호출이 된다. 그럼 setCount를 여러번 만들어내는

이전 포스트에서 만들었던 useInterval을 이용해서 시간이 얼마나 남았는지 출력하는 앱을 만들어보려고 한다.들어가기에 앞서 이번 글은 코드종님의 영상을 참고하여 정리하는 글이다.코좀봐코앱을 만들기 전에 항상 생각해야할것은 입력과출력이다. 리액트 훅을 이용한 함수

seo는 html상에서 head태그안에 meta태그, 각종 웹사이트의 정보를 알 수 있는 태그를 담는 행위를 의미한다. 자세한건 검색으로 ㄱㄱseo를 잘하면 검색 상단에 노출될 수 도 있지만 링크를 보냈을때 미리보기 사진도 띄울 수 있다.seo는 next js서만 할

vite는 한국인에게 딱 맞는 template starter이다아래와 같이 작업을 시작해라yarn create vite \[프로젝트 명] --template react-tsnpm i -D vite-tsconfig-paths @types/node아주 간단하쥬??

대단한 영상을 발견했다. profy dev라는 채널을 운영하는 시니어 개발자이신 분이다. 주니어가 작성한 코드를 보고 리팩토링하여 복잡한 코드 개선, 버그 발생 가능한 코드 개선을 통해 유지보수하기 매우 쉬워졌다.리팩토링 포인트는 아래와 같다.: 다른 state로 부터

mutate의 뜻이 일단 뭐냐??변형시키는 것이다. react-query에서 mutate는 query cache를 인위적으로 바꾸는 것이다. 크게 3단계로 mutation이 일어난다.onMutate -> fetch -> onSucess/onError -> onSettl

캐싱되는 이유는 당연하다. 데이터를 불러오는 시점에서 사용된 access_token이라던가 id가 동일해야 데이터도 동일하게 유지되어 캐싱되기 때문.useQuery에서 queryOption에서 enabled라는 필드가 있다. 이 필드가 true가 되는 시점에서 useQ

캐싱되는 이유는 당연하다. 데이터를 불러오는 시점에서 사용된 access_token이라던가 id가 동일해야 데이터도 동일하게 유지되어 캐싱되기 때문.useQuery에서 queryOption에서 enabled라는 필드가 있다. 이 필드가 true가 되는 시점에서 useQ

useQuery 와 suspense를 사용하면 순차적으로 api호출이 되기에 waterfall현상이 일어난다.그래서 suspense fallback 이 계속 보여지는 현상이 생긴다.이때 useQueries + suspense를 이용하면 병렬적으로 api호출이 가능하다.

A component suspended while responding to synchronous input. This will cause the UI to be replaced with a loading indicator. To fix, updates that susp

아래 글에 잘 나타나있다.굳이 비유하자면 , stale은 refresh token이고 cache는 access token이라고 생각하면 되려나...access token은 계속 바뀌고 refresh는 access를 갱신할때 필요한 거니깐.https://grow