4주차 간략 정리
- redux를 들어갔다.
- redux를 사용해 개인 과제 redux-todolist를 만들었다.
- 4주차의 팀과 헤어지며 새로운 팀을 만났다.
- redux toolkit, thunk, json-server등등 공부중
- 팀프로젝트 coming soon
- 멘탈 가루, 눈물광광
반성할점
- 여전히 시간관리를 잘 못하고있다 잘하자
- 닮고 싶고, 배우고 싶은 사람들을 보며 좋은 자극을 받는 동시에 너무 조급해하고있다.
- 멘탈이 너무 약하다, 너무 예민했다 이번주 ㅠ죄송합니다 내 주변사람덜
- github도 velog도 잘하고싶다 근데 둘다 열심히안하고 있는 아주 재미있는 상황
개선해야될점, 다음주 목표
- 시간은 금이다, 조급해하면서 아무것도 안하기 혹은 효율적이지 않은 행동하기 멈춰줘
- 그날 잡은 목표 미루기 그만!!!!!!!!!!!!!
- 프로젝트 잘 완성하기
- 제발 우리조 행복하게 마무리되게 해주세요 plz
이번주의 키워드
LifeCycle
라이프 사이클은 컴포넌트가 렌더링을 준비하는 순간부터, 페이지에서 사라질 때까지를 나타낸다. 아래 표는 리액트 컴포넌트의 라이프 사이클을 보여준다.
리액트는 클래스형과 함수형으로 컴포넌트를 생성할 수 있는데, 주로 함수형 컴포넌트가 많이 사용된다.
이제 클래스형은 사용하지 않는다고 리액트에서 공식 발표를 했다고 한다.
함수형 컴포넌트의 가장 큰 장점으로는 간단하게 함축적인 프로그래밍이 가능하다는 것
클래스형 라이프사이클
render() 메소드와 Component 상속 필수
state, props 사용이 불편하고, 많은 메모리 사용한다는 단점이 있다.
함수형 라이프사이클
간편한 컴포넌트 선언 및 프로그래밍 가능 React Hook을 사용
state와 생명주기(Life Cycle) 메소드를 별도로 구현해야 함 => useState, useEffect 사용
react hooks
Hooks 는 리액트 v16.8 에 새로 도입된 기능이다. 함수형태의 컴포넌트에서 사용되는 몇가지 기술을 Hook이라고 부른다.
함수형 컴포넌트에서도 상태 관리를 할 수 있는 useState, 그리고 렌더링 직후 작업을 설정하는 useEffect 등의 기능 등을 제공한다.
그렇다면 왜 굳이 잘 쓰고 있던 클래스형 컴포넌트를 함수형 컴포넌트로 바꿔야할까?
react를 배우는 데에 있어서 클래스는 큰 진입장벽이었다. 코드의 재사용성과 코드 구성을 어렵게 만들고, this의 사용이나 이벤트 핸들러의 등록 등 기본적인 JS 문법 사항을 알아야 다룰 수 있기 때문이다. 또한 클래스는 잘 축소되지 않고, reloading을 깨지기 쉽고 신뢰하기 어렵게 만든다. 따라서 react의 최신 기술들이 클래스형 컴포넌트에 효과적으로 적용되지 않았다.
클래스의 문법이 어렵다.
축소가 어렵다.
reloading의 신뢰성이 떨어진다.
최신 기술의 적용이 효과적이지 않다.
→ 이러한 클래스의 단점들을 함수형 컴포넌트로 커버할 수 있다. 하지만 클래스 컴포넌트의 장점인 state 사용이나 life cycle을 직접 다루는 등의 기능을 사용하지 못한다. 이를 해결하기 위해 Hook이 등장했다.
- Hook은 함수형 컴포넌트가 클래스형 컴포넌트의 기능을 사용할 수 있도록 해주는 기능이다.
- useState와 useEffect를 사용하여 특징적으로 state와 lifecycle과 같은 기능을 사용 가능하게 해준다
