Component를 만드는 방법에는 Class 와 Function 두가지 방법이 있다.

Class 컴포넌트

Class Component는 리액트에서 제공하는 컴포넌트라는 클래스를 상속(extends)해서 만든다.
=> Class 컴포넌트명 extends Component
state와 lifecycle Method를 사용할 수 있기 때문에 만들고자 하는 컴포넌트가 state를 가지고 있어 주기적으로 상태가 업데이트 되어야 한다면 Class형 컴포넌트를 사용하면 된다.

Function 컴포넌트

Function Component는 함수형으로 만드는 컴포넌트다. state나 라이프사이클 메소드를 사용할 수 없기 때문에 컴포넌트에 상태가 없고 정적으로 동작해도 괜찮다면 함수형으로 간단하게 만들면 된다. 그러나, 16.8버전부터 React Hook이 도입되어 함수 컴포넌트 안에서도 state와 라이프사이클 메소드를 사용할 수 있게 되었다.

React Hook

state와 라이프사이클 메소드가 사용하고 싶다면 class 컴포넌트를 사용하면 되는데 왜 리액트 훅이 도입되었을까?

그이유는 클래스 컴포넌트가 접근하기 어려웠기 때문이다😅
또한, class 컴포넌트는 멤버 변수에 접근할때 this로 접근해야했으며, 바인딩 이슈또한 가지고 있다. 그리고 마운트, 언마운트, 업데이트 등 함수가 기능별로 세분화 되어있어서 코드가 중복되는 경우도 있었기 때문에 리액트 훅이 도입되었다고 볼 수 있다.

그럼 리액트 훅만 배우면 되는거 아닐까?
🙅🏻‍♀️Nop 리액트 훅은 최신버전이라, 기존 프로그램은 클래스로 만들어진 것이 많다. 그래서 클래스 컴포넌트를 이해할 줄 알아야하며, 그다음 리액트 훅을 이해하고 사용할 줄 알면 된다.