NPM - Node Package Manager - Command에서 써드파티 모듈을 설치하고 관리하는 툴 NPM 명령어 - npm init : 새로운 프로젝트나 패키지를 만들 때 사용 (package.json이 생성됨) - npm install package : 생성되는 위치에서만 사용 가능한 패키지로 설치 - npm install -g package : 글로벌 패키지에 추가. 모든 프로젝트에서 사용 가능한 패키지로 설치. @vue/cli - CLI (Command Line Interface) - Vue.js 개발을 위한 시스템으로 Vue.js에서 공식으로 제공하는 cli - 개발의 필수는 아니지만 개발의 편리성을 위해 필수처럼 사용 - Vue 프로젝트를 빠르게 구성할 수 있는 스캐폴딩을 제공 - Vu..
Vue.js의 특징 - Approachable(접근성) - Versatile(유연성) - Performant(고성능) MVVM Pattern - Model + View + ViewModel - Model : 순수 자바스크립트 객체 - View : 웹페이지의 DOM - ViewModel : Vue의 역할 - 기존에는 자바스크립트로 view에 해당하는 DOM에 접근하거나 수정하기 위해 jQuery와 같은 라이브러리 이용 - Vue는 view와 model을 연결하고 자동으로 바인딩하므로 양방향 통신을 가능하게 함. Vue Instance 생성 new Vue({ el: '#app", data: { message: '첫번째 메세지' } }); - el : Vue가 적용될 요소 지정. CSS Selector 또는 ..
Ajax - 웹에서 화면을 갱신하지 않고 데이터를 서버로부터 가져와 처리하는 방법 - javascript의 XMLHttpRequest 객체로 데이터를 전달하고 비동기 방식으로 결과를 조회 - 화면 갱신이 없으므로 사용자 입장에서는 편리하지만, 동적으로 DOM을 구성해야 하므로 복잡 XMLHttpRequest - 자바스크립트가 Ajax 방식으로 통신할 때 사용하는 객체 - 실제 서버와의 통신은 브라우저의 ajax 엔진에서 수행 - readyState 값 의미 설명 0 Uninitialized 객체만 생성( open 메소드 호출 전) 1 Loading open 메소드 호출 2 Loaded send 메소드 호출. status의 헤더가 아직 도착되기 전 상태 3 Interactive 데이터 일부를 받은 상태 4..
jQuery - 복잡하고 방대해진 Ui 코드는 관리를 어렵게 한다. - 이러한 문제는 웹 페이지의 구조(HTML)와 행위(js)그리고 표현(css)을 분리하면 어느 정도 해결할 수 있다. jQuery 특징 - 크로스 플랫폼을 지원하는 제이쿼리는 어떠한 브라우저에서도 동일하게 동작 - 브라우저 호환성을 고려하여 대체코드를 작성할 필요가 없다. - 네이티브 DOM API보다 직관적이고 편리한 API제공하여 개발 속도를 향상 - Event 처리, Ajax, Animation 효과를 쉽게 사용 - 다양한 Effect 함수를 제공하여 동적인 페이지를 쉽게 구현 jQuery 주요 기능 - DOM 탐색과 조작 - 이벤트 바인딩과 처리 - Ajax 프로그래밍 - 다양한 effect 제공 jQuery 기본 구문 - 기본..