Hazellog

이전에는 전역 변수의 관리를 위해 React context를 사용했다면, 이번에는 Redux를 사용하려고 한다. React와 typescript 환경에서 코드를 작성하고 있다! Redux란? 리덕스는 action 이벤트를 사용하여 어플리케이션 상태를 관리하고 업데이트하는 라이브러리이다. 전체 어플리케이션에서 상태에 접근할 수 있는 특징이 있어 전역 변수를 관리할 수 있다. 즉, 해당 값이 필요한 컴포넌트에 도달하기 위해서 거치는 모든 자식 컴포넌트에 매개변수로 값을 전달하지 않고, 값이 필요한 컴포넌트에서만 참조하여 사용할 수 있다. https://react-redux.js.org/ React Redux | React Redux Official React bindings for Redux react-re..

문제 페이지를 새로고침하는 경우, 모든 변수와 상태 값이 초기화되는 문제가 있었다. 결론적으로 useState와 useContext를 정확하게 이해하지 않아 발생한 오류였다. useState 는 변수 값을 상태 값으로 저장하여 상태 값이 변경되었을 경우, 해당 상태 값을 사용하는 컴포넌트만 부분적으로 리렌더링된다. 전체 페이지를 리렌더링 하지 않고, 부분 리렌더링으로 부하를 줄일 수 있다. useContext는 useState의 사용이 많거나 변수를 전역으로 선언하여 사용하는 경우에 사용에 용이하다. useState 값을 context 내에 저장하여 관리할 수 있다. 다만, 두 Hook 모두 값이 변하지 않는 것이 아니다. 리렌더링 되는 경우에는 기존의 값을 기준으로 변화된 컴포넌트들만 바뀌어 렌더링되어..