State(내부상태), Props(외부로 부터 전달 받은 상태), Render(JSX)가 있고 State가 변경될때마다 가상돔을 사용해 변경된 부분만 화면에 업데이트 된다. 리액트에서 사용하는 모든 state는 불변성을 유지해야하고 변경이 발생한다면 새로운 객체를 만들어야한다. 리액트에서 사용하는 상태는 읽기 전용이기 때문에 변경이 필요하다면 새롭게 객체를 만들어야한다. useState로 바뀌는 데이터만 새롭게 객체를 만들기가 복잡하여 Redux, Mobx, Immer 등 상태관리 라이브러리를 쓰기도 한다. 하지만 복잡한 상태관리가 필요하지 않다면 UseState, useReducer, Context API 훅을 통해 글로벌 상태관리를 할 수 있다. useReducer 상태를 관리하게 될 때 useSta..
React Query
React Query는 React Application에서 서버 상태를 불러오고, 캐싱하며, 지속적으로 동기화하고 업데이트하는 작업을 도와주는 비동기 상태 관리 라이브러리이다. 리액트에서 상태 관리를 위한 라이브러리는 redux, recoil 같은 라이브러리 등 다양하다. 대부분 이러한 상태 관리 라이브러리를 사용하며 클라이언트 상태와 서버 상태를 함께 담아두고 있는 경우가 대부분이다. react-query를 사용해 서버 상태를 관리한다면 클라이언트 상태를 분리하여 관리할 수 있기 때문에 직관적이고 효율적인 관리가 가능해진다. 이 외에도 react-query에서 지원하는 다양한 옵션들을 사용해 캐싱, 에러처리, suspense, refresh, data fetching 조건 설정 등 기존에 불편하게 느꼈..