Day 38
사용자 정의 Hook 연습하기 (11) : useAsync
- 비동기 로직을 제거하기 위해 사용되는 훅
- 네트워크 로직이나 timeout같은 로직이 있을 때 사용할 수 있다.
사용자 정의 Hook 연습하기 (12) : useHotKey
- 복잡한 단축키를 지원하기 위해 만들어진 훅
- 전체 검색을 위해 ctrl + shift + f, command + shift + f4 등의 단축키등을 구현할 수 있게 해준다.
컴포넌트 연습하기 (20) : Modal
- 보통 pop-up이라고도 부르는데 페이지 내의 이벤트를 통해 별도 정보를 페이지 이동없이 보여주고 싶을 때 사용한다.
- react portal이라는 걸 사용해서 modal 요소를 dom tree의 최상단으로 옮겨준다.
컴포넌트 연습하기 (21) : Toast
- 보통 알림을 띄울 때 많이 사용하는 컴포넌트이다.
- 별로 클래스를 만들어서 사용한다.
- portal은 해당 컴포넌트를 어디에 넣을 것인지 결정하는 것이다.
- portal 자체를 넣으려면
ReactDOM.render()를 사용해야 한다.
사용사례 (4) : 그림판
- HTML canvas를 이용한 간단한 그림판을 구현한다.
- library를 제작하는 듯이 확장가능한 형태로 제작한다.
- pen, eraser, dash 기능과 color를 선택할 수 있는 기능을 추가한다.