프론트엔드와 백엔드 프로젝트를 동시에 개발하며 VSCode 창을 여러 개 띄워 놓고 불편하게 왔다 갔다 하는 경험, 흔하게 겪으셨을 겁니다.
이는 각 프로젝트가 독립된 개발 환경을 요구하지만, VSCode 기본 설정만으로는 이를 유연하게 관리하기 어렵기 때문입니다.
이 글에서는 VSCode 워크스페이스 기능을 활용하여 여러 프로젝트 폴더를 한 창에서 효율적으로 설정하고 관리하는 구체적인 방법을 단계별로 안내합니다.
– VSCode 워크스페이스는 여러 프로젝트를 하나의 창에서 통합 관리하여 개발 효율을 높입니다.
– `.code-workspace` 파일을 통해 각 프로젝트의 독립적인 설정과 터미널 환경을 유지할 수 있습니다.
– 간단한 3단계 설정만으로 복잡한 프로젝트 전환 없이 쾌적한 개발 환경을 구축할 수 있습니다.
VSCode 워크스페이스는 여러 폴더와 프로젝트를 한 번에 효율적으로 관리하고 전환할 수 있는 강력한 해결책입니다.
VSCode 워크스페이스, 왜 필요할까요?
여러 프로젝트를 동시에 개발하는 상황은 웹 개발자에게 일상입니다. 예를 들어, 특정 프론트엔드 프로젝트와 그에 연결된 백엔드 API 서버 프로젝트를 동시에 작업해야 할 때가 많습니다. 이때 대부분의 개발자는 VSCode 창을 두 개 이상 띄워 놓고, 각 창에서 해당 프로젝트를 엽니다. 하지만 이는 작업 전환 시 집중력을 분산시키고, 불필요한 리소스 소모를 야기할 수 있습니다.
VSCode 워크스페이스는 이런 문제를 해결하기 위해 설계된 기능입니다. 단일 VSCode 창에서 여러 개의 루트 폴더를 동시에 관리할 수 있도록 해줍니다. 각 폴더는 독립적인 터미널, 검색 범위, 심지어 특정 확장 프로그램 설정까지 가질 수 있어, 마치 여러 개의 독립된 VSCode 인스턴스를 하나로 합쳐 놓은 듯한 효과를 줍니다.
| 구분 | 단일 폴더 열기 | 워크스페이스 열기 |
|---|---|---|
| 프로젝트 관리 | 단일 프로젝트에 최적화, 여러 프로젝트 시 여러 창 필요 | 하나의 창에서 여러 프로젝트(폴더) 통합 관리 |
| 터미널 | 하나의 터미널만 해당 폴더의 컨텍스트를 가짐 | 각 프로젝트 폴더별 독립적인 터미널 실행 및 관리 가능 |
| 검색 범위 | 현재 열린 폴더 내에서만 검색 | 모든 워크스페이스 폴더를 대상으로 통합 검색 가능 |
| 설정 | 사용자 또는 작업 공간(폴더) 설정 | 워크스페이스 전체 및 각 폴더별 세밀한 설정 적용 가능 |
Photo by ThisIsEngineering on Pexels
여러 프로젝트 워크스페이스 설정, 3단계로 끝내기
VSCode 워크스페이스를 설정하는 과정은 생각보다 간단합니다. 다음 3단계를 따라하면, 몇 분 안에 다중 프로젝트 환경을 구축할 수 있습니다. 이 과정은 작업 효율을 획기적으로 개선하며, 개발자가 온전히 코드에 집중할 수 있도록 돕습니다.
- VSCode에서 폴더 추가 — VSCode를 실행한 후, 이미 열려 있는 폴더가 있다면 해당 창에서 ‘파일(File)’ 메뉴를 클릭하고 ‘워크스페이스에 폴더 추가(Add Folder to Workspace…)’를 선택합니다. 만약 아무 폴더도 열려있지 않다면, 먼저 첫 번째 프로젝트 폴더를 ‘파일 > 폴더 열기(Open Folder…)’로 연 후 이 단계를 진행합니다. 필요한 모든 프로젝트 폴더를 동일한 방식으로 추가합니다.
- 워크스페이스 저장 — 모든 폴더를 추가했다면, 이제 이 프로젝트들의 구성을 워크스페이스 파일로 저장할 차례입니다. ‘파일(File)’ 메뉴에서 ‘워크스페이스를 다른 이름으로 저장(Save Workspace As…)’을 선택합니다. 원하는 이름(예:
my-fullstack-dev.code-workspace)으로 저장하고, 되도록 프로젝트들을 담고 있는 상위 폴더에 저장하는 것이 관리상 편리합니다. 이.code-workspace파일은 모든 프로젝트 폴더의 경로와 워크스페이스 고유 설정을 담고 있습니다. - 저장된 워크스페이스 열기 — 이제부터는 개별 프로젝트 폴더를 여는 대신, 방금 저장한
.code-workspace파일을 열기만 하면 됩니다. VSCode를 다시 시작하거나, ‘파일 > 워크스페이스 열기(Open Workspace…)’를 통해 해당 파일을 선택하면, 추가했던 모든 프로젝트 폴더가 단일 VSCode 창에 함께 나타납니다. 이 방법을 통해 매번 프로젝트를 일일이 열 필요 없이, 단 한 번의 클릭으로 전체 개발 환경을 로드할 수 있습니다.
.code-workspace 파일은 JSON 형식으로 이루어져 있습니다. 이 파일을 직접 열어 folders 배열 내의 경로를 수정하거나, settings 객체 안에 워크스페이스 전용 설정을 추가할 수 있습니다. 예를 들어, 특정 워크스페이스에서만 적용될 폰트 크기나 테마를 지정하는 것이 가능합니다.
Photo by Negative Space on Pexels
워크스페이스를 120% 활용하는 관리 팁
워크스페이스 설정만으로도 개발 환경이 크게 개선되지만, 몇 가지 추가적인 팁을 통해 그 효율을 120% 이상 끌어올릴 수 있습니다. 통합 터미널 활용부터 개별 폴더 설정까지, 워크스페이스의 잠재력을 최대한 활용해 보세요.
첫째, 통합 터미널의 적극적인 활용입니다. VSCode 워크스페이스에서는 각 프로젝트 폴더별로 독립적인 터미널을 열 수 있습니다. 예를 들어, 프론트엔드 폴더에서는 npm start를 실행하고, 백엔드 폴더에서는 python manage.py runserver를 실행하는 터미널을 동시에 띄워 놓고 작업할 수 있습니다. 터미널 탭을 전환하며 각 프로젝트의 로그를 한눈에 확인하고 명령어를 실행함으로써, 여러 개의 외부 터미널 창을 관리하는 번거로움을 완전히 없앨 수 있습니다.
둘째, 워크스페이스별 확장 프로그램 및 설정 관리입니다. 특정 프로젝트에만 필요한 확장 프로그램이 있다면, 워크스페이스 설정 파일(.code-workspace)에 해당 확장을 추천하거나 비활성화하는 설정을 추가할 수 있습니다. 또한, 워크스페이스 settings.json 파일을 통해 특정 워크스페이스에서만 적용되는 언어별 설정, 린터 규칙, 포맷터 설정 등을 세밀하게 제어할 수 있습니다. 이를 통해 불필요한 확장 프로그램이 다른 프로젝트에 영향을 주지 않도록 약 80%의 성능 최적화를 기대할 수 있습니다.
워크스페이스 설정은 사용자 설정(User Settings)보다 우선하며, 특정 폴더 내의
.vscode/settings.json 파일은 워크스페이스 설정보다 우선합니다. 설정 충돌이 발생할 경우, 이 우선순위를 이해하고 조정하는 것이 중요합니다.
VSCode 워크스페이스는 여러 프로젝트를 동시에 개발하는 개발자에게 필수적인 기능입니다. 하나의 VSCode 창에서 모든 프로젝트를 통합 관리하고, 각 프로젝트별 독립적인 환경을 구축함으로써 개발 생산성을 크게 높일 수 있습니다.
지금 바로 적용해 보세요.
- VS Code 공식 문서: Multi-root Workspaces — VS Code의 워크스페이스 기능에 대한 상세한 공식 안내입니다.
- VS Code 공식 문서: User and Workspace Settings — 사용자 및 워크스페이스 설정의 작동 방식과 우선순위에 대해 설명합니다.
동영상으로 보는 VSCode 여러 프로젝트 워크스페이스 설정 및 관리 팁
글로 충분하지 않다면 관련 영상을 함께 보세요. 클릭하면 YouTube에서 검색 결과로 이동합니다.
자주 묻는 질문
Q. VSCode 워크스페이스는 정확히 무엇이며, 단순히 폴더를 여는 것과 어떻게 다른가요?
A. VSCode 워크스페이스는 하나 이상의 프로젝트 폴더를 특정 VSCode 설정, 확장 기능, 태스크와 함께 하나의 논리적 단위로 묶는 방법입니다. 단일 폴더를 여는 것과 달리, 워크스페이스는 여러 개의 (잠재적으로 관련 없는) 프로젝트 디렉토리를 동시에 관리하고, 그들의 결합된 상태를 저장할 수 있게 해줍니다.
Q. VSCode 워크스페이스는 어떻게 생성하고 저장하나요?
A. 워크스페이스를 생성하려면, `파일(File) > 워크스페이스에 폴더 추가(Add Folder to Workspace…)`로 이동하여 포함하고 싶은 모든 프로젝트 폴더를 선택하세요. 모든 폴더가 추가되면, `파일(File) > 워크스페이스를 다른 이름으로 저장(Save Workspace As…)`을 통해 `.code-workspace` 파일을 저장할 수 있으며, 이 파일을 사용하여 모든 폴더를 한 번에 열 수 있습니다.
Q. 여러 프로젝트에 VSCode 워크스페이스를 사용하는 주요 이점은 무엇인가요?
A. 워크스페이스는 여러 관련 또는 비관련 프로젝트를 한 번의 클릭으로 열고, 창 상태, 열린 파일 및 터미널 세션을 저장하여 개발을 간소화합니다. 또한, 프로젝트별 설정 및 확장 기능을 정의하여 충돌을 방지하고 다른 프로젝트 간에 일관된 환경을 보장할 수 있습니다.
Q. 하나의 워크스페이스 내에서 각 프로젝트별로 다른 설정(예: 린터 규칙 또는 디버깅 구성)을 가질 수 있나요?
A. 네, 물론입니다! VSCode 워크스페이스는 설정에 대한 세밀한 제어를 가능하게 합니다. 전역 설정, 워크스페이스별 설정(`.code-workspace` 파일 내), 그리고 각 프로젝트 내의 `.vscode` 폴더를 통해 폴더별 설정까지 정의할 수 있어, 다른 프로젝트에 영향을 주지 않으면서 각 프로젝트가 고유한 구성을 가질 수 있도록 보장합니다.
📚 함께 읽으면 좋은 글