React component life cycle

리액트가 최소 단위로 컴포넌트를 사용하는 만큼 필수적으로 알아야하는 항목에
컴포넌트 생명주기에 대한 질문이 많다고 들었습니다 
 

컴포넌트 생명주기는 

컴포넌트의 생성(mount) , 변경(update) , 제거(unmomunt) 가 있으며 기존의 프로젝트 진행시에는 useEffect로 처리했습니다 
 
chat GPT나 구글검색을 통해 정보를 보면  다양한 함수들이 있는데 막상 사용할때 보면 useEffect로 모두 처리하는것에 의아함을 느껴 찾아보았습니다 
 
2019년 이전 리액트에는 함수형컴포넌트 방식에서는 라이프사이클 API와 state를 사용할수 없었기에 클래스형 컴포넌트을 주로 사용했었고 
 
이후 리액트 훅의 도입으로 함수형 컴포넌트에서의 문제가 해결되면서
함수형 컴포넌트가 클래스형 컴포넌트 보다 선언하기 편하고 메모리자원 소모가 적다는 점에서 장점이 있었고
공식문서에서도 함수형 컴포넌트와 훅을 사용할 것을 권장하고 있습니다.
 
하지만 오래된 리액트 코드는 클래스형 컴포넌트일 경우도 있을 수 있어 아래에 표로 정리했습니다. 
 
 

분류	클래스형 컴포넌트	함수형 컴포넌트
Mounting	constructor()	함수형 컴포넌트 내부
Mounting	render()	return
Mounting	ComponenDidMount()	useEffect()
Updating	componentDidUpdate()	useEffect()
UnMounting	componentWillUnmount()	useEffect()