# hooks
Techniques for dealing with REACT_finally, Hooks
함수컴포넌트에서도 상태관리할수있다 : useState렌더링 직후 작업을 설정하는 : useEffect리액트 내장 Hooks 사용하기 → 커스텀 Hooks 만들기가장 기본적인 훅함수컴포넌트에서도 가변적인 상태를 가질 수 있게 해줌하나의 useState함수는 하나의 상태값
Section4 - Unit 4 [React] 심화
Virtual DOM : React 환경에서 UI의 상태를 추적하고 변경된 요소를 적용시켜 갱신시키기 위한 가상의 DOM, 실재 DOM 객체를 대응함 실제 DOM트리에 직접적으로 접근에 변경하는 것이 아닌 변경점을 적용한 가상의 트리와 비교해 변경점으로 변경하는 방식으

react 클래스(class) 컴포넌트보다 hooks가 좋은 점
코드의 간결성: Hooks를 사용하면 클래스 컴포넌트보다 코드가 더 간결해짐 Hooks를 사용하면 상태 관리와 생명주기 처리를 하나의 함수에서 처리 가능 재사용성: Hooks를 사용하면 코드를 재사용하기 쉬워짐 Hooks는 독립적인 함수로 작성되기 때문에 다른 컴포

<React>리액트 Hooks( useState, useEffect )
useState useState는 상태값을 관리하게 해주는 hook이다. 기본값(initialState)을 파라미터로 받고, 상태값이 state와 상태값을 변경할 수 있는
리액트 소스코드 뜯어보기 #6 (Hooks - 1)
React hooks 는 기존 Class Component를 사용하지 않고 함수형 컴포넌트에서 stete를 다루고 다양한 기능을 구현할 수 있는 방법이다. 이를 이용해 상태관리, 라이프사이클, Context API 등의 기능을 구현할 수 있다.이전의 클래스형 컴포넌트에
#10. useMemo로 최적화가 최선일까? 일단은 그럴지도 ?
Component 함수가 렌더링 되는 과정에서, value 변수는 초기화 됨 ! 따라서 calculate 함수의 값은 변하지도(update) 않았는데 호출됨 !→ 계산값을 메모리에 저장 (Memoization) → 동일계산의 반복수행 제거 !그러니깐, useMemo는

실행컨텍스트 와 비동기 처리 , 함수형 리액트
실행 컨텍스트란, JavaScript코드를 읽고, 읽은 코드를 실행할때 필요한 값, 함수, 클래스 등을 컴퓨터가 사용 할 수 있도록 메모리에 올려 놓을때 만들어 지는 것 입니다. 코드가 있는 disc에서 ram으로 ram에 이 실행 컨텍스트를 생성 해서 cpu로 보내서
React Hooks란 ?
클래스 없이 state를 사용할 수 있는 기능class component에서 사용되어온 react에서 느껴지는 불편함이나 문제점들을 해결하기 위해 개발원래 리액트는 주로 class component를 사용했었음.간결하고 빠르게 사용할 수 있는 함수형 컴포넌트는 생명주기

컴포넌트의 라이프사이클 & Hooks (3)
이전에 다뤄보지 못한 Context 부분과 메모이제이션을 위한 useMemo, useCallback, memo 에 대해서 대략적으로 알아본다.
React | useMemo(), useCallback(), + React.memo()
useMemo는 컴포넌트의 성능을 최적화시킬 수 있는 대표적인 react hooks 중 하나!useMemo에서 Memo는 Memoization을 뜻한다.\* memoization ? 메모이제이션 ? : 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값

[React] Pagination 구현
⚙️ ListPage 구조 및 결과 ✅ useAxios 커스텀 훅 useAxios custom hooks 부터 살펴보자면 인자로 api의 baseUrl, api의 Path Parameter를 type이라 정의하여 받아온다. data는 response data 값을

useId hook 이란?
useId hook은 React 18에 새로 추가된 hook으로 유니크한 id를 만들어준다.하지만 이 hook의 반환값을 key 를 위해 사용하지마라고 한다.하긴 key를 위해 사용하려면 useId 를 몇개나 사용해야할지 측정하기도 어렵고, 최상단에서 사용해야하는 ho
#4-3. React Component에서 부터 Hooks의 탄생까지(part3. hooks의 탄생)
class형 컴포넌트는 state와 Life Cycle의 관리가 가능하지만 컴포넌트 상태로직을 재활용하기 어렵고, this의 동작방식의 오류 가능성이 있으며 메모리 자원을 낭비한다는 단점이 있었다. 그리하여 state관리와 Life Cycle관리는 불가능하지만 메모리
#4-2. React Component에서 부터 Hooks의 탄생까지(part2. component의 종류)
Component는 크게 class형 컴포넌트와 함수형 component로 나뉜다 ! class 그리고 component 상속이 필수임render가 필수임props를 조회할 때 this를 사용함state(상태)를 사용함life cycle과 method를 이용클래스 컴포

#4-1. React Component에서 부터 Hooks의 탄생까지(part1. react component)
리액트에서 Component(컴포넌트)는 "앱을 이루는 최소한의 단위"라고 정의할 수 있다. (그러니깐, 리액트 앱은 '컴포넌트 + 컴포넌트 + 컴포넌트 + ... + 컴포넌트'의 형태! UI를 재사용 가능한 개별적인 여러조각으로 나눈 것이 컴포넌트)👉사전적 의미:

[번역] React에 useEffectEvent가 나온다
사라졌지만 useEvent에 대해 알아보고 싶으신 분들은 여기를 클릭 해 주세요원글 보러 가기6개월도 더 전에, React 팀은 새로운 useEvent hook과 관련된 Request For Comments(RFC)를 전 세계에 공유했습니다. useEvent는 refe
[React] React Hooks
React v16.8에 새로 도입된 기능으로서, 함수 컴포넌트에서도 state 관리를 할 수 있는 useState, 렌더링 직후 작업을 설정하는 useEffect 등의 기능등을 제공하여 기존의 함수 컴포넌트에서는 불가능하던 작업들을 할 수 있도록 도와줍니다.useSta