VSCode 설정
VSCode는 IDE(통합개발환경) Tool이기 때문에, [확장]을 통해 내가 원하는 환경으로 설정할 수 있다.
▶ 한글 언어팩(Korean Language Pack) 설치
편의를 위해 한글 언어팩을 설치한다.
좌측 5번째 [확장] 아이콘 클릭 후, 검색창에 "Korean"을 입력한다.
제일 처음에 뜨는 "Korean Language Pack for Visual Studio Code"를 설치한다.
VSCode 재시작하면 한글 언어팩이 적용된 것을 확인할 수 있다.
▶ Live Server 설치
새로고침 없이 코딩 중인 웹을 업데이트해준다.
[확장] 검색창에 "Live Server" 검색 후, 제일 위에 있는 팩을 설치해 준다.
▶ Auto Rename Tag 설치
여는 태그 수정 시 닫는 태그도 자동 수정해 준다.
[확장] 검색창에 "Auto Rename Tag" 검색 후, 제일 위에 있는 팩을 설치해 준다.
▶ Bracket Pair Colorizer 설치 (내장 기능)
여는 괄호와 닫는 활호를 짝 지어준다.
현재는 내장 기능이 되었기 때문에 따로 설치할 필요가 없다.
[설정]에서 Editor > Colorization: Enabled설정 체크와 Editor > Guides: active 체크를 확인해준다.
▶ Indent-Rainbow 설치
들여쓰기를 색으로 구분해준다.
[확장] 검색창에 "Indent-Rainbow" 검색 후, 제일 위에 있는 팩을 설치해 준다.
▶ 색 테마 설정
VSCode의 테마를 변경할 수 있다.
좌측 하단에 [관리] 아이콘 클릭 후, [테마]에 [색 테마]를 클릭한다.
원하는 테마를 선택하면 바로 적용된다.
기본으로 "다크 모던" 테마가 적용되어 있다.
▶ 탭 사이즈 설정
좌측 하단 [관리]에 [설정]을 클릭한다. (단축키: Ctrl + ,)
검색창에 "Tab Size" 검색, 2로 수정한다. (Default: 4)
프로그래밍에서는 들여 쓰기가 중요하다. 현재 실무에서 가장 많이 사용하는 사이즈가 2이기 때문에 2로 수정한다.
▶ Word Wrap 설정
검색창에 "Word Wrap" 검색, "on"으로 바꿔준다. (Default: off)
창이 줄어들면 자동으로 줄 바꿈 해준다.
☞ 코드를 한눈에 보기 쉽게 설정해 주는 기능이다.
VSCode 프로젝트 폴더
▶ 디렉터리(Directory) 생성
[파일(F)]에 [폴더 열기...]를 클릭한다.
폴더를 선택한다.
미리 만들어 둔 폴더나 새로 만든 폴더를 선택해서 열어준다.
▶ 새 폴더 생성
C 드라이브로 이동 → [새로 만들기(W)] 클릭 → [폴더(F)] 클릭
폴더 선택 후 팝업 메시지가 뜨면, [예, 작성자를 신뢰합니다.] 클릭한다.
상단과 좌측 탐색기에서 현재 열려 있는 폴더의 이름을 확인할 수 있다.
▶ 디렉터리(Directory) 설정
왼쪽부터 순서대로 새 파일, 새 폴더, 탐색기 새로 고침, 폴더 축소이다.
주로 사용할 기능은 새 파일과 새 폴더이다.
"HTML"과 "0912", "0914"는 새 폴더로 생성했고 ". txt"는 새 파일로 생성했다.
+ VSCode의 파일은 알파벳 순으로 정렬된다.
+ 추가 설정 (필수)
[항목 확인란], [파일 확장명], [숨긴 항목] 이 세 가지 체크는 필수이다.
'Program > VSCode' 카테고리의 다른 글
| VSCode 단축키 (0) | 2023.09.30 |
|---|---|
| Visual Studio Code 다운로드 및 설치 (0) | 2023.09.29 |
