항해99 Week3 회고

2022. 2. 6. 23:51코딩공부/항해99

주특기 심화인 이번주는 진짜.. 넘넘 힘들다..

리액트 기초주차보다 힘든주가 없을거라고 생각했는데

슬슬 체력도 떨어지고 컨디션조절을 더 잘해야겠다는 생각이 든다.

마음이 자꾸만 조급해지는데 내가 할 수 있는 선 안에서 최선을 다하겠다는 생각만 가지고

너무 스트레스 받지 말아야겠다ㅠㅠ

아무 생각없이 그냥 공부하자!!

 

 

WIL(What I LEARNED)

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

https://velog.io/@beanlove97/class%ED%98%95-react-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8%EC%9D%98-LifeCycle

 

class형 react 컴포넌트의 LifeCycle

class 형태의 react 컴포넌트에서만 사용가능한 라이프사이클 메서드

velog.io

 

 

- react hooks

Hooks 는 리액트 v16.8 에 새로 도입된 기능이다. 함수형태의 컴포넌트에서 사용되는 몇가지 기술을 Hook이라고 부른다.

함수형 컴포넌트에서도 상태 관리를 할 수 있는 useState, 그리고 렌더링 직후 작업을 설정하는 useEffect 등의 기능 등을 제공한다.

 

그렇다면 왜 굳이 잘 쓰고 있던 클래스형 컴포넌트를 함수형 컴포넌트로 바꿔야할까?

react를 배우는 데에 있어서 클래스는 큰 진입장벽이었다. 코드의 재사용성과 코드 구성을 어렵게 만들고, this의 사용이나 이벤트 핸들러의 등록 등 기본적인 JS 문법 사항을 알아야 다룰 수 있기 때문이다. 또한 클래스는 잘 축소되지 않고, reloading을 깨지기 쉽고 신뢰하기 어렵게 만든다. 따라서 react의 최신 기술들이 클래스형 컴포넌트에 효과적으로 적용되지 않았다.

  • 클래스의 문법이 어렵다.
  • 축소가 어렵다.
  • reloading의 신뢰성이 떨어진다.
  • 최신 기술의 적용이 효과적이지 않다.

→ 이러한 클래스의 단점들을 함수형 컴포넌트로 커버할 수 있다. 하지만 클래스 컴포넌트의 장점인 state 사용이나 life cycle을 직접 다루는 등의 기능을 사용하지 못한다. 이를 해결하기 위해 Hook이 등장했다.



출처: https://devbirdfeet.tistory.com/52 [새발개발자]