paintJS

id는 JS작업, class는 CSS 작업에 이용@import "reset.css"; canvass와 div(컨트롤) 크게 2가지 부분으로 나뉨input range 추가하여 브러쉬 크기 조절, value:기본값

누군가 캔버스에 마우스를 올리면 그것을 감지하는 작업이벤트리스너 mousemove 적용윈도우 전체 범위 내 마우스 위치값 client는 무시 캔버스 내 마우스 위치 좌표값 offset 필요 캔버스를 클릭하는 순간을 인지하고, 페인팅을 시작하는 작업이벤트리스너 mouse

\-colors 배열의 각 요소에 대하여 (forEach 함수 적용하여) 클릭 이벤트 발생시 ctx.strokeStyle 가 클릭된 color로 변경 됨\-range 이벤트는 input에 반응한다. ctx.lineWidth 를 size로 지정 fillfill 버튼 클릭

canvas는 pixel을 다루기 때문에 기본적으로 이미지를 만든다. 그래서 save 파트는 빌드인 되어있다. 발견되는 버그 하나는 페인트 한 후 저장하면 이미지 배경이 투명으로 저장된다. 캔버스의 배경색을 설정해주지 않았기 때문이다. html의 배경색만 설정해줬을 뿐

\*\* VSC 콘솔에서 바로 커밋하기1단계: git add .2단계: git commit -m "커밋 문구 입력"3단계: git push origin master깃에서 저장소 생성할 때 readme.md를 포함하여 생성했다. 터미널 입력 :cd Documentsgit