[React] Hooks: useEffect() 함수

리액트 컴포넌트에서는 클래스형 컴포넌트(class component)와 함수형 컴포넌트(function component)로 나뉜다. 클래스형 컴포넌트는 함수형 컴포넌트에 비해 가지는 단점들이 몇가지 있다.

• 클래스 문법이 어려움
• 축소가 어려움
• 로직의 재사용이 어려움
• 최신 기술의 적용이 효과적이지 않다

이러한 단점들을 제외하고는 state나 라이프 사이클 메소드 를 사용하기 위해서는 클래스형 컴포넌트 사용이 더 편리하다고 한다.

→ 그래서 등장한 것이 함수형 컴포넌트!

그러나, 함수형 컴포넌트만 사용하려고 하는데 클래스형 컴포넌트에서만 사용가능한 state나 Life Cycle Method 를 함수형 컴포넌트에서 사용하지 못하는 문제점 때문에 Hook API가 생겨남!!!

정리하자면,

• 리액트 Hook 은 함수형 컴포넌트가 클래스형 컴포넌트의 기능을 사용할 수 있도록 해주는 기능이다
• 함수형 컴포넌트에서도 상태 관리를 할 수 있는 useState나 렌더링 직후 작업을 설정하는 useEffect 등의 기능을 제공한다
  • useState
  • useEffect

Reference

• https://velog.io/@yangddu/React-Hook