목록JavaScript (18)
음악, 삶, 개발
div 에서 drag 하기 : window.addEventListener
https://stackoverflow.com/questions/36993834/add-vue-js-event-on-window 위와 같이, 드래그를 시작하면, 창 바깥으로 나가도 드래그는 작동해야한다. drag 이벤트는 불행히도, drag & drop 을 위한 이벤트여서 mousedown, mouseup, mousemove 를 조합해야한다. 이때 중요한것은 @mousedown 만이 태그안에 들어가 호출되고, mousedown 이 되었을대, mousemove 과 mouseup 의 이벤트 리스너가 내가 만든 함수로 등록되고, mouseup 에서는 해당 리스너들을 다시 제거해주어야한다.
props 설정후 사용하기 : camelCase 와 kebab-case
props 를 정의할때는 camelCase props 를 사용할때는 kebab-case 또한, props 를 설정하였다면 사용하기위해 반드시 setup(props) 와 같이 인자로 props 를 넘겨야한다. Hello World 로 정의후.. 에서 사용.
reactive 함수를 활용한 DOM 리랜더링
reative 함수의 인자로 넘어가는 데이터는, 이 데이터의 어딘가가 변경되었을때, 해당 데이터를 사용하는 DOM 을 다시 랜더링하게 한다. click {{ state.value }}
lodash 4.17.15 npm i lodash {{ v }}
React JS 시작! "Hello React"
React JS 를 공부를 하게되었다. (React Native 아님) Max For Live 의 UI 를 웹 기술을 사용하여 만들어보고싶었기때문이다. 내가 이런 생각을 할수있었던 이유는 Max 8 이후부터 Node.js 를 지원하기때문이다. 한마디로 HTML, CSS, JavaScript 를 사용하여 UI 를 만들어보겠다는 이야기다. 사실 모든 M4L 개발자들은 Max 에서 제공하는 UI 를 가지고만 만든다. 이게 제일 쉽고 또, Ableton Live 와의 연동성도 가장 뛰어나기때문이다. 하지만 그만큼 나만의 멋진 디자인 또는 유니크한 기능을 만들어낼수는 없는 큰 한계점을 가지고있다. 버튼이나 슬라이더를 이야기하는게 아니다. 근사한 피아노롤을 만들수있을까? Ma..