반응형
1. 기본 편집 단축키
|
단축키 구분
|
핵심 설명
|
|
Ctrl + X
커서 위치 행 삭제(잘라내기)
|
커서 행 코드가 필요 없을 경우 드래그로 선택하지 않고, 해당 행에 커서를 놓고 Ctrl + X로 행을 삭제(잘라내기)합니다.
|
|
Ctrl + Shift + K
커서 위치 행 삭제
|
커서 행 코드가 필요 없을 경우 드래그로 선택하지 않고, 해당 행에 커서를 놓고 Ctrl + Shift + K로 행을 삭제합니다.
|
|
Ctrl + C
커서 위치 행 복사
|
커서 행 코드를 반복해서 사용해야 할 경우, 해당 행에 커서를 놓고 Ctrl + C로 행을 복사합니다.
|
|
Ctrl + Enter
커서 아래 행 빈줄 생성
|
커서를 맨 뒤로 보낸 후 Enter를 쳐서 빈 행을 생성할 수 있지만,
행의 코드 중간 부분에서도 Ctrl + Enter 단축키를 사용할 경우 더욱 쉽게 커서 아래에 빈 행을 생성 후 이동 가능합니다.
|
|
Ctrl + Shift + Enter
커서 위 행 빈줄 생성
|
행의 코드 중간 부분에서도 Ctrl + Shift + Enter단축키를 사용할 경우 더욱 쉽게 커서 위에 빈 행을 생성 후 이동 가능합니다.
|
|
alt + (↑)화살표
행을 위로 이동
|
커서가 있는 현재 행을 윗줄로 옮길때 alt + (↑)화살표를 할 경우 쉽게 행의 코드 윗줄과 순서를 바꿀 수 있습니다.
|
|
alt + (↓)화살표
행을 아래로 이동
|
커서가 있는 현재 행을 아래로 옮길때 alt + (↓)화살표를 할 경우 쉽게 행의 코드 아랫줄과 순서를 바꿀 수 있습니다.
|
|
Ctrl + alt + (↑)화살표
커서를 위에 추가(다중선택) (★)
|
동일하게 문자열을 수정시 Ctrl + alt + (↑)화살표로 윗행을 다중선택하여, 코드를 작성하면 동일하게 한번에 여러개를 수정할 수 있습니다.
|
|
Ctrl + alt + (↓)화살표
커서를 아래에 추가(다중선택) (★)
|
동일하게 문자열을 수정시 Ctrl + alt + (↓)화살표로 아래행 다중선택하여, 코드를 작성하면 동일하게 한번에 여러개를 수정할 수 있습니다.
|
|
Ctrl + /
한줄 주석처리 (★)
|
코드에 대한 설명 또는 필요에 의해 코드를 삭제하지 않고 브라우저에서 보여주고 싶지 않을 경우 Ctrl + / 단축키를 사용하면 됩니다.
퍼블리싱 작업시 자주 사용하는 단축키입니다.
해당 주석을 풀고 싶을 경우 Ctrl + / 단축키를 한번 더 누르면 됩니다.
|
|
Ctrl + K → Ctrl + C
블럭 주석 처리 (★)
|
한줄 주석(//)을 여러 행 한꺼번에 처리하는 블럭주석으로 Ctrl + K → Ctrl + C 단축키를 사용하면 됩니다.
|
|
Ctrl + K → Ctrl + U
주석 삭제 (★)
|
주석 처리한 부분을 해제 하고 싶을 경우 Ctrl + K → Ctrl + U 단축키를 사용하면 됩니다.
|
|
Alt + Shift + A
블럭 주석 처리 (★)
|
커서 위치에서 /* */ 또는 드래그 하여 선택된 부분을 블럭 주석 처리 하고 싶을 경우 Alt + Shift + A 단축키를 사용하면 됩니다.
|
|
Ctrl + Shift + [
커서 영역 접기
|
퍼블리싱 작업시 해당 블럭의 코딩을 완료 후 코드의 양이 많아서 코드가 보기 힘들 경우 가독성을 위해 커서 위치에서 Ctrl + Shift + [ 단축키를 사용하면 커서의 자식요소를 포함하여 접을 수 있습니다.
|
|
Ctrl + Shift + ]
커서 영역 펼치기
|
퍼블리싱 작업시 접었던 부분의 코드를 다시 수정하거나 보고 싶을 경우 Ctrl + Shift + [ 단축키를 사용하면 커서의 자식요소를 포함하여 펼칠수 있습니다.
|
2. 검색 관련 편집 단축키
|
단축키 구분
|
핵심 설명
|
|
Ctrl + G
행(라인 번호)으로 이동 (★)
|
퍼블리싱 작업시 특정 줄 번호로 빠르기 이동하고 싶을 경우 Ctrl + G 단축키를 사용하면 빠르게 원하는 행으로 이동 가능합니다.
|
|
Ctrl + P
빠른 파일 열기 (★)
|
프로젝트 파일 폴더에서 일일이 클릭해서 파일을 찾는 수고로움을 피하고, 빠르게 파일을 찾고 싶을 경우 Ctrl + P 단축키를 사용하면 됩니다.
|
|
Ctrl + F
찾기
|
현재 파일에서 원하는 문자열을 찾고 싶을 경우 Ctrl + F 단축키를 사용하면 빠르게 찾아아서 이동 가능합니다.
|
|
Ctrl + Shift + F
전체 파일에서 찾기
|
폴더에서 파일을 전체 검색하여 원하는 문자열을 찾고 싶을 경우 Ctrl + F 단축키를 사용하면 검색한 문자열이 있는 모든 파일을 찾을 수 있습니다.
그러나 전체 검색이다 보니, 파일이 많을 경우 시간이 오래 걸릴 수 있습니다.
|
|
Ctrl + H
현재페이지 문자열 수정하기 (★)
|
현재 퍼블리싱 중인 페이지에서 여러개의 동일하게 사용된 클래스, 태그, 텍스트 등을 찾아서 한번에 수정하고 싶을 경우 Ctrl + H 단축키를 사용하면 검색하여, 한 개 또는 모두를 한번에 수정할 수 있습니다.
한 개씩 확인하면서 바꾸고 싶을경우 Enter 하면 한 개씩 변경 가능하며, Ctrl + Alt + Enter 하면 모두 수정이 가능합니다.
|
|
Ctrl + Shift + H
폴더 모든 페이지 문자열 수정하기 (★)
|
프로젝트 폴더 전체 페이지에서 동일하게 사용된 클래스, 태그, 텍스트 등을 찾아서 한번에 수정하고 싶을 경우 Ctrl + H 단축키를 사용하면 검색하여, 한 개 또는 모두를 한번에 수정할 수 있습니다.
|
|
F8
오류 또는 경고 찾기
|
HTML, JS, CSS 파일에서 오타로 인해서 오류를 확인하고자 할 경우 F8 단축키를 사용하면 쉽게 찾아서 수정할 수 있습니다.
|
3. 파일 관리 편집 단축키
|
단축키 구분
|
핵심 설명
|
|
Ctrl + N
새로운 편집 탭 열기
|
퍼블리싱을 하다보면 새로운 파일(HTML, CSS, JS)을 생성해야 할때가 있습니다.
이럴 경우 Ctrl + N 단축키를 사용하여 파일 탭을 생성합니다.
|
|
Ctrl + Shift + N
새로운 창 열기
|
VS Code 에디터에서 새로운 프로젝트 폴더를 생성한 후 열고 싶을 때 Ctrl + Shift + N 단축키를 사용합니다.
현재 작업중인 프로젝트에서 종류가 다른 프로젝트의 수행을 위해 새로운 창을 열고 싶을 때 사용하는 단축키 입니다.
|
|
Ctrl + O
파일 열기
|
새로운 파일을 만드는 것이 아닌 프로젝트 폴더내에 이미 생성된 파일을 열고자 할 경우 Ctrl + O 단축키를 사용합니다.
|
|
Ctrl + W
파일 창 닫기 (★)
|
퍼블리싱 작업을 하다보면, 여러개의 창을 열어 놓을 경우가 있습니다.
해당 파일을 더이상 열어 놓을 필요가 없거나, 파일창이 너무 많아 일부분 닫아야 할 경우 Ctrl + W 단축키로 파일을 닫아 줍니다.
|
|
Ctrl + Shift + T
이전에 닫힌 편집파일 다시 열기 (★)
|
현재 파일에서 퍼블리싱 작업중, 이전에 닫았던 창을 다시 열어야 할 경우 Ctrl + Shift + T 단축키로 사용하면 됩니다.
|
|
Ctrl + S
파일 저장
|
신규 파일 저장이 아닌 현재 파일을 저장해야 할 경우 Ctrl + S 단축키로 파일을 저장하면 됩니다.
|
|
Ctrl + Shift + S
다른 이름으로 파일 저장
|
현재 파일을 새로운 이름의 파일로 생성하여 저장해야 할 경우 Ctrl + Shift + S 단축키로 파일을 저장하면 됩니다.
|
|
Ctrl + \
파일 화면 창 분할 (★)
|
한 개 이상의 파일 화면을 동시에 보면서 퍼블리싱 해야 할 경우 Ctrl + \ 단축키를 사용하여 화면 창을 분할하여 보면 편리합니다.
Ctrl + \ 단축키를 누른 횟 수 만큼 화면 창이 분할 됩니다.
|
|
Ctrl + N(숫자)
화면 분할 창 위치 포커싱 (★)
|
화면을 여러 개 분할 후, 퍼블리싱 작업시 원하는 위치의 분할 창으로 이동해야 할 경우 Ctrl + N(숫자) 단축키를 사용하여 원하는 파일 분할창으로 쉽게 이동할 수 있습니다.
예를 들어 Ctrl + 2 단축키를 누르면 2번 파일 분할창으로 이동합니다.
마우스로 매번 분할창 클릭을 하지 않아도 됩니다.
|
4. 언어 편집 단축키
|
단축키 구분
|
핵심 설명
|
|
Ctrl + ← /
Ctrl + →
단어별 커서 이동
|
한글자씩 커서 이동이 아닌, 단어별로 커서를 이동해야 할 경우 Ctrl + ← / Ctrl + → 단축키를 사용하여 좌우로 쉽게 이동할 수 있습니다.
|
|
Ctrl + Shift + ← /
Ctrl + Shift + →
단어 선택
|
단어를 선택해야 할 경우 Ctrl + Shift + ← / Ctrl + Shift + → 단축키를 사용하면 됩니다.
|
|
Alt + Shift + →
선택 확장
|
문단 또는 태그 단위로 확장 선택을 해야 할 경우 Alt + Shift + → 단축키를 사용하면 됩니다.
|
|
Alt + Shift + ←
선택 축소
|
문단 또는 태그 단위로 축소 선택을 해야 할 경우 Alt + Shift + ← 단축키를 사용하면 됩니다.
|
|
alt + 마우스 클릭
필요한 문자열을 골라서 커서 추가(다중선택) (★)
|
동일하지 않은 다양한 문자열을 수정시 alt + 마우스 클릭으로 작업자가 원하는 문자열을 선택하여, 한번에 여러개를 수정할 수 있습니다.
|
|
Ctrl + K → Ctrl + F
자동 정렬(★)
|
들여쓰기를 제대로 정리하지 못했을 경우 Ctrl + A 후 Ctrl + K → Ctrl + F 단축키를 사용하면 한번에 코드 자동정렬을 할 수 있다.
여러명의 퍼블리셔가 한개의 프로젝트를 진행할 경우 코드 정렬의 통일성 문제를 해결할 수 있기 때문에, 없어서는 안될 단축키 입니다.
|
|
Ctrl + D
특정 문자열 여러개 찾기(★)
|
동일한 문자열 여러개를 한번에 수정해야 할 경우 Ctrl + D 단축키를 사용하여 한번에 수정할 수 있다.
다중 선택 방법은 Ctrl + D 를 누른 횟 수 만큼 동일한 문자열이 선택 된다.
예를 들어 AA라는 문자열 2개를 BB로 수정이 필요할 경우, AA에 커서를 두고 Ctrl + D 단축키를 2번 눌러 AA 문자열 2개를 선택한 후 BB로 문자를 수정하면 된다.
|
|
Ctrl + Shift + L
특정 문자열 모두 선택
|
Ctrl + D는 동일한 문자열을 누르는 횟 수 만큼 선택 갯수가 확장되는 방식이라면 Ctrl + Shift + L 단축키를 사용하면 한번에 동일한 문자열을 선택하여 편집할 수 있습니다.
찾아야 할 문자열을 블럭선택 한 후 Ctrl + Shift + L 단축키를 누른 후 수정하면 됩니다.
|
5. 확장프로그램 단축키
|
확장프로그램
|
핵심 설명
|
|
Live Server
|
라이브서버는 코딩하는 것을 실시간으로 브라우저에서 F5 새로고침 없이 바로 적용해서 확인 가능하도록 해주는 가상 서버 입니다.
사용방법은 확장프로그램을 설치한 후 , Alt + L → O 단축키를 사용하면 브라우저에서 실시간으로 코딩 상황를 확인 가능합니다.
|
|
Live Server
|
라이브서버는 코딩하는 것을 실시간으로 브라우저에서 F5 새로고침 없이 바로 적용해서 확인 가능하도록 해주는 가상 서버 입니다.
사용방법은 확장프로그램을 설치한 후 , Alt + L → C 단축키를 사용하면 가상 서버를 종료 합니다.
|
반응형