패스트캠퍼스 챌린지 31일차 - 한 번에 끝내는 React의 모든 것 초격차 패키지 Online

수강 인증샷

 

---

패스트캠퍼스 챌린지란?

 패스트캠퍼스에서 진행하는 '50일 공부 루틴 챌린지' 행사로 50일 동안 매일 수강 인증샷과 함께 학습 기록을 게시글로 남기는 행사다.

---

31일차

 

 31일차에는 30일차에 모두 적지 못했던 Part 1. React 기초 Ch 03. React 공식 문서로 디테일잡기(고급) 챕터에서 01. Hooks 1 강의 내용 나머지에 대해 기록하려 한다.

 Part 1. React 기초 Ch 03. React 공식 문서로 디테일잡기(고급) 챕터에서 01. Hooks 1 강의에서 Hook에 대한 내용을 예시를 통해 배워보는 시간을 갖는다. 먼저 State Hook인 useState에 대해 공부하자면 useState는 현재의 state 값과 이 값을 업데이트하는 함수를 쌍으로 제공한다. 따라서, 이 함수를 이벤트 핸들러나 다른 곳에서 호출할 수 있다. 또한, useState는 인자로 초기 state값을 받는다. Hook은 함수 컴포넌트에서 React state와 생명주기 기능을 연동할 수 있게 해주는 함수이다. 다음으로 Effect  Hook인 useEffect에 대해 공부하자면 React 컴포넌트 안에서 데이터를 가져오거나 구독하고, DOM을 직접 조작하는 작업과 같은 동작을 side effect 짧게 말해 effect라고 하는데, useEffect는 함수 컴포넌트 내에서 이런 side effect를 수행할 수 있게 도와준다. 즉, 클래스의 componentDidMount나 componentDidUpdate, componentWillUnmount와 같은 목적으로 제공되지만 하나의 API로 통합되는 것이다. 따라서, useEffect를 사용하면, React는 DOM을 바꾼 뒤에 effect 함수를 실행할 것이다. 또, Effects는 컴포넌트 안에 선언되어 있기 때문에 props와 state에 접근할 수 있다.

 

---

본 게시글은 이벤트 참여를 위해 작성된 게시글입니다.

 

---

패스트캠퍼스 공식 홈페이지 : https://bit.ly/37BpXiC