Weekly I Learn (라이프사이클, react hooks)

1.라이프사이클(클래스형 vs 함수형).

Lifecycles in Class Components (클래스형)

• 생성될 때 (마운트 될 때 - Mounting) : constructor, render, componentDidMount
• 업데이트할 때(Updating) : render, componentDidUpdate
• 제거할 때 (마운트 해제 될 때 - Unmounting) : componentWillUnmount

---

Lifecycles in Class Components (함수형)

• 함수형 컴포넌트에는 "리액트 훅"이 있는데, 훅으로 함수형 컴포넌트들을 관리합니다.클래스형 라이프사이클에 나왔던 모든 phases( componentDidMount, componentDidUpdate, componentWillUnmount)는 useEffect Hook에 의해 실행됩니다.
• 참조링크

---

2.react hooks

---

1. React Hooks란?

• React Hooks은 리액트의 새로운 기능으로 React 16.8버전에 새로 추가된 기능으로 state, component에 대한 것들을 바꿔놓았다.

• 예를 들면 function component에서 state을 가질 수 있게 된 것

• 만일 앱을 react hook을 사용하여 만든다면 class component, render 등을 안해도 된다는 뜻이다.

• 모든 것은 하나의 function이 되는 것 함수형 프로그래밍이 가능해지는 것

• 참조링크

2. useState

• useState 는 가장 기본적인 Hook 으로서, 함수형 컴포넌트에서도 가변적인 상태를 지니고 있을 수 있게 해줍니다. 만약에 함수형 컴포넌트에서 상태를 관리해야 되는 일이 발생한다면 이 Hook 을 사용하시면 됩니다.

3. useEffect

• useEffect 는 리액트 컴포넌트가 렌더링 될 때마다 특정 작업을 수행하도록 설정 할 수 있는 Hook 입니다. 클래스형 컴포넌트의 componentDidMount 와 componentDidUpdate 를 합친 형태로 보아도 무방합니다.