JEEYOUNG.ME

useReducer는 전역 상태나 여러 컴포넌트에서 공유되는 복잡한 상태를 관리할 때 유용함. 간단한건 useState를 사용함. 둘다 상태를 변경하는 훅이라는건 동일하다. #예시 - 사용자 입력값의 상태를 나타내는 inputState와, 유효성 검사결과를 나타내는 isValid 상태가 있다고 가정. - 이때 inputState에 따라서 isValid는 true, false로 상태가 달라지게된다. 두 상태값이 서로 연결되어있음. - 요럴때 useState를 두번 작성하기보다, useReducer를 사용해도 된다는거임! 상태를 정의할 컴포넌트 바깥에 reducer 함수를 정의한다. 컴포넌트 내부에 상태를 정의하고, input의 value가 변경될때마다 실행되는 트리거함수도 정의함. 이때, 트리거함수가 실행..

React Router의 Link 컴포넌트와 일반적인 HTML 태그를 사용하는 것의 차이점 #브라우저 내비게이션 방식 태그: 클릭 시 페이지가 새로고침되면서 링크된 주소로 이동한다. Link 컴포넌트: 클릭 시 페이지가 새로고침되지 않고, React Router가 관리하는 페이지로 이동. #SPA에서의 사용 태그: SPA에서는 새로운 페이지를 로딩할 때마다 애플리케이션의 상태를 잃어버릴 수 있다. Link 컴포넌트: SPA에서는 새로운 페이지를 로딩하지 않기 때문에 애플리케이션의 상태를 유지하면서 페이지 간 전환을 수행할 수 있음. 동적라우팅 처리

shoes 라는 [{}, {}, {}] 이런 형태의 객체의 배열이 있음 서버로부터 받아온 똑같은 타입의 데이터들을 shoes에 추가하여 상태를 업데이트 하고자함. 스프레드 연산자를 사용해 배열로 감싸주면 간단히 해결! 🤩

컴포넌트간에 props 전달 규칙 props를 전달할때 부모 -> 자식 컴포넌트로 전송이 가능하다. 반대로, 자식 -> 부모로는 전달 불가X 같은 루트에 위치한 컴포넌트 끼리도 전달 불가X Q. 특정 State가 부모와 자식 컴포넌트 둘다에서 필요하다. 이때 state 정의는 어디에 해야할까? 👉 부모 컴포넌트. 최상위 컴포넌트에 만드는것이 일반적임.