React Query 이전의 방식, ReduxReact Query는 리액트 애플리케이션에서 서버 상태를 불러오고, 캐싱하며, 지속적으로 동기화 및 업데이트 작업을 도와주는 라이브러리다. 즉, 서버와의 통신을 보다 편리하게 해주는 도구라고 할 수 있다. React Query를 효과적으로 이해하려면, 같은 작업을 React Query 없이 이전에는 어떻게 (얼마나 번거롭게) 작업했는지를 보면 된다.ReduxReact Query 이전에 사람들은 Redux를 주로 사용했다.Redux는 Global State Management Library, 즉 전역 상태를 관리하도록 도와주는 라이브러리다.전역 상태는 리액트 컴포넌트의 Life cycle과 관계없이 비동기 데이터가 관리되기 때문에 캐싱과 같은 최적화 작업을 쉽..

들어가며굳이 카테고리를 나누려 하지 말고 주간 회고처럼 하나의 글에 기억하고 싶은 일을 기록하는 것도 괜찮은 방법인 것 같다.완벽하게 글을 쓰려고 노력하지 말자. 지난주에 작성한 글은 당시에 완성하지 못하고 임시저장 해두었는데, 오늘 다시 읽으면서 금방 마무리할 수 있었다.오늘 글쓰기 시간에 마무리짓지 못하더라도 언제든 다시 마무리할 기회가 있으니, 지금 이 시간, 행위 자체에만 의미를 두려고 노력하자.모달을 여는 과정사용자는 상품관리 페이지의 상품등록 버튼 또는 테이블 내부 드롭다운 버튼을 클릭해 상품을 등록 또는 수정할 수 있다.모달이 열리면 상품 등록/수정을 위한 정보를 입력할 수 있는 폼이 렌더링된다.등록 및 수정에 필요한 정보는 다르지만 사용자에게 동일한 폼을 보여주고 서버에 요청하는 값을 다르..

리액트는 컴포넌트 기반의 라이브러리로, 사용자 인터페이스를 구축하는 데 매우 유용합니다. 리액트의 가장 큰 장점 중 하나는 상태 관리입니다. 상태 관리는 컴포넌트의 데이터 흐름을 관리하는 방법으로, 이를 통해 사용자 인터페이스를 동적으로 업데이트할 수 있습니다. 이번 포스트에서는 리액트의 상태 관리 패턴과 프롭 드릴링에 대해 자세히 알아보겠습니다.React는 컴포넌트 기반으로 작동하며, 각 컴포넌트는 자신의 상태(state)와 부모 컴포넌트로부터 전달받은 속성(props)을 가집니다. state는 컴포넌트 내부에서 관리되는 데이터로, 사용자의 입력이나 API 호출에 따라 변할 수 있습니다. 반면, props는 부모 컴포넌트에서 자식 컴포넌트로 전달되는 데이터로, 자식 컴포넌트는 이를 통해 뷰를 업데이트합..