# react hook
useState
react에서는 데이터를 담을 때 JS에서 쓰던 변수를 사용 할 수 있고let pet = "푸딩";react-hook 중 하나인 state에 담을 수 있다.const \[ pet , setPet ] = useState("푸딩");굳이 useState를 쓰는 이유는 무엇
Intersection Observer API
라이브러리를 사용하지 않고 무한 스크롤 등 특정 viewport에서의 이벤트나 함수 실행에 유용한 Intersection Observer API를 알아보자.
[React] useEffect
by Meds Safety https://medssafety.com/side-effects-vs-adverse-effects-vs-contraindications/the hook that manages side-effects in functional React
[React] useRef
The useRef Hook is a function that returns a mutable ref object whose .current property is initialized with the passed argument (initialValue).uesRef
Rules of Hooks
Hooks는 자바스크립트 함수지만 두 가지 규칙을 지키며 사용해야 합니다. 이런 규칙은 linter plugin을 통해 자동으로 적용할 수 있습니다. Only Call Hooks at the Top Level Hooks를 루프 내부, 조건(condition), 또는 중
Axios Interceptor에서 Hook을 사용하는 방법
프로젝트를 진행하면서 Axios Interceptor에서 React Hook 및 Custom Hook을 사용하기 위해 고민했던 과정을 소개합니다.
useState에서 Set은 최소한으로
프로그래밍을 하다 보면 간혹 불필요한 반복을 수행하여 시스템 자원을 낭비할 때가 있습니다. 예를 들어 어떠한 props Array에서 useState Array값을 set 시키기 위하여 반복문을 돌릴 때 반복문 안에서 계속 set을 할 경우 자원 낭비가 심하게 되는
useRef 사용 방법
useRef()는 인자로 받은 값으로 초기화된 변경 가능한 ref 객체를 반환합니다. 이 객체는 컴포넌트의 전 생애주기동안 유지되며, ref.current와 같이 current 속성에 접근하여 현재 가리키는 객체에 접근할 수 있습니다.select Tag에 useRef를
[React] 리액트 Hook 이해하기 - useState, useEffect
React Hooks 개념 정리 및 useState, useEffect 다루기
useState vs useReducer
useState는 쉽게말하면 고객이 장부를 직접 수정하는 경우이다.setCount라는 리모컨을 이용해서 count를 조작한다.그러나 고객들이 많아지면 관리하기 어렵다!그래서 많은 고객들을 관리하기 위해 useReducer를 사용한다.state는 장부이며, dispatc
useEffect
클래스 컴포넌트에서는 componentDidMount(), componentDidUpdate(), componentDidUnmount() 메서드를 이용해 life cycle을 조절했다.함수 컴포넌트에서는 클래스 컴포넌트처럼 나누어 사용하지 않고 useEffect라는 하
[리액트 쇼핑몰 만들기] useEffect, Ajax
🍎 코딩애플 리액트 기초 강의를 통해 쇼핑몰 만들기 프로젝트를 진행하며 공부한 것들의 기록을 남긴다.
Hooks at a Glance
Hooks는 하위 호환성을 갖고 있습니다. 이번 포스팅에선 우리가 배워볼 hooks의 전반적인 개요를 살펴보겠습니다. 다음 포스팅부터 각각에 대해 자세히 알아볼 것입니다. State Hook 아래 예시는 counter를 렌더링합니다. 버튼을 클릭하면 값을 올려주죠.
Introducing React Hooks
React 16.8부터 도입된 hooks는 state를 비롯한 여러 리액트의 특징을 class없이 사용할 수 있도록 도와줍니다. 이번 시간에는 리액트팀이 왜 hools를 도입했고 어떤 도움을 주는지 살펴보겠습니다.hooks를 시작하기 전, 먼저 살펴볼 특징을 알아보겠습
[React Hooks] useRef
useRef > const = useRef( ); useRef 적용하기 현재 Form.jsx 파일 안의 에 연결된 에 의해 계속해서 렌더링되는 현상이 발생한다. Form.jsx useRef를 사용해서 컴포넌트 내에서 상태값을 유지하면서 DOM에 대한 직접적인