main.js import { createApp } from 'vue' import App from './App.vue' import router from './router' import store from './store' createApp(App).use(store).use(router).mount('#app') 위에서 router와 store를 사용하기 위해 use 메소드 안에 넣어줬다. App.vue Home | About 라우터가 있는 프로젝트를 생성하면 다음과 같이 Home과 About 메뉴가 생성되고 그 메뉴를 보면 각각 router-link가 있다. Home은 / , About 은 /about으로 연결되어 있다. 이것을 실제 화면에서 f12 눌러서 소스를 보면 a태그로 나오고 to 속성은 ..

vue create 프로젝트 이름을 입력하면 Manually 로 시작하는게 있다. 그게 수동으로 설정을 해서 프로젝트를 만드는 거다. 수동 생성을 하면 다음과 같이 어떤것들을 사용할건지 고르는게 나온다. 선택은 스페이스바를 통해 선택가능하고 한번 더 누르면 선택 해제된다. ? Please pick a preset: Manually select features ? Check the features needed for your project: (Press to select, to toggle all, to invert selection, and to proceed) >(*) Babel ( ) TypeScript ( ) Progressive Web App (PWA) Support ( ) Router ( ) V..

main.js import { createApp } from 'vue' import App from './App.vue' createApp(App).mount('#app') index.html에서 body부분 npm run serve를 입력하고 가장먼저 실행되는게 main.js라고 생각하면 된다. vue 모듈에서 createApp이라는 메소드를가져오고 App.vue를 App으로 가져온다. createApp메소드에 App을넣어서 앱을 생성하겠다는 의미이다. 그리고 mount를 통해서 public의 index.html에 있는 id가 app인 것을 찾아서 App.vue에다가 mount를 하겠다는 의미이다. 결국 작성할 코드들을 index.html 작성해 service가 되는거다 App.vue template ..

프로젝트 폴더를 보면 package.json으로 들어가보자 여기에 "name": "project01", "version": "0.1.0", "private": true, 프로젝트 관련 정보들이 있는데 "private" : true를 보면 기본값이 true로 되어있다. true가 아니면 이것은 다른사람들이 내 프로젝트를 누구나 검색할 수 있고 사용할 수 있다. "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, 우리가 npm 프로젝트를 실행할때 npm run serve를 입력했다. 여기서 serve를 run 한다는 것은 vue-cli-service ser..

1. node.js 설치 후 환경변수에 넣어준다 2. VS code 설치해서 연다. 3. 작업하려는 폴더를 연다 3. 터미널 창을 열고 작업 폴더로 이동 (cd 작업폴더 위치 ) 4. npm install -g vue 명령어로 설치 npm install -g @vue/cli 명령어를 입력해서 CLI설치 맥북 사용하는 사람들은 앞에 sudo 추가해서 입력 vue --version으로 설치되었는지 확인 가능 5. vs code에서 Vetur 설치 Syntax-Highlighting, Erro Checking, Formatting, Debugging, Auto Completion 등 원활한 코딩을 위해 도움을 준다 6. 프로젝트 생성 vue create 프로젝트이름 누르고 엔터 누르면 Default ([Vue..