김도리의 개발자로서 성장기

useEffect 리액트 컴포넌트가 렌더링될 때마다 특정 작업을 수행하도록 설정할 수 있는 Hook이다. (클래스형 컴포넌트의 componentDidMount와 componentDidUpdate를 합쳤다고 봐도 무방하다.) import { useEffect } from 'react'; useEffect(() => { ... }); 이렇게 사용하면 렌더링 될 때마다 ... 코드가 실행된다. 화면에 맨 처음 렌더링될 때(마운트)만 실행하고 싶을 때 useEffect(() => { ... }, []); 함수의 두번째 파라미터로 빈 배열을 넣어주면 된다. (단, 개발 환경에서만 useEffect가 두번 호출 될 수 있다.) 특정 값이 업데이트될 때만 실행하고 싶을 때 특정 값이 바뀔때마다 특정 작업을 수행해야 ..

Hooks 리액트 v16.8에 새로 도입된 기능 useState 함수형 컴포넌트에서도 상태 관리를 할 수 있게 해줌 1. 배열 비구조화 할당 배열 안에 들어있는 값을 쉽게 추출할 수 있도록 해주는 문법 const array = [1, 2]; const one = array[0]; const two = array[1]; 다음 코드는 array 안에 있는 값을 one과 two에 담아주는 코드이다. 이를 배열 비구조화 할당을 사용하면 const array = [1, 2]; const [one, two] = array; 이렇게 표현할 수 있다. 2. useState 사용하기 import { useState } from 'react'; import 구문을 통해 불러오며 아래와 같이 사용한다. const [valu..