Visual Studio Code 숨은 기능 & 생산성 향상 팁 모음

Posted by heoncode
2025. 4. 20. 14:40 개발 환경 & 팁 모음
반응형
SMALL

Visual Studio Code 숨은 기능 & 생산성 향상 팁 모음

Visual Studio Code(이하 VSCode)는 기본 기능만으로도 충분히 훌륭한 코드 편집기이지만, 잘 알려지지 않은 숨은 기능까지 활용하면 생산성을 더욱 높일 수 있습니다. 이번 글에서는 실무에 유용한 VSCode 숨은 기능과 설정 팁을 정리합니다.

1. 다중 커서 편집(Multi-Cursor Editing)

VSCode에서는 Alt 키를 누른 상태로 클릭하여 여러 위치에 동시에 커서를 추가할 수 있습니다. 또한 Ctrl + Shift + L을 누르면 선택한 단어와 같은 모든 단어에 커서를 추가할 수 있어 일괄 수정이 가능합니다.

2. 파일 간 빠른 전환(Quick File Switch)

Ctrl + P를 누르면 현재 작업 중인 폴더 내 파일들을 빠르게 검색하여 열 수 있습니다. 파일명을 일부만 입력해도 자동 완성되며, 최근 열었던 파일로 이동할 때 매우 유용합니다.

3. 명령 팔레트(Command Palette) 활용

Ctrl + Shift + P를 누르면 명령 팔레트를 열 수 있습니다. 확장 프로그램 설치, 설정 변경, 포맷팅 등 거의 모든 기능을 명령어로 검색해 실행할 수 있어 마우스 이동 없이 작업이 가능합니다.

4. 설정 검색 & 필터링

VSCode 설정 화면(파일 > 기본 설정 > 설정)에서는 키워드 검색이 가능합니다. 특정 설정을 빠르게 찾고 싶을 때 키워드를 입력하면 관련 항목만 필터링되어 효율적입니다.

5. 임시 편집기(Preview Mode)

탐색기에서 파일을 클릭할 때 임시 편집기(preview tab)로 열립니다. 이 기능 덕분에 불필요한 탭을 계속 생성하지 않고 하나의 탭만 재활용할 수 있습니다. 파일을 편집하면 자동으로 고정되며, 고정하려면 파일 탭을 더블클릭하면 됩니다.

6. 터미널 분할(Split Terminal)

