Simple & Standard

vue ui Vue 프로젝트 매니저 실행시 화면 Vue 프로젝트 생성 수동(Manually select features)을 선택 Choose Vue version, Babel, Route, Vuex, Linter / Formatter 선택 Vue version → ‘3.x(Preview)', Linter/Formatter → ‘ESLint + standard Config', Lint on save 선택7. 프로젝트 대시보드

터미널에서 명령어로 프로젝트 생성 vue craete {프로젝트명} Manually select features 선택 & 프로젝트에 필요한 features를 선택(space) 후 완료(enter) Chose Vue version : Vue 버전 선택 Babel : ES6 버전 이상이나 타입스크립트로 코딩시 범용적인 ES5 버전으로 자동전환 지원 TypeScript : 타입스크립트 지원 Progressive Web App (PWA) Support : 웹앱 개발 지원 Router : 라우터 처리를 위한 Vue-Router Vuex : Vue에서 상태관리를 위한 패키지인 Vuex CSS Pre-processors : Sass, Less, Stylus 등 CSS 작성을 위한 CSS 전처리기 Linter/Form..

package.json { "name": "vue-prj", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, "dependencies": { "core-js": "^3.6.5", "vue": "^2.6.11" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.5.0", "@vue/cli-plugin-eslint": "~4.5.0", "@vue/cli-service": "~4.5.0", "babel-eslint": "^10.1.0", "esl..

node_modules : npm으로 설치된 패키지 파일들이 모여있는 디렉토리 public : 웹팩(webpack)을 통해 관리되지 않는 정적 리소스가 모여 있는 디렉토리 src/assets : 이미지, css, 폰트 등을 관리하는 디렉토리 src/components : Vue 컴포넌트 파일이 모여 있는 디렉토리 App.vue : 최상위(Root) 컴포넌트 main.js : 가장 먼저 실행되는 자바스크립트 파일로써, Vue 인스턴스를 생성하는 역할 .gitignore : 깃허브에 업로드 할 때 제외할 파일 설정 babel.config.js : 바벨(Babel) 설정파일 package-lock.json : 설치된 package의 dependency 정보를 관리하는 파일 package.json : 프로젝트에..

Vue.js SPA(Single Page Application) 개발을 위한 프론트엔드 프레임워크이다. 장점 직관적이고 배우기 쉽다. 재사용을 통한 애플리케이션을 개발 기간 단축 및 양질의 코드를 생산할 수 있다. Angular의 장점(데이터 바인딩)과 React의 장점(가상 돔)을 모두 가지고 있다. 특징 MVVM 패턴 사용 MVVM(Model-View-ViewModel) 프로그래밍 로직과 화면에 해당하는 view를 분리해서 개발하기 위해 설계된 패턴 웹에서는 HTML DOM이 View, 자바스크립트가 Model 역할을 함 MVVM패턴은 View와 Model 중간에 ViewModel을 둠으로써 데이터 바인딩 처리 및 가상 DOM을 통한 성능 및 개발의 편의성을 제공하기 위해 만들어짐 컴포넌트(Compo..