[Vue.js] 입문 - 개발 환경 설정하기

Node.js 설치

Node.js 는 Server-side javascript 코드를 실행 할 수 있는 실행 환경입니다.
Vue 프로젝트를 쉽게 구성하고, 프로토타이핑을 할 때도 필요하기 때문에 필요합니다.

 

Node.js를 설치하는데에는 여러가지가 있는데 두가지가 있습니다.

첫번째 방법

• https://nodejs.org/ko/download/

다운로드 | Node.js

링크로 들어가서 자신의 운영체제에 맞게 설치를 합니다.

---

두번째 방법

• https://chocolatey.org/install

Installing Chocolatey

 Chocolatey가 설치되어있는 분이시면, https://chocolatey.org/ 로 들어가서 Node.js를 검색하여

오른쪽 아래에 나오는 커맨드를 복사해 자신의 터미널에 붙여넣기 하여 설치합니다.

 

 

---

뷰 개발자 도구 설치

뷰로 개발할 때 도움을 주는 도구로, 뷰로 만든 웹 앱의 구조를 디버깅하거나 분석을 편하게 해줍니다.

• 구글에 'Vue.js devtools' 를 검색

• 맨 위의 사이트를 들어가서 확장프로그램 설치

• 웹 브라우저 오른쪽 위의 점3개 모양 클릭 후, 더보기의 확장프로그램 클릭

• Vue.js 세부정보에 들어가서 사진과 같은 부분 체크 허용

 

 

 

---

VScode에서 Vue 설치

저는 vscode가 편해서 vscode를 통해 사용합니다.
다른 ide가 편하신분들은 아톰같은 프로그램을 써도 됩니다.

• VScode의 확장에서 필요한 기능들 설치

설치할 툴들

Live Server
 - html을 예제로 보고 싶을 때 유용
Vetur
 - Vue 개발 툴
vue
 - Vue 문법 검사기
Vue VSCode Snippets
 - Vue 문법을 사용하기 쉽게 해주는 툴

 

Vue 개발 환경 구성하는 법에 대해서 정리해봤습니다.

다음 글은 Vue를 사용하는 법에 대해서 작성하겠습니다.