내장 터미널을 열고 싶을 때 Ctrl + ` (백틱 키)를 누르면 됩니다. 터미널 창을 가로 또는 세로로 분할하려면 터미널 우측 상단에 있는 분할 아이콘을 클릭하거나 Ctrl + Shift + 5를 누르면 됩니다.

7. 작은 단위 커밋을 위한 소스 제어(Source Control)

VSCode에서는 Git을 기본 지원합니다. 좌측 패널의 소스 제어 아이콘을 통해 변경된 파일만 빠르게 커밋하고, 파일별로 선택하여 커밋하거나 바로 푸시할 수 있습니다.

8. 자동 저장(Auto Save)

파일 > 자동 저장(Auto Save) 메뉴를 활성화하면 일정 시간마다, 혹은 포커스를 잃을 때 자동으로 파일이 저장됩니다. 저장 실수를 방지하고 개발 흐름을 끊기지 않게 유지할 수 있습니다.

9. 스니펫(Snippets) 사용

코드를 빠르게 작성하고 싶을 때 사용자 정의 스니펫을 사용할 수 있습니다. 설정 > 사용자 스니펫으로 진입해 자주 사용하는 코드 조각을 등록하면 짧은 키워드만 입력해 자동 완성할 수 있습니다.

10. 미니맵(Minimap) 활용

편집기 우측에 나타나는 미니맵을 통해 코드 전체 구조를 빠르게 파악할 수 있습니다. 설정 > 미니맵에서 활성화 여부를 조정할 수 있으며, 코드 길이가 긴 파일 작업 시 특히 유용합니다.

마무리

VSCode의 숨은 기능을 적극 활용하면 작업 속도와 효율이 크게 향상됩니다. 기본 사용법에 익숙해졌다면 이번에 소개한 기능들을 차근차근 적용해보며 생산성을 한 단계 높여보시기 바랍니다.

#VSCode #숨은기능 #생산성팁 #개발환경 #코드편집기

반응형
LIST

Visual Studio Code 워크스페이스 설정법 & 폴더 관리 꿀팁

Posted by heoncode
2025. 4. 19. 15:22 개발 환경 & 팁 모음
반응형
SMALL

Visual Studio Code 워크스페이스 설정법 & 폴더 관리 꿀팁

Visual Studio Code(이하 VSCode)는 뛰어난 유연성 덕분에 다양한 프로젝트를 관리하기 좋은 코드 에디터입니다. 특히 워크스페이스 기능을 잘 활용하면 복잡한 폴더 구조나 여러 프로젝트를 효율적으로 다룰 수 있습니다. 이번 글에서는 VSCode 워크스페이스 기본 개념부터 폴더 관리 실전 팁까지 정리합니다.

워크스페이스란 무엇인가

워크스페이스는 VSCode에서 하나 이상의 폴더를 그룹으로 관리할 수 있는 기능입니다. 단일 폴더를 열어서 작업할 수도 있지만, 워크스페이스를 활용하면 여러 프로젝트를 하나의 세션에서 편리하게 다룰 수 있습니다.

워크스페이스는 .code-workspace라는 별도의 파일로 저장되며, 이 파일 안에 열려 있는 폴더 목록과 특정 설정값이 포함됩니다.

워크스페이스 파일 생성 방법

  1. VSCode를 실행하고 원하는 폴더를 엽니다.
  2. "파일 > 워크스페이스에 폴더 추가" 메뉴를 통해 추가 폴더를 등록합니다.
  3. "파일 > 워크스페이스로 저장"을 선택하여 .code-workspace 파일을 저장합니다.

이 과정을 통해 여러 폴더를 하나의 워크스페이스로 묶을 수 있으며, 다음부터는 이 파일만 열면 동일한 구성으로 작업을 시작할 수 있습니다.

워크스페이스 설정의 장점

  • 폴더별 설정 분리: 특정 폴더만 별도 설정이 필요할 경우, 워크스페이스에서 세부 설정을 분리할 수 있습니다.
  • 프로젝트 간 빠른 전환: 하나의 세션에서 다양한 폴더를 오가며 작업할 수 있습니다.
  • 일관된 개발 환경: 팀원들과 .code-workspace 파일을 공유하면 모두 같은 개발 환경을 사용할 수 있습니다.

워크스페이스 설정 예시

워크스페이스 파일에서는 폴더 구조뿐 아니라 다양한 설정을 함께 관리할 수 있습니다. 기본 구조 예시는 다음과 같습니다.

{
    "folders": [
        {
            "path": "프로젝트A"
        },
        {
            "path": "프로젝트B"
        }
    ],
    "settings": {
        "editor.tabSize": 2,
        "files.exclude": {
            "**/.git": true,
            "**/node_modules": true
        }
    }
}

이 예제에서는 탭 크기를 2로 설정하고, .git 폴더와 node_modules 폴더를 탐색기에서 숨기는 설정을 추가했습니다.

폴더 관리 실전 팁

  • 탐색기에서 불필요한 폴더 숨기기: files.exclude를 활용해 보기 싫은 폴더를 숨기면 폴더 트리가 깔끔해집니다.
  • 워크스페이스별 확장 기능 적용: 특정 워크스페이스에만 필요한 확장 프로그램을 설치하거나 비활성화할 수 있습니다.
  • 작업 폴더 정리: 프로젝트별 하위 폴더를 깔끔하게 정리하면 워크스페이스 관리가 훨씬 쉬워집니다.

마무리

VSCode의 워크스페이스 기능은 단순한 폴더 열기 이상의 강력한 생산성 도구입니다. 여러 프로젝트를 관리하거나 복잡한 폴더 구조를 깔끔하게 유지하고 싶다면 워크스페이스를 적극 활용해보시기 바랍니다.

#VSCode #워크스페이스 #폴더관리 #개발환경 #코드편집기

반응형
LIST

Visual Studio Code 추천 확장 프로그램 2025 버전 – 생산성 향상 필수 플러그인 정리

Posted by heoncode
2025. 4. 17. 16:06 개발 환경 & 팁 모음
반응형
SMALL

Visual Studio Code(VSCode)는 가볍고 강력한 기능 덕분에 현재 가장 널리 사용되는 코드 편집기입니다. 기본 기능만으로도 훌륭하지만, 확장 프로그램을 활용하면 생산성과 작업 효율을 크게 높일 수 있습니다. 오늘은 2025년 기준으로 추천할 만한 VSCode 확장 프로그램을 정리해 소개합니다.

1. Prettier – Code formatter

Prettier는 코드 포맷팅을 자동화해주는 확장입니다. 팀 단위 개발 시 코드 스타일을 통일하는 데 필수적이며, 저장할 때 자동으로 코드 정리를 할 수 있어 사소한 포맷팅 스트레스가 줄어듭니다.

  • 주요 기능: 자동 코드 정렬, 포맷 강제 적용
  • 추천 설정: 저장 시 포맷팅(Auto Format on Save) 활성화

2. GitLens – Git supercharged

GitLens는 Git 사용 경험을 극대화해주는 확장입니다. 코드 라인별로 누가 작성했는지 보여주고, 커밋 히스토리를 간편하게 확인할 수 있습니다. 코드 분석과 협업에 매우 유용합니다.

  • 주요 기능: Blame 표시, 커밋 내역 비교, 변경사항 시각화
  • 추천 설정: 사이드바에 GitLens 패널 고정

3. REST Client

REST Client는 외부 API 요청을 간편하게 테스트할 수 있는 도구입니다. 별도의 프로그램 없이 VSCode 안에서 HTTP 요청을 작성하고 바로 결과를 받을 수 있어 백엔드 개발자나 API를 자주 다루는 개발자에게 유용합니다.

  • 주요 기능: GET, POST 요청 테스트, 토큰 인증 지원
  • 추천 사용: 프로젝트 루트에 .http 파일 작성해 관리

4. Tabnine – AI Code Completion

Tabnine은 인공지능 기반 코드 자동완성 확장입니다. 프로젝트 패턴을 학습해 다음에 올 코드를 예측하여 추천해줍니다. 특히 반복되는 코드 작성 시 빠른 생산성 향상을 기대할 수 있습니다.

  • 주요 기능: AI 기반 코드 자동완성, 다양한 언어 지원
  • 주의 사항: 무료 버전은 기능 일부 제한

5. Error Lens

Error Lens는 코드 오류나 경고를 라인에 직접 표시해주는 확장입니다. 별도로 문제탐색기 창을 열지 않고도 문제를 바로 인식하고 수정할 수 있어 디버깅 효율이 높아집니다.

  • 주요 기능: 에러 메시지 인라인 표시, 경고/오류 강조
  • 추천 설정: 경고/에러 색상 커스터마이즈

부가 추천: 개발을 더 빠르게 하는 확장들

  • Path Intellisense: 파일 경로 자동완성 지원
  • Bracket Pair Colorizer 2: 중괄호, 대괄호 짝을 색깔로 구분
  • Markdown All in One: 마크다운 작성 환경 최적화

실무 팁

  • 확장은 많을수록 좋은 것이 아니라, 필요한 최소한만 설치하는 것이 성능 유지에 유리합니다.
  • 설정 파일(settings.json)을 백업해두면, 다른 PC에서도 빠르게 환경을 복원할 수 있습니다.
  • 확장 설치 후 바로 적용이 안 되는 경우, VSCode를 재시작하거나 설정을 한번 확인해보는 것이 좋습니다.

Visual Studio Code는 확장을 어떻게 구성하느냐에 따라 완전히 다른 개발 경험을 제공합니다. 이번에 소개한 확장 프로그램을 설치해 개발 생산성을 한층 끌어올려 보시기 바랍니다.

#VSCode #개발환경 #코딩생산성 #VSCode추천확장 #프로그래밍툴

반응형
LIST