Vue

HTML, CSS 그리고 JavaScript를 활용해서 데이터를 볼 수 있게 만들어 줌 이 작업을 통해 사용자(User)는 데이터와 상호작용(Interaction) 할 수 있음대표적인 프론트엔드 프레임워크Vue.js, React, Angular사용자 인터페이스를 만들기

현대 웹 페이지는 페이지 규모가 계속해서 커지고 있으며, 그만큼 사용하는 데이터도 늘어나고 사용자와의 상호작용도 많이 이루어짐결국 Vanila JS만으로는 관리하기 어려움ex) '페이스북 친구가 이름을 수정했을 경우, 화면상에서 변경되어야 하는 것들'타임라인의 이름,

애플리케이션 로직을 UI로부터 분리하기 위해 설계된 디자인 패턴구성요소 Model (Object== data)View (HTML)View Model (DOM과 Data의 중재자)"Vue에서 Model은 JavaScript Object"Object === {key : v

https://kr.vuejs.org/v2/guide/index.html데이터의 흐름url - > views - > templateData가 변화하면 DOM이 변경Data 로직 작성 -> DOM 작성 업로드중..개발자 도구 내부의 Vue탭에서 데이터를 바꾸면

Basic Syntax

Template Syntax

각 Vue 인스턴스는 생성될 때 일련의 초기화 단계를 거침예를 들어 데이터 관찰 설정이 필요한 경우, 인스턴스를 DOM에 마운트 하는 경우, 데이터가 변경되어 DOM을 업데이트하는 경우 등그 과정에서 사용자 정의 로직을 실행할 수 있는 Lifecycle Hooks도 호

기본 HTML 앨리먼트를 확장하여 재사용 가능한 코드를 캡슐화 하는데 도움을 줌CS에서는 다시 사용할 수 있는 범용성을 위해 개발한 소프트웨어 구성 요소를 의미즉, 컴포넌트는 유지보수를 쉽게 만들어 줄 뿐만 아니라, 재사용성의 측변에서도 매우 강력한 기능을 제공처음 개

Vue.js 개발을 위한 표준 도구프로젝트 구성을 도와주는 역할을 하며 Vue 개발 생태계에서 표준 tool 기준을 목표로 함확장 플러그인, GUI, Babel 등 다양한 tool 제공자바스크립트를 브라우저가 아닌 환경에서도 구동할 수 있도록 하는 자바스크립트 런타임

Vue app은 자연스롭게 중첩된 컴포넌트 트리로 구성됨컴포넌트간 부모-자식 관계가 구성되며 이들 사이에 필연적으로 의사소통이 필요함부모는 자식에게 데이터를 전달(Pass Props)하며, 자식은 자신에게 일어난 일을 부모에게 알림(Emit event)부모와 자식이 명

"Vue.js 공식 라우터"라우트(route)에 컴포넌트를 매핑한 후, 어떤 주소를 렌더링할 지 알려줌SPA 상에서 라이퉁을 쉽게 개발할 수 있는 기능을 제공router위치에 대한 최적의 경로를 지정하며, 이 경로를 따라 데이터를 다음 장치로 전향시키는 장치프로젝트 생

"Statement managemetn pattern + Library" for vue.js상태 관리 패턴 + 라이브러리상태(state)를 전역 저장소로 관리할 수 있도록 지원하는 라이브러리상태가 예측 가능한 방식으로만 변경될 수 있도록 보장하는 규칙 설정애플리케이션의

중앙에서 관리하는 모든 상태 정보Vuex는 single state tree를 사용즉, 이 단일 객체는 모든 애플리케이션 상태를 포함하는 "원본 소스(single source of truth)"의 역할을 함이는 각 애플리케이션마다 하나의 저장소만 갖게 된다는 것을 의미함