개발 기록 남기기✍️

🤷🏻‍♀️ 문제 상황 React와 REST API를 활용하여 지난 과제 때 바닐라 JS로 만들었던 투두리스트를 다시 만들고 있는 중이다. useEffect를 사용하여 todoItem의 done 속성이 바뀔 때마다 useEffect를 실행하고 API 통신을 하도록 코드를 작성했다. 근데 useEffect의 특성 상, 컴포넌트가 처음 렌더링 될 때 state가 세팅되므로 state가 변화되었다고 감지해 종속 배열에 상관없이 초기 렌더링 때 useEffect가 항상 실행된다. 그래서 초기 렌더링 떄 useEffect가 실행되고, 수정할 todoItem이 세팅되지 않은 상태이기 때문에 API 요청에 빈 데이터가 들어가게 되고, 이로 인해 Network Error가 발생하게 되었다. 💻 해결책 - useRef를 ..

useRef... 수업 때 들었지만 어렴풋이만 알아듣고 아직 완전히 이해하지 못해서 이참에 뿌셔보려고 한다!! 정신차리고 레츠고🏃‍♀️ useRef는 특정한 요소의 id 처럼 활용할 수 있을 뿐만 아니라, 변수를 만드는 것에도 사용할 수 있는 리액트 훅(hook)이다. useRef의 역할과, 어떻게 사용할 수 있는지를 알아보자. 💻 첫 번째) 특정 DOM 선택 JavaScript에서는 특정 DOM 을 선택해야 하는 상황에 getElementById, querySelector같은 DOM Selector 함수를 사용해서 DOM 을 선택한다. 리액트를 사용하는 프로젝트에서도 가끔씩 DOM 을 직접 선택해야 하는 상황이 있다. 상황 예시) 특정 요소의 크기 가져오기 스크롤바의 위치를 가져오거나 설정하기 특정 요..