신비한 개발사전

Konva는 HTML의 요소를 쓰기 쉽게 만들어주는 라이브러리다. 캔버스 안에 오브젝트 하나 그리려고 일일이 lineTo()와 moveTo()를 쓰지 않아도 되는 편리함을 제공한다.  관련 라이브러리는 Konva 외에도 Fabric.js, EaselJS 등 다양하지만 Konva를 선택한 이유는 리액트에서 사용할 때 깔끔해 보여서다. Fabric.js가 제일 인기있는 모양이지만 샘플 코드에서 useEffect를 쓰는 것을 보고 Konva를 써보기로 했다. * 리액트에서 Konva를 쓰려면 konva와 react-konva 둘 다 설치해야 한다. 기본 구조Konva의 캔버스는 컨테이너인 컴포넌트 안에 각 그림을 컴포넌트별로 나뉘는 구조를 갖고 있다. 캔버스 오브젝트는 이 와 의 영역 안에 구현한다. ..