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