React

React 16.8 이전에서는 함수형 컴포넌트에서는 상태를 관리할 수 없었다.그러나 React 16.8에서 hooks 라는 기능도입으로 인해 함수형 컴포넌트에서도 상태를 관리할 수 있게 되었다~!리엑트에서 useState라는 함수 불러오는 것.useState 사용해서

html과 js를 사용할 때는 특정DOM선택해야 하는 상황에 document.getElementbyId() querySelector() 같은 DOM selector을 사용해서 선택함.react를 사용하는 프로젝트에서도 가끔씩 DOM을 직접 선택해야 하는 상황 발생할 수

useEffect 라는 Hook 을 사용하면!만든 컴포넌트가 마운트 됐을 때 (처음 나타났을 때)언마운트 됐을 때 (사라질 때, 삭제될 때) 업데이트 될 때 (특정 props가 바뀔 때) 특정 작업을 처리할 수 있다.📍첫 번째 파라미터 : 함수 등록두 번째 파라미터

성능 최적화를 위하여 이 전에 연산된 값을 useMemo라는 Hook 을 사용하여 재사용.성능을 최적화 해야 하는 상황에서 사용.특정 값이 바꼈을때만 특정 함수 실행해서 연산을 하도록 처리.원하는 값이 바뀌지 않았다면, 리렌더링할 때 예전에 만들어 놨던 값을 재사용할

useMemo 와 비슷한 HookuseMemo 는 특정 결과값을 재사용 할 때 사용하는 반면, useCallback 은 특정 함수를 새로 만들지 않고 재사용하고 싶을 때 사용.App.js에서 onCreate, onRemove, onToggle\-> 위 함수들은 컴포넌트

컴포넌트에서 리렌더링 불 필요할 때 이전에 렌더링 했던 결과를 재사용 할 수 있게 하는 방법.\-> React.memo 함수 사용하면 컴포넌트의 리렌더링 성능 최적화를 해줄 수 있다.컴포넌트의 props 가 바뀌지 않았다면, 리렌더링을 방지하여 컴포넌트의 리렌더링 성능

이전에 컴포넌트 상태를 업데이트 할 때에는 useState사용해서 새로운 상태를 설정했다.useState말고, useReducer라는 Hook을 사용해서 상태를 업데이트 할 수 있다.useState\->설정하고 싶은 다음상태를 직접 지정해주는 방식으로 상태를 업데이트.

컴포넌트를 만들다보면, 종종 반복되는 로직들이 발생한다.\-> ex) input 을 관리하는 코드는 자주 작성할 수 있는 코드이다. \-> input을 관리하려면 e.target 안에 들어 있는 name값이랑value를 읽어서 참조해서 어떤 새로운 상태를 설정해야 함

Context API