[Vue.js 프로젝트 투입 일주일 전] 2장 - 개발환경 구성

2.1 Visual Studio Code 설치

  - 개발 도구 (IDE)

  - MS VS Code

  - 개발 편의성을 위한 다양한 플러그인 -> 개발 생산성 극대화

  - 설치 시 환경 변수 추가 필수

2.2 Node.js 설치

  - Node.js

  - 확장성 있는 네트워크 애플리케이션(서버 프로그램) 개발 위한 JS 런타임 환경

  - 원래 JS는 클라이언트(브라우저)에서 동작하는 언어

  - 크롬의 V8 엔진을 이용하여 브라우저에서 JS가 동작하듯이 서버에서도 동작할 수 있도록 해주는 환경

  - node -v (노드 JS 버전 확인)

2.3 NPM(Node Package Manager) 설치

  - 수많은 오픈소스 모듈 설치하여 사용

  - Node.js 기반의 JS 오픈소스 등록, 간단한 명령어로 설치 및 사용할 수 있도록 해주는 패키지 매니저

  - npm - v (NPM 버전 확인)

2.4 Vue 개발을 위한 유용한 VS Code Extension 설치

  - VS Code Extension

  - Ctrl + Shift + X (VS Code 좌측 Extension 메뉴)

  - Vetur

    - Vue 개발 시 가장 먼저 설치하는 확장 프로그램

    - Vue의 프로그래밍 문법에 맞는 Syntax Highlighting 지원

    - Vue 프로그램 작성 시 사용할 수 있는 프로그램 문법에 대한 가이드 제공

    - 프로그램 코드 실행 전에 문법에 맞지 않는 오류는 물론 잠재적 문제 될 수 있는 코드 알려줌

  - Debugger for Chrome

    - 크롬 브라우저 개발자 도구처럼 VS Code 안에서 디버깅 가능

  - Prettier Code formatter

    - Vue 프로그램 구현 시 코드 포맷 지정된 형태로 변환