[Hooks] 1. 사용법 배우기

 

노마드코더

 

www.youtube.com/playlist?list=PL7jH19IHhOLOagok7uFWKlOleLF64grb6

 

---

리액트 훅은 리액트의 신박한 기능인데, state, component에 대한 것들을 많이 바꿔놓는다.

결론적으로 말하자면 functional component에서 state를 가질 수 있게 해준다.

앱을 리액트 훅으로 만든다면 class component, did mount, render 이런 것들을 안해도 된다.

모든것은 하나의 function이 되는것이다. (함수형 프로그래밍)

 

아주 많은 사람들이 그들의 Hooks를 공유한다.

hooks의 구조와 쉽게 hooks를 만들 수 있는 사실 자체가 사람들이 자신의 hooks를 공유하도록

권장하고 격려한다고 생각한다.

 

---

간단한 카운트를 만들어보자.

---

이제 함수를 만들어서 카운트를 늘려나갈거다.

---

코드를 보면 많은것을 필요로 한다. 

Class component가 필요하고, State도 필요하고 또 그걸 정의하고 넘겨줘야 된다.

그럼 리액트 훅을 사용하면 어떻게 다를까?

 

어떻게 이걸 함수형 프로그래밍으로 바꾸고

클래스에서 벗어나서 함수에 머물수가 있는가? this를 안하는 방법은?

---

useState는 2개를 준다. 하나는 value, 두 번째는 이를 변경하는 방법.

useState는 주는것이 array 이므로, const [count, setCount] 로 작업을 한다.

 

다시 말하자면, useState는 array를 리턴한다. 그리고 그 array의 첫 번째 요소는 value이고,

이는 0에서 시작한다. 두 번째는 set count이다. (count, setCount의 이름은 변경이 가능하다.)

---

---

훅에는 Effect Hook 이라는 것도 있다.

이건 component did mount, did update와 비슷하다.

이들은 주로 API에서 데이터를 요청할때 사용된다.

 

---

 

 

 

 

 

 

 

※ 본 포스팅은 개인 공부 기록을 목적으로 남긴 글이며 본 사실과 다른 부분이 있다면 과감하게 지적 부탁드립니다.