더북(TheBook)

지금까지 살펴본 UI는 사용자 상호작용 없이 그저 데이터를 보여주는 것이 전부였다. 예를 들어 앞서 만들었던 시계 컴포넌트에서 시간대를 설정하는 등의 사용자 입력을 받는 기능은 없었다.

정적인 UI를 사용하는 경우는 많지 않다. 사용자 조작에 반응할 수 있는 영리한 UI를 만들어야 하는 경우가 대부분이다. 클릭이나 드래그 같은 사용자 입력은 어떻게 처리할 수 있을까?

이 장에서는 React에서 이벤트를 다루는 방법을 살펴본다. 이벤트에 대한 지식은 7장에서 살펴볼 폼과 폼 요소를 다루는 데도 필요하다. 앞서 언급했지만 React는 특정 이벤트만을 지원하므로 React가 지원하지 않는 이벤트를 다루는 방법도 살펴보겠다.

Note

이 장의 예제 코드는 https://github.com/gilbutITbook/006961 또는 https://github.com/azat-co/react-quickly/tree/master/ch06에서 확인할 수 있다(깃허브 저장소 https://github.com/azat-co/react-quickly의 ch06 폴더다).

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.