리액트

예약 서비스를 운영하면서 발생한 에러이다. 예약 취소를 눌렀지만 아무런 반응이 없다. 현재 나는 react query를 사용하고 있었기에 어떤 방법으로 이 문제를 해결할 수 있을 지 알아봤다. 1. InvalidateQueries 위와 같이 코드를 작성하면 ['

이전 포스트에서 invalidateQueries와 setQueryData를 공부하면서 두 함수는 서로 다른 역할을 한다는 것을 알았고, 이를 공부하면서 낙관적 업데이트에 대해 알게됐다.

이때까지 next.js 에서 swr을 사용했고, 리액트에서 react query를 사용했다가 처음으로 next.js 에서 react query를 사용했다. react query 에서 사용하는 useQuery 는 클라이언트 사이드에서만 사용가능 하다고 하는데, 정적인

앱 라우터 이전의 페이지 라우터에서의 리액트 쿼리 사용법은 웹상에 많았다. App.tsx 라는 앱 로더를 사용하는데 앱 라우터에서는 이 App.tsx가 없다. 그래서 공식문서를 통해 공부할 수 밖에 없었다. 1. 초기 설정 Next.js 앱 라우터에서는 기본

1. 문제 발생 해당 Form 을 가지고 있는 프로젝트를 만들었고, 이 Form 을 전달하는 과정에서 문제가 발생했다. 분명 Form을 제출하고 위와 같은 페이지(예약완료 페이지인 /reservation/done)가 나와야 하는데, 아래와 같은 오류가 발생하며 페

이때까지 상태관리를 useState 나 useReducer, React Context 혹은 Recoil 로 상태관리를 해왔다. 하지만 회사 모집요강들을 보면 Recoil 이나 Redux 혹은 Redux 상태관리를 우대하는 경우도 꽤 있었다.

이전 포스트의 카운터 를 Redux 로 바꿔보겠다.리액트에서는 redux-toolkit 을 권장하므로 아래의 명령어들로 먼저 설치한다.npm install @reduxjs/toolkit react-redux 이전 포스트에서 Redux 를 설명할 때 아래의 문구가 있었다

이전 포스트에서는 하나의 슬라이스만 사용했는데 여러 개의 `slice(state + reducer)`를 관리한다면 어떨까?