Vue.js 설치 방법 및 프로젝트 생성 시작 방법

Vue.js 설치 방법 및 프로젝트 생성 시작 방법

 

Vue 는 웹 어플리케이션을 제작을 위한 Front-end Framework로 React, Angular 와 함께 정말 많이 쓰이고 있는 프레임워크입니다.

React와 Angular의 장점만을 가져와서 만들어졌고 가볍고 강력한 기능을 많이 가지고 있으며 배우기도 비교적 쉽다고 많이 알려져있습니다.

저희 회사에서도 현재 Vue를 사용하고있는 프로젝트가 있는데요.

 

Vue를 설치하고 프로젝트를 생성하고 실행하는 방법을 알려드리도록 하겠습니다.

 

Vue 설치

npm install vue

위 명령어를 통해 vue를 설치합니다.

 

Vue-cli 설치

npm install -g @vue/cli 
yarn global add @vue/cli

위 명령어 둘중 하나를 사용해 vue-cli 를 설치합니다.

편하신걸로 설치하시면 되겠습니다.

 

vue-cli 설치를 완료하신 뒤, vue 명령어를 입력해보면 위와 같이 vue에서 사용하는 명령어들을 보실 수 있습니다.

 

Vue Project 생성

vue create test

vue create {{프로젝트 명}}

명령어를 통해 프로젝트 생성을 시작합니다.

 

preset 선택 정도의 과정만 거치고 쉽게 Vue 프로젝트를 생성을 할 수 있습니다.

 

프로젝트 실행

생성된 프로젝트로 들어간 다음, 프로젝트를 실행시킵니다.

npm run serve
yarn serve

위 두가지 명령어 중 하나로 프로젝트 서버를 실행합니다.

 

프로젝트가 실행되었습니다.

 

프로젝트를 실행하고 나온 주소로 들어가면 Vue 프로젝트 생성시 만들어지는 기본 페이지를 보실 수 있습니다.

 

이로써 Vue를 설치하고, 프로젝트를 생성하고, 실행하는 것 까지 설명을 마치도록 하겠습니다.

 

앞으로 더 많은 Vue에 대한 좋은 글 작성해보도록 하겠습니다.

 

 

도움이 되셨다면 공감, 댓글 부탁드립니다!

궁금하신 점이나 요청사항은 언제든지 말씀해주세요!

피드백도 언제나 환영입니다!

 

감사합니다.