react리액트란 유저 인터페이스를 만들기 위한 JavaScript 라이브러리로 현 meta, 전 facebook에서 개발하였다.컴포넌트(component)라는 작고 독립적인 코드 블록을 조합하여 빠르고 효율적으로 화면을 구성한다.컴포넌트란? - 문서(HTML), 스타
React Component란? 컴포넌트를 이해하기 위해 먼저 웹 프레임워크의 동작 방식을 알 필요가 있다. >웹 프레임워크(Web Framework) 또는 웹 애플리케이션 프레임워크(Web application framework)는 동적인 웹 페이지나, 웹 애플리케
상위 또는 부모 컴포넌트가 하위(자식)컴포넌트에 정보를 전달할 수 있는데 이것을 프로퍼티(Properties), 줄여서 Props라고 한다. (형제 컴포넌트끼리는 Props 전달이 힘들다.)Props는 읽기 전용(Read-only)이다.모든 React 컴포넌트는 자신의
React에는 Props를 통하여 부모-> 자식으로 값을 전달할 수 있다.문제는 자식 컴포넌트가 증가할 수록 Props 전달하는데 번거로움이 생긴다.마지막 자식요소에 Props를 전달하려면 전부 거쳐가야한다.이러한 과정없이 Props를 공유할 때 사용하는 것이 Cont
Hook은 React 16.8부터 추가된 기능으로, 함수 컴포넌트에서 React state와 생명주기 기능(lifecycle features)을 "연동(hook into)"할 수 있게 해주는 함수Hook은 계층의 변화 없이 상태 관련 로직을 재사용할 수 있도록 도와준다
상태 유지 값과 그 값을 갱신하는 함수를 반환한다. 사용방법 state를 통해 값을 확인하며, setState를 통해 값을 변경한다. useState의 인자로는 초기값을 지정한다. 즉 첫 렌더링시 state 값은 initialState가 되며, setState로 값
useEffect Hook은 side effect를 수행한다.side effect란?데이터 가져오기, 구독(subscription) 설정, 수동으로 컴포넌트의 DOM을 수정하는 이 모든 것함수를 기억했다가 DOM 업데이트를 수행한 이후에 불러낸다.기본적으로 첫번째 렌더
useState의 대체 함수로 다수의 하윗값을 포함하는 복잡한 정적 로직을 만들거나 state가 이전 state에 의존적인 경우에 사용한다. 또한 useReducer는 자세한 업데이트를 트리거하는 컴포넌트의 성능을 최적화할 수 있게 하는데, 이것은 콜백 대신 dispa
"생성(create)"함수와 그것의 의존성 값의 배열을 전달한다. useMemo는 의존성이 변경되었을 때에만 메모이제이션된 값만 다시 계산한다. 이 최적화는 모든 렌더링시 고비용 계산을 방지하게 해준다.메모이제이션(memoization)이전에 계산한 값을 메모리에 저장
함수를 메모이제이션하기 위해서 사용되는 hook 함수로 천번째 인자로 넘어온 함수를, 두번째 인자로 넘어온 배열 내의 값이 변경될 때까지 저장해 놓고 재사용 할 수 있게 해준다. React 컴포넌트 함수 안에 함수가 선언이 되어 있다면 이 함수는 해당 컴포넌트가 렌더