전체 글53 Vuex- 주요 기술 요소 Vuex 기술 요소 - state : 여러 컴포넌트에 공유 되는 데이터 data - getters : 연산된 state 값을 접근하는 속성 computed - mutations : state값을 변경하는 이벤트 로직, 메서드 methods - actions : 비동기 처리 로직을 선언하는 메서드 aysnc methods *state란? - 여러 컴포넌트 간에 공유할 데이터 = 상태 // vue data : { massage : " hello vue.js"; } //Vuex state : { message : "hello vue.js"; } {{message}} {{this.$store.state.message}} *getters란? : state 값을 접근하는 속성이자 computed(.. 2021. 5. 3. ES6 for Vue.js - Modules Modules : 자바스크립트 모듈화 방법 -자바스크립트 모듈 로더 라이브러리 (AMD, Commons JS)기능을 js 언어 자체에서 지원 -호출되기 전까지는 코드 실행과 동작을 하지 않는 특징이 있음 * Vuex : 상태 관리 라이브러리 개요 -복잡한 애플리케이션의 컴포넌트들을 효율적으로 관리하는 Vuex라이브러리 소개 -Vuex 라이브러리의 등장 배경인 Flux패턴 소개 -Vuex 라이브러리의 주요 속성인 state, gatters, mutations, actions 학습 -Vuex를 더 쉽게 코딩할 수 있는 방법인 Helper기능 소개 -Vuex로 프로젝트를 구조화하는 방법과 모듈 구조화 방법 소개 목차 -Vuex 라이브러리 소개 -Flux 패턴 소개 -Vuex 컨셉과 구조 -Vuex .. 2021. 4. 30. ES6 for Vue.js - Enhanced Object Literals (향상된 객체 리터럴) - Enhanced Object Literals : 향상된 객체 리터럴 1. 객체의 속성을 메서드로 사용할 때 function예약어를 생략하고 생성 가능 var dictionary = { words : 100, //ES5 lookup : function (){ console.log("find words"); }, //ES6 lookup(){ console.log("find words"); } } 2. 객체의 속성명과 값 명이 동일할 때 아래와 같이 축약 가능 예시1) var figures = 10; var dictionary = { // figures : figures figures }; 예시2) components: { 'TodoFooter' : TodoFooter, 'TodoHead.. 2021. 4. 30. ES6 for Vue.js - 화살표 함수 Arrow Function : 화살표 함수 -함수를 정의할 때 fucntion 이라는 키워드를 사용하지 않고 =>로 대체 -흔히 사용하는 콜백 함수의 문법을 간결화 1. 기본 사용법 // 매개변수 지정 방법 () => { ... } // 매개변수가 없을 경우 x => { ... } // 매개변수가 한 개인 경우, 소괄호를 생략할 수 있다. (x, y) => { ... } // 매개변수가 여러 개인 경우, 소괄호를 생략할 수 없다. // 함수 몸체 지정 방법 x => { return x * x } // single line block x => x * x // 함수 몸체가 한줄의 구문이라면 중괄호를 생략할 수 있으며 암묵적으로 return된다. 위 표현과 동일하다. () => { return { a: 1 }.. 2021. 4. 30. ES6 for Vue.js - const & let ES6 = 최신의 자바스크립트 문법 ES6란? -ECMAScript 2015와 동일한 용어 -2015년은 ES5(2005)이래로 진행한 첫 메이저 업데이트가 승인된 해 -최신 Front-End Framework인 React, Angular, Vue에서 권고하는 언어 -ES5에 비해 문법이 간결해져서 익숙해지면 코딩을 훨씬 편하게 할 수 있음 Babel 역할 -구 버전 브라우저 중에서는 ES6의 기능을 지원하지는 않는 브라우저가 있으므로 transpiling이 필요 -ES6의 문법을 각 브라우저의 호환 가능한 ES5로 변환하는 컴파일러 babeljs.io/ Babel · The compiler for next generation JavaScript The compiler for next generation.. 2021. 4. 29. 이전 1 ··· 6 7 8 9 다음
