La vie est belle

🔎 컴포넌트 (Component) 란? ▪️ Vue의 가장 강력한 기능 중 하나이다. ▪️ HTML Element를 확장하여 재사용 가능한 코드를 캡슐화. ▪️ Vue Component는 Vue Instance이기도 하기 때문에 모든 옵션 객체를 사용. ▪️ Life Cycle Hook 사용 가능. ▪️ 전역 컴포넌트와 지역 컴포넌트. 안에는 root element가 한 개만 올 수 있다. 💡 컴포넌트간 통신. ▪️ 상위(부모)-하위(자식) 컴포넌트 간의 data 전달 방법. ▪️ 부모에서 자식 : props라는 특별한 속성을 전달. (Pass Props) ▪️ 자식에서 부모 : event로만 전달 가능. (Emit Event) 부모는 자식에게 데이터를 전달할 수 있지만, 자식은 부모에게 데이터를 전달할..

✔️ Vue event. ▪️ DOM Event를 청취하기 위해 v-on directive 사용. ▪️ inline event handling. ▪️ method를 이용한 event handling. ✔️ Vue event 청취 : v-on ▪️ v-on directive를 사용하여 DOM 이벤트를 듣고 트리거 될 때 JavaScript를 실행할 수 있다. ✔️ Method Event Handler. ▪️ 이벤트 발생시 처리 로직을 v-on에 넣기 힘들다. 이때문에 v-on에서는 이벤트 발생시 처리해야 하는 method의 이름을 받아 처리한다. 이벤트 메서드에 함수만 작성하게 된다면, 내부적으로 event 객체를 넘겨준다. ✔️ 이벤트 수식어 (Event Modifier). 수식어는 점으로 표시된 접미사..

JSON JavaScript Object Notation 자바 스크립트의 객체 표기법 문자 데이터 JSON 데이터 사용 방법 json 확장자를 가진 파일은 문자(string) 데이터이다. json의 문자 데이터를 가지고 오면, 자동으로 변환되서 실제 객체 데이터처럼 출력이 된다. 1. Object to JSON - stringify(obj) // JavaScript Object Notation // 1. Object to JSON // stringify(obj) let json = JSON.stringify(true); console.log(json);// true json = JSON.stringify(['apple', 'banana']); console.log(json); // ["apple", "b..

▣ XMLHttpRequest(서버통신객체) xhr ▣ 속성) readyState : 0 (아무상태아님) -------요청--------------- 1 (open메소드호출-URL요청) 2 (send메소드호출-파라미터전달) -------응답--------------- 3 (요청한 데이터를 일부분 받는 중) 4 (요청한 데이터를 전체 받았을때) ------------------------- onreadystatechange : 이벤트속성(readyState값이 변경되었을때를 이벤트!!) status : 서버의 상태 (예==> 200:정상상태 403:요청 권한 없음 404:요청 페이지 없음 405:요청한 메소드(doGet, doPost)가 준비되지 않았음 500:요청한 페이지가 서버에서 실행 중(runtim..

라이브러리란? (library) jQuery란? 외부 라이브러리 사용방법 1. 직접 서비스 하는 경우 2. 구글의 자바스크립트 라이브러리를 사용하는 경우 (CDN) 기본문법 $$(선택자).action(할일); ===> 할 일은 익명의 함수객체로 표현 function(){} action=이벤트함수 $('선택자').action(function(){}); $('a.b') 엘리먼트 중 인 엘리먼트 들 ==> 태그 $('a,b') 또는 엘리먼트 들 ==> 태그, 태그 $('a b') 를 부모로 갖는 엘리먼트들 ==> 태그 a:조상 b:후손 $('a > b') 를 부모로 갖는 엘리먼트들 ==> 태그 a:부모 b:자식 $('[href]') 현재 속성값으로 href속성이 있는 엘리먼트 들 예) 텍스트 : 미적용 텍스트..