개성있는 개발자 되기

created: function() { this.$validator.extend('customRule', { getMessage: function(field, args) { return '오류 메세지'; }, validate: function(value, args) { // 체크 로직 return true; } }); } 추가한 룰 이름으로 v-validate 속성에 넣어준다. 스크립트 상으로도 추가할 수 있다. this.$validator.attach('help', 'customRule'); 다양한 Vee-validate 커스터마이징 방법 vee-validate.logaretm.com/v2/guide/custom-rules.html#require-like-rules Custom Rules | VeeVa..

Vue Cli는 Vue.js 애플리케이션을 빠르게 개발할 수 있는 관련된 기능을 모두 제공하는 Vue.js개발 도구이자 시스템이다. 다양한 플러그인과 프리셋을 로딩하여 프로젝트의 초기 설정과 개발을 손쉽게 할 수 있도록 도와준다. 1. Vue CLI의 구성요소와 설치 Vue CLI는 크게 3가지의 구성요소로 이루어져 있다. CLI : @vue/cli → vue 명령어를 실행할 수 있도록 한다. vue 명령어로 새로운 vue 애플리케이션 프로젝트를 생성할 수 있다. vue 단일 파일 컴포넌트를 설정 없이 실행하여 테스트할 수 있음 GUI 환경으로 프로젝트를 생성하거나 관리할 수 있음 CLI 서비스 :@vue/cli-service → 프로젝트가 생성될 때 개발 의존성으로 설치되는 구성요소이다. CLI 서비스..

지금까지 HTML 파일에서 태그로 vue.js 라이브러리를 직접 참조하여 예제를 작성했다. 하지만 이 방법으로는 대규모 앱을 개발하기 힘들다. 대규모 앱을 개발하려면 SPA(Single Page Application) 구조여야 하는데, Vue.js 기반의 SPA 애플리케이션을 개발하려면 Vue Router, Vuex 등의 다양한 요소가 필요하다. 이들을 이용하기 위해서 ECMAScript2015나 Typescript 등을 사용해야 하는데, 이번 장에서는 ES2015 표기법에 대해 알아본다. 1. ES2015를 사용하기 위한 프로젝트 설정 Babel을 프로젝트에서 사용하기 위해 설정이 필요하다. * Babel : 대표적인 트랜스파일러로서, ES2015, TypeScript 코드를 오래된 브라우저에서도 사용..

Vue.js의 강력한 기능 중 하나는 컴포넌트이다. 대규모 애플리케이션을 작성할 때 컴포넌트의 장점이 있다. 뛰어난 재사용성 한 애플리케이션 내부에서 사용되는 UI와 기능은 반복되는 것이 꽤많다. 반복되는 부분을 컴포넌트(템플릿)로 작성해두면 여러 곳에서 재사용 가능하다. 용이한 테스트 컴포넌트 단위로 기능을 테스트할 수 있다. Karma, Mocha, Jest와 같은 단위테스트 도구를 이용해 쉽게 테스트할 수 있다. http://jestjs.io/, https://karma-runner.github.io/1.0/index.html, https://mochajs.org/ Mocha - the fun, simple, flexible JavaScript test framework Mocha is a feat..