.png)
Vue 시작하기
1. IDE
나는 VS Code가 편해서 선택했지만, 본인에게 잘 맞는 IDE를 쓰면 될 것 같다.
2. Node.js
React와 마찬가지로 빌드 환경을 세팅하기 위해 Node.js를 설치해야한다.
3. npm
npm(Node Package Manager)은 자바스크립트 프로그래밍 언어를 위한 패키지 관리자이며 자바스크립트 런타임 환경 Node.js의 기본 패키지 관리자이다.
(출처 : wikipedia)
→ node.js 설치 시 자동으로 같이 설치됨!
4. Vue.js 설치
- CDN
Vue 공식 매뉴얼에서는 Vue를 처음 시작하는 사람이나 학습 목적인 경우엔 CDN을 사용하여 Vue 개발을 진행하기를 권장한다.
CDN이란?
CDN(콘텐츠 배달 네트워크)은 사용자에게 웹 콘텐츠를 효율적으로 제공할 수 있는 서버의 분산 네트워크이다. CDN은 최종 사용자와 가까운 POP(point-of-presence) 위치의 에지 서버에 캐시된 콘텐츠를 저장하여 대기 시간을 최소화한다.
(출처 : wikipedia)
방법은 매우 간단하다!
그저 script 한 줄만 추가해주면 된다.
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>- npm 방식
// 뷰 설치
npm install vue
// vue-cli 설치
// vue-cli는 기본 vue 개발 환경을 설정해주는 도구
npm install @vue/cli
// 프로젝트 생성
vue init webpack my-project
// 프로젝트 생성
vue create my-project
✔ 여기서 잠깐, vue create와 vue init webpack은 무슨 차이임?
→ vue-cli 2.x 버전에선 vue create, vue-cli 3.x 버전에선 vue init webpack 사용
버전에 따른 명령어 차이! 하는 일은 같다~
// 생성된 프로젝트 디렉터리로 이동 후
cd my-project
// 개발 서버로 실행
npm run serve
실행까지 완료하면 vue project의 default 페이지가 나타난다 !
