functional lifecycle

클래스 컴포넌트를 써보면 불편한 부분이 많음
하지만 클래스 컴포넌트를 사용하는 곳도 많으니 사용할 수 있도록 배워두고
함수형 컴포넌트로 변환하는 방법도 알아두도록 하자.

클래스형 -> 함수형 (변환하기)

componentDidMount() : void{
  console.log("그려지고 나서 실행!!")
}
componentDidUpdate() : void{
  console.log("변경되고 나서 실행!!")
}
componentWillUnmount() : void{
  console.log("사라지기 전에 실행!!")
}

useEffect(() => {  
  console.log("그려지고 나서 실행!!")
}, []);
useEffect(() => {  
  console.log("변경되고 나서 실행!!")
});
useEffect(() => {   
  return () => {     
    console.log("사라지기 전에 실행!!")
  }
}, []);

이런식으로 변경 할 수 있으며

useEffect(() => {   
  console.log("그려지고 나서 실행!!")
  return () => {     
    console.log("사라지기 전에 실행!!")
  }
});

하나로 합칠수도 있다.