[51CTO.com 빠른 번역] Microsoft에서 개발 및 제공하는 Visual Studio Code( https://code.visualstudio.com/ )는 컴퓨터 프로그램 소스 코드를 편집하는 데 사용되는 기본 프로그래밍 도구입니다. Windows, Linux 및 Mac 운영 체제에서 사용할 수 있습니다. 무료 오픈 소스 애플리케이션이므로 개인적으로나 상업적으로 모두 사용할 수 있습니다.

아래에서는 개발자가 Visual Studio Code를 사용할 때 마스터해야 할 10가지 개발 기술을 소개합니다.

명령 팔레트

명령 팔레트를 사용하면 특정 메뉴를 탐색하지 않고도 사용 가능한 다양한 명령에 액세스하려면 키워드만 입력하면 됩니다.

Ctrl + Shift + P 키 조합을 사용하여 명령 팔레트를 열 수 있습니다. 그런 다음 다양한 관련 키워드를 입력하고 드롭다운 창에서 해당 명령 목록을 찾을 수 있습니다.

명령 패널

젠 모드

Zen 모드는 방해 없는 시야를 제공합니다. 코드에만 전적으로 집중할 수 있도록 원본 양식에서 추가 도구 상자와 도구 모음을 모두 제거합니다.

보기 > 모양 > Zen 모드 전환을 선택하여 Zen 모드를 자유롭게 시작하고 종료할 수 있습니다.

또한 Zen 모드에서 코드를 가운데 정렬로 설정하여 문서 편집기와 유사한 효과를 표시할 수도 있습니다. 구체적인 작업은 "보기" > "모양" > "가운데 레이아웃으로 전환"을 선택하는 것입니다.

Zen 모드의 센터링 코드

분할 보기

멀티태스킹에 능숙하다면 동일한 프로젝트에 대해 두 개의 서로 다른 파일을 동시에 작업해야 하거나 두 파일 간의 차이점을 찾아야 할 수도 있습니다. 이 시점에서는 분할 보기 모드를 사용하는 것이 좋습니다.

원하는 대로 보기 분할을 사용자 정의할 수 있습니다. 두 개의 파일을 서로 위에 배치하거나 왼쪽과 오른쪽으로 타일링할 수 있습니다.

이 효과를 얻으려면 보기 > 편집기 레이아웃 > 분할을 선택하면 됩니다.

분할 보기에서 파일 비교

태그 래핑

Emmet( https://emmet.io/ )은 수동 입력을 줄이면서 더 많은 프로그램 코드를 생성하는 데 도움이 됩니다. 이러한 플러그인은 개발자의 반복 입력 시간을 절약할 뿐만 아니라 작업 효율성도 향상시킵니다.

Emmet을 사용하면 입력된 약어 코드에서 해당 태그를 가져올 수 있으므로 아래 Emmet 스크린샷에서 사전 지원되는 모든 태그 패키지 목록을 볼 수 있습니다.

Emmet 랩 태그 사용

힘내 통합

Visual Studio Code는 Git과 효과적으로 통합될 수 있습니다. 이 통합을 통해 코드 수정 사항을 원격 Git 저장소에 즉시 제출하고, 가져오고, 푸시할 수 있습니다.

Visual Studio Code에서는 Git 리포지토리에 속한 파일을 열 수 있습니다. 해당 편집기는 기존 작업 복사본과 원격 저장소에 있는 현재 파일 간의 차이점을 표시합니다. 그러나 인터넷 연결은 사용자가 계속해서 Git 리포지토리를 직접 운영할 수 있도록 하기 위한 기본 요구 사항입니다.

https://education.github.com/git-cheat-sheet-education.pdf 체크리스트를 확인하여 모든 Git 관련 명령에 대해 알아볼 수 있습니다 .

작업 복사본과 저장소의 코드 차이점

다양한 새로운 테마와 플러그인

Visual Studio Code를 사용하면 기본 설정에 따라 편집기에 다양한 테마를 적용하여 텍스트 구문을 강조할 수 있습니다. Visual Studio Marketplace( https://marketplace.visualstudio.com/vscode/Themes ) 에서 다양한 완전 무료 테마를 찾을 수 있습니다.

Visual Studio Code용 테마 목록

또한 Visual Studio Code에는 사용자가 자신만의 플러그인을 만들 수 있는 풍부한 플러그인 API도 함께 제공됩니다. 가장 일반적인 두 가지 플러그인은 다음과 같습니다.

• 설정 동기화 - 설정 동기화( https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync ): 가장 일반적인 설정 플러그인 중 하나로, 다양한 장치의 설정을 동기화할 수 있습니다. 비주얼 스튜디오 코드를 설치합니다.
• Docker( https://marketplace.visualstudio.com/items?itemName=PeterJausovec.vscode-docker ): Docker로 개발할 때 복잡한 Docker 명령을 실행하고 지속적으로 모니터링해야 할 수도 있습니다. 이러한 유형의 Docker 확장을 설치하면 Docker 파일 생성, Docker 파일 인식(IntelliSense) 및 해당 서비스 모니터링과 같은 보다 실용적인 Docker 도구를 얻을 수 있습니다.

Visual Studio Code의 명령줄

Visual Studio Code에는 통합 명령줄 터미널이 함께 제공됩니다. Windows에서는 이 터미널이 명령 프롬프트로 표시되고, Mac 및 Linux에서는 Bash로 표시됩니다. 어느 쪽이든 해당 터미널이 시스템에 이미 로드되어 있는 한 현재 프로젝트의 작업 디렉터리에서 터미널 서비스를 직접 시작할 수 있습니다. 시스템이 미리 로드되지 않은 경우 홈 폴더에서 터미널 서비스를 시작해야 합니다.

명령줄 인터페이스를 사용하면 편집기 실행 방법을 쉽게 제어할 수 있습니다. 제공된 옵션을 사용하면 다양한 파일을 열고, 다양한 확장을 설치하고, 표시 언어를 변경하고, 다양한 출력에 대한 진단을 수행할 수 있습니다.

또한, 다수의 개별 단말 서비스를 지원하고 제공합니다. 터미널 오른쪽 상단에 있는 + 아이콘을 클릭하기만 하면 더 많은 터미널 인스턴스를 생성할 수 있습니다. 물론 휴지통 아이콘을 클릭하여 현재 터미널 창을 닫을 수도 있습니다.

Visual Studio Code의 명령줄

동시에 여러 줄 편집

코드를 복사하여 붙여넣기만 할 수 있다면 분명히 약간 오래된 것입니다. Visual Studio Code에서는 커서를 다른 위치로 이동하여 여러 줄의 코드를 편집할 수 있습니다. 다른 줄에 동일한 코드를 사용하려면 Alt 키를 누른 채 코드를 입력하거나 편집하려는 다른 위치를 클릭하여 여러 커서를 추가할 수 있습니다. 이 커서를 사용하면 코드를 여기저기 복사하여 붙여넣는 대신 다양한 코드 조각을 한 번에 추가하거나 편집할 수 있습니다.

동시에 여러 줄 편집

폴더 제외

node_modules와 같은 불필요한 모듈을 제거하려면 "폴더 제외" 옵션을 사용할 수 있습니다. 물론 이 방법을 사용하여 Visual Studio Code에서 열지 않으려는 폴더를 닫을 수도 있습니다.

이렇게 하려면 "파일" > "기본 설정"을 클릭한 다음 검색 설정에서 file.exclude를 검색하세요. 물론 Visual Studio Code에서 열지 않으려는 폴더 경로를 직접 추가할 수도 있습니다.

폴더 제외

정의로 이동

프로그래밍이나 스크립팅 중에 인식할 수 없는 변수나 메서드가 발견되면 어떻게 해야 합니까? 수동으로 올바른 파일을 검색하거나 변수나 메서드 이름을 기반으로 검색하는 데 몇 분 정도 시간이 걸릴 수 있습니다. 전역 검색.

이제 Visual Studio Code는 해당 정의를 찾는 데 직접 도움이 됩니다. Command 키(Mac의 경우) 또는 Ctrl 키(Windows의 경우)를 누른 상태에서 변수나 메서드 위에 마우스 포인터를 올리면 시스템 팝업 창이 자동으로 표시됩니다. 변수 또는 메소드에 해당하는 위치 및 인라인 정의.

팝업창에서 변수를 확인하세요.

결론적으로

위에는 Visual Studio Code를 효과적으로 사용하는 데 도움이 되는 10가지 새로운 기술이 나열되어 있습니다. 이러한 기술을 사용하여 실제 개발 과정에서 절반의 노력으로 두 배의 결과를 얻을 수 있기를 바랍니다.