Janu is Developing

click 이벤트들에게 다양한 형태가 있는데 헷갈려서 정리하는 포스트당.... 1. onclick = "handleClick" (괄호 x) 👉 "함수 그 자체(참조)를 전달function handleClick() { console.log('click!')}버튼"클릭되면 handleClick()을 실행해라"= 렌더링시 실행 x, 클릭할 때 실행됨 ✅HTML, Vanilla JS클릭 이벤트가 발생 할 때 실행할 코드로 저장 태그를 통해 전역으로 정의되어 있을 때 '클릭 시 실행'. 반드시 전역으로 선언되어야 함 = Window 객체에서 접근 가능해야 함!window 객체 : 자바스크립트의 내부 객체로 브라우저 창이 열릴 때마다 하나씩 만들어지는 객체. 브라우저 창 안에 존재하는 모든 요소들의 최상위 객체..

네이밍 센스 황당하다... 거 안헷갈리게 지아줘야 하는게 예의 아닌지;이름들이 거기서 거기라 헷갈려서 정리한다Node.js: JavaScript 런타임 환경V8엔진을 기반으로 만들어진 JavaScript 런타임 환경으로, ⭐웹 브라우저 밖에서도 JavaScript 코드를 실행할 수 있도록 해준다. (V8이란 구글이 개발한 JavaScript 엔진으로 C++로 작성되었다고 한다.)Node.js가 개발된 덕에 개발자들은 JavaScript를 통해서 백엔드 개발이 가능해진 것이다. JavaScript로 서버를 구축하거나, 데스크톱 애플리케이션이나, 모바일 앱도 개발할 수 있게된 것이다.또한 Node.js는 다른 언어(C, Java)처럼 컴퓨터에서 직접 코드를 실행할 수 있는 런타임 환경을 제공한다. npm(N..

Vue프로젝트에서 사용하는 vue-query(useQuery)에 대해 공부하기 시작했다.하나하나 뜯어보는것보단 내가 평소에 궁금했던 것들에 답을 하는게 맞는 것 같아서.. 그렇게 해볼려 한다. Vue-Query는 React에서 사용하는 React-Query를 Vue에서 적용할 수 있도록 한 라이브러리이다.서버상태를 관리하며, Vue에서 비동기로 데이터를 가져오고, 캐싱하고, 동기화 하는걸 만들어준다. back단과 데이터를 주고받고 통신할 수 있도록 도와주는 라이브러리라 생각하면 된다.... useQuery란? - SELECT에서 사용, 데이터 조회(GET)데이터를 서버에서 불러오고, 그 결과가 컴포넌트에서 필요할 때 사용하는 Vue Query의 훅(hook).데이터를 가져오는 비동기요청을 캡슐화, 로딩/..

나도 선배 개발자분들처럼 watch로 디버그 하고싶어서 쓰는 글 1. watch란 무엇인가Vue3 Composition API에서 반응형 데이터를 감시하고, 변화가 생길 경우 특정 로직(=콜백함수)를 실행한다.주로 반응형 데이터(ref, reactive)의 변화를 감지하여 사용자가 원하는 작업을 사용하도록 할 수 있다.데이터 변화를 감지 - 특정 작업 트리거비동기 로직 수행(ex. API호출)디버깅에 유용(내가 제일 배우고 싶은 이유!!!!!!1!)불필요한 렌더링 방지 등2. watch의 구조watch(source, callback, options?)source : 감시 대상. 감시할 ref나 reactive, getter함수, 배열로 전달 가능하다.callback : 감지된 변화가 발생했을 때 실행할 ..