비주얼스튜디오 코드(Visual Studio Code) 다운로드 및 설치방법

※웹 개발을 시작하기 위해 우선 비주얼 스튜디오 코드(Visual Studio Code)를 다운로드 및 설치하는 방법부터 설명하려 합니다. 그 외에 단축키 및 기본 설정들에 대해서도 천천히 알아보도록 하겠습니다.

목차

1. 비주얼스튜디오 코드란?

2. 비주얼 스튜디오 코드 다운로드

3. 비주얼 스튜디오 코드 실행 및 기본설정

 

1. 비주얼스튜디오 코드란?

비주얼 스튜디오 코드(Visual Studio Code)는 마이크로소프트에서 오픈소스로 개발하고 있는 소스 코드 에디터입니다. 웹 기반으로 기술들로 데스크톱 애플리케이션을 만들 수 있는 깃허브(GitHub)의 일렉트론(Electron)을 기반으로 만들어져 맥 OS(macOS), 리눅스(Linux), 윈도(Windows) 등 메이저 운영체제를 모두 지원하고 있습니다. 마이크로소프트의 통합 개발 환경(IDE) 비주얼 스튜디오(Visual Studio)와 이름이 비슷하지만 따로 개발되고 있으며 IDE보다는 코드 에디터에 가깝습니다. MIT 라이선스로 오픈소스로 공개되어 있으며, 무료로 사용할 수 있습니다.

 

@주요 기능

• 맥 OS, 리눅스, 윈도 등 메이저 운영체제들을 지원
• 인텔리센스: 코드 자동 완성, 변수 타입, 함수 정의, 모듈 임포트 등
• 디버깅, 리팩토링, 빌트인 깃, Diff 뷰어, 스니펫 등 기본 포함
• 다양한 확장을 지원하며, 이를 통해 100개 이상의 언어 지원
• 웹 기반 기술로 만들어져 있으며, 타입스크립트로 확장 개발 가능
• 마켓플레이스에 15,000개 이상의 확장이 공개되어 있음. 대부분 무료
• 모든 기능에 대한 키 바인딩(단축키)을 자유롭게 변경 가능
• 커맨드 팔레트(Command + Shift + P)로 사용 가능한 기능을 증분검색으로 검색 및 실행 가능

2. 비주얼 스튜디오 코드 다운로드

 1) 공식 사이트 https://code.visualstudio.com/

 

2) 좌측의 Download for Windows를 클릭하면 다운로드가 진행됩니다. 다운로드 완료 후 셋업파일을 실행합니다.

 

3)"동의합니다"에 체크 후 다음

 

• "Code(으)로 열기" 작업을 Windows 탐색기 파일의 상황에 맞는 메뉴에 추가를 하면 파일을 열 때, Code(으)로 열기를 추가해 줍니다.
•  "Code(으)로 열기" 작업을 Windows 탐색기 디렉터리의 상황에 맞는 메뉴에 추가를 하면 디렉터리를 열 때,  Code(으)로 열기를 추가해 줍니다.
• Code을(를) 지원하는 파일 형식에 대한 편집기로 등록합니다. 를 선택하면 편집기로 VIsual Studio Code를 추가해 줍니다.
• PATH에 추가(다시 시작한 후 사용 가능)를 하면 환경 변수의 Path에 VIsual Studio Code가 추가됩니다. 당연히 PATH에 추가를 해줍니다.

4) 경로 및 추가작업사항을 상황에 맞게 설정 후 진행하시면 됩니다.

 

5) "설치"를 누르면 완료입니다.

 

3. 비주얼 스튜디오 코드 실행 및 기본설정

1) 실행 첫 화면입니다.

 

2) 우선 언어를 한국어로 바꿔주기 위해 좌측 메뉴탭 하단에 확장탭을 클릭, Korean을 검색한 후

Korean Language Pack for Visual Studio Code를 설치해 줍니다.

3) Live를 검색한 후 Live Server 도 설치 해 줍니다.

 

※여기까지 기본적인 설정이 완료되었습니다. 다음 시간에는 유용한 설정 및 기본 작동 방법 등에 대해 설명하겠습니다.