VS code 실행방법과 단축키 등에 대해 알아보자

자동완성

HTML의 기본구조 자동완성

• ! + tab : HTML의 기본구조가 자동완성되는 단축키

Extensions

Extensions(확장프로그램)

• Korean Language Pack for Visual Studio Code : VS Code의 한글화 팩
• Beautify(정리된 코드 만들기) : 확장프로그램을 설치 후, 바로 가기 > 단축키 설정(ctrl+alt+l)해서, 추후에 지저분한 코드를 단축키로 정리 가능
• Auto Rename Tag : 시작, 종료 태그 이름을 한 번에 변경하는 팩
• Live Server : 프로젝트를 브라우저에 출력하는 확장 팩. Live Server는 개발을 위해 임시로 로컬(나의 컴퓨터 환경) 서버를 오픈하는 것. 제품(Product)은 실제 호스팅(사용자들이 접근 가능한) 서버에 업로드해야 함

단축키

• 사이드바 열고/닫기
  1. MacOS : Cmd + B
  2. Windows : Ctrl + B
• 빠른 열기(이름으로 파일이나 기호 탐색)
  1. MacOS : Cmd + P
  2. Windows : Ctrl + P
• 모든 명령 표시(ex. 바로 가기)
  1. MacOS : Cmd + Shift + P
  2. Windows : Ctrl + Shift + P
• 편집기 닫기
  1. MacOS : Cmd + W
  2. Windows : Ctrl + W
• 찾기(검색)
  1. MacOS : Cmd + F
  2. Windows : Ctrl + F
• 찾기(검색)/바꾸기(대체)
  1. MacOS : Cmd + Alt(Opt) + F
  2. Windows : Ctrl + H
• 줄 위로 이동
  1. MacOS : Alt(Opt) + Up
  2. Windows : Alt + Up
• 줄 아래로 이동
  1. MacOS : Alt(Opt) + Down
  2. Windows : Alt + Down
• 아래에 줄 복사
  1. MacOS : Alt(Opt) + Shift + Down
  2. Windows : Alt + Shift + Down
• 되돌리기
  1. MacOS : Cmd + Z
  2. Windows : Ctrl + Z
• 위에 줄 복사

1. MacOS : Alt(Opt) + Shift + Up
2. Windows : Alt + Shift + Up

• 들여쓰기(tab1개에 공백 몇 개를 사용할 것인지 조정 가능)
  1. MacOS : Tab
  2. Windows : Tab

     들여쓰기 선택을 누른 후 "공백을 사용한 들여쓰기" 선택 > tab키 1번(들여쓰기 1번)에 공백을 몇 개로 지정할 것인지 선택 가능

• 내어쓰기
  1. MacOS : Shift +Tab
  2. Windows : Shift + Tab
• 이전 편집기 열기
  1. MacOS : Cmd + Shift + [
  2. Windows : Ctrl + PageUp
• 편집기 분할
  1. MacOS : Cmd + \
  2. Windows : Ctrl + \