본문 바로가기
IT/웹코딩기초

[코딩기초] VisualStudioCode 비주얼 스튜디오 코드 다운로드 및 꼭 해야하는 기본설정 & 셋팅방법

by 복자정 2023. 5. 1.

오늘은 Visual Studio Code(비주얼 스튜디오 코드)

프로그램 설치 방법 및 코딩 작업 시 미리 해야하는 기본설정 및 셋팅방법에 대해 알려드릴게요! 

 


 1 

 

 

먼저, 구글에서 Visual Studio Code(비주얼 스튜디오 코드)를 검색하여 사이트를 들어갑니다. 

아래 Download를 먼저 들어가도 바로 다운로드 사이트로 이동할 수 있어요. 

 

비주얼스튜디오다운로드설치방법
비주얼스튜디오다운로드설치방법

 

 

 2 

 

상단 오른쪽에 Download를 눌러주고

WIndow or Mac을 선택해주고

다운로드 버튼을 눌러주어 설치를 시작합니다. 

 

비주얼스튜디오다운로드설치방법
비주얼스튜디오다운로드설치방법

 

 

 

 3 

 

next를 눌러 계속해서 설치를 진행해주시고 

완료가 되었으면 

시작하기 전 설정을 해주시면 좋습니다.

※ 기본 셋팅 Extension 확장 2가지를 설치하시고 가시면 유용합니다! 

 

비주얼스튜디오 기본셋팅 기본설정
비주얼스튜디오 기본셋팅 기본설정

 

 

1. 비주얼 스튜디오 코드를 열었을 때 왼쪽 마지막 아이콘 'Extension'메뉴에서  'Korean langeage pack' 설치

- 영어를 알면 좋겠지만 영어모를 때 아주 유용한 '한글 언어팩'입니다.

(영어가 제2언어처럼 사용이 가능하시다면 패스하셔도 됩니다.)

- install 버튼만 눌러주면 자동 설치됩니다. 

 

 

 

2.  'Extension'메뉴에서 'Live Server' 설치 

- 따로 F5로 새로고침 하지 않아도 '실시간보기 확장 기능'을 추가하는 것입니다.

- install 버튼만 눌러주면 자동 설치됩니다. 

 

 

 4 

 

 Visual Studio Code(비주얼 스튜디오 코드) 꼭 알고 가야할 기본 설정 방법

 

 

1. 전체 색상 변경 방법
- 좌측 하단 설정 아이콘>테마>색테마선택

 

비주얼스튜디오 기본셋팅 기본설정
비주얼스튜디오 기본셋팅 기본설정

 


2. 문자 서체/크기 변화

- 좌측 하단 설정>폰트패밀리 수정 
(OS에 설치된 폰트 중에서 선택)

 

VisualStudioCode한글로
문자 서체/크기 변화

 


3. 설정>zoom검색>mouse wheel zoom 체크버튼 켜놓기 
(도큐먼트에서 Ctrl 키 누르고 휠 버튼을 누르면 확대/축소 됌) 

 

VisualStudioCode확대
글자 확대/축소

 

 

댓글