상세 컨텐츠

본문 제목

VSCode 설치부터 첫 사용까지 — 윈도우 초보자 완전 따라하기

서버·개발/코드 노트

by 사이 (SAI) 2026. 7. 18. 12:30

본문

728x90
반응형

이 글은 "개발 도구 따라하기" 시리즈 1편입니다. 개발 환경이 뭔지 개념부터 궁금하다면 앞선 글 "2026 개발 환경 세팅 기본기"(dev-environment-setup-2026)를 먼저 보시고, 이번 글은 그 실습편으로 VSCode를 직접 깔아봅니다.

VSCode 설치는 어렵지 않습니다. 순서대로 따라오면 10~15분 정도면 코딩을 시작할 준비가 끝납니다.

이 글은 개발 경험이 전혀 없는 윈도우 사용자를 기준으로, 다운로드부터 한글 설정과 첫 실행까지 하나씩 짚어갑니다. 맥 사용자를 위한 차이점은 뒤쪽에 따로 모아뒀습니다.

VSCode는 쉽게 말해 코딩용 만능 작업대입니다. 코드를 쓰고, 저장하고, 명령어를 실행하는 일을 이 하나로 다 할 수 있습니다.

윈도우 11 화면에 파란 톤의 VSCode 첫 실행 창이 떠 있는 데스크 전경

VSCode는 Microsoft가 배포하는 무료 코드 에디터입니다.
공식 사이트(code.visualstudio.com)에서 다운로드 버튼만 누르면 관리자 권한 없이 설치되고,
확장 탭에서 한글 팩을 깔면 메뉴가 한국어로 바뀝니다. 아래 5단계를 순서대로 따라오면 됩니다.

시작하기 전에 — 준비물과 헷갈리기 쉬운 이름 하나

필요한 건 인터넷에 연결된 윈도우 PC 한 대뿐입니다.

VSCode는 용량이 작습니다. 설치 파일은 200MB 이하, 설치하고 나서도 500MB 이하라 요즘 나온 PC라면 사양 걱정은 거의 없습니다.

Visual Studio Code 공식 요구사항 문서 기준으로 1.6GHz 이상 CPU와 1GB 이상 RAM이면 충분합니다.

시작 전에 이름 하나만 짚고 가겠습니다.

우리가 설치할 것은 "Visual Studio Code(줄여서 VS Code, VSCode)"입니다.

이름이 비슷한 "Visual Studio 2026"은 훨씬 무겁고 큰 다른 프로그램이니, 검색이나 다운로드에서 헷갈리지 않게 조심하면 됩니다.

Step 1. 공식 사이트에서 내려받기

첫 단계는 설치 파일을 안전한 공식 출처에서 받는 일입니다.

브라우저 주소창에 code.visualstudio.com을 입력해 공식 사이트에 들어갑니다.

화면에 있는 파란색 "Download for Windows" 버튼을 누릅니다.

이 버튼을 누르면 초보자에게 가장 편한 설치 파일(User Installer)이 자동으로 내려받아집니다.

🔽 VSCode 공식 다운로드 바로가기 →

✅ 이렇게 보이면 성공: 다운로드 폴더에 VSCodeUserSetup-x64-1.xxx.exe 같은 파일이 생깁니다.

⚠️ 이게 안 되면: 검색 결과에 뜨는 다른 사이트가 아니라 반드시 code.visualstudio.com에서 받으세요. 드물게 브라우저가 "이 파일은 자주 다운로드되지 않습니다" 같은 경고를 띄우는데, 공식 출처에서 받은 파일이라면 "유지" 또는 "계속"으로 진행하면 됩니다.

브라우저로 code.visualstudio.com에 접속해 파란 다운로드 버튼이 강조된 다운로드 페이지 화면

Step 2. 설치 마법사 실행과 약관 동의

이제 받은 파일을 실행해 설치를 시작합니다.

다운로드 폴더에서 받은 exe 파일을 더블클릭합니다.

설치 마법사가 열리면 첫 화면에서 "동의합니다(I accept the agreement)"를 선택하고 "다음(Next)"을 누릅니다.

여기서 나오는 약관은 사용권 계약이라, 동의하고 넘어가면 됩니다.

✅ 이렇게 보이면 성공: 설치 위치를 묻는 화면으로 넘어갑니다. 기본값 그대로 두면 됩니다.

⚠️ 이게 안 되면: User Installer는 원래 관리자 권한을 묻지 않습니다. 만약 "관리자 권한" 창이 뜬다면 System Installer를 받은 것이니, 취소하고 Step 1에서 기본 다운로드 버튼으로 다시 받으세요.

Step 3. 추가 작업 선택 — 이 화면만 신경 쓰면 됩니다

이 화면이 설치에서 가장 중요한 부분입니다.

"추가 작업 선택(Select Additional Tasks)" 화면에는 체크박스가 몇 개 나옵니다.

메뉴 표기는 언어와 버전에 따라 조금씩 다를 수 있으니, 영문 이름을 함께 봐두면 헷갈리지 않습니다.

다음 세 가지를 체크하는 걸 권합니다.

체크 항목 체크하면 좋은 이유
Add to PATH 터미널에서 code . 로 폴더를 바로 열 수 있음 (보통 기본 체크)
Open with Code (파일) 파일 우클릭 메뉴에 "Code로 열기"가 생김
Open with Code (폴더) 폴더 우클릭 메뉴에 "Code로 열기"가 생김

세 항목을 체크했다면 "다음"을 누르고 "설치(Install)"를 누릅니다.

바탕화면 아이콘 만들기 같은 나머지 옵션은 취향대로 하면 됩니다.

✅ 이렇게 보이면 성공: 설치 진행바가 끝까지 차오르고 완료 화면이 나옵니다.

⚠️ 이게 안 되면: 체크를 깜빡했더라도 나중에 고칠 수 있습니다. VSCode를 실행한 뒤 Ctrl+Shift+P를 눌러 "shell command"를 검색하고 "Shell Command: Install 'code' command in PATH"를 실행하면 PATH만 따로 추가됩니다.

설치 마법사의 추가 작업 선택 화면에서 Add to PATH 등 체크박스 세 개가 선택된 대화상자

Step 4. 첫 실행 — 시작 화면 확인

설치가 잘 됐는지 실제로 실행해 확인합니다.

완료 화면에서 "Launch Visual Studio Code"를 체크한 뒤 마무리하거나, 시작 메뉴에서 VSCode를 찾아 실행합니다.

여기까지 왔으면 절반은 넘어온 셈입니다.

✅ 이렇게 보이면 성공: 시작(Welcome) 탭이 뜨고, 화면 맨 왼쪽에 세로로 아이콘이 늘어선 막대(액티비티 바)가 보입니다.

⚠️ 이게 안 되면: 실행이 안 되면 PC를 한 번 재부팅한 뒤 다시 시도하세요. 그래도 안 되면 파일을 다시 받아 재설치하면 대부분 해결됩니다.

Step 5. 메뉴를 한글로 바꾸기

메뉴가 영어라 낯설다면 한국어로 바꿀 수 있습니다.

물론 영어 그대로 써도 아무 문제 없으니, 원하는 사람만 하면 됩니다.

왼쪽 액티비티 바에서 네모 네 개 모양의 확장(Extensions) 아이콘을 누릅니다. 단축키는 Ctrl+Shift+X입니다.

검색창에 "Korean"을 입력하고, 게시자가 Microsoft인 "Korean Language Pack"을 찾아 "Install"을 누릅니다.

✅ 이렇게 보이면 성공: 우측 하단에 다시 시작(Restart) 알림이 뜨고, 누르면 VSCode가 재시작되면서 메뉴가 한글로 바뀝니다.

⚠️ 이게 안 되면: 알림을 놓쳤다면 Ctrl+Shift+P를 눌러 "Configure Display Language(표시 언어 구성)"를 검색하고 한국어(ko)를 선택한 뒤 재시작하면 됩니다.

VSCode 확장 탭에서 Korean Language Pack을 검색해 Install 버튼이 강조된 화면


설치가 끝났다면 — 꼭 알아둘 기본 사용법

설치는 끝났으니, 이제 실제로 쓸 때 필요한 최소한의 조작만 익히면 됩니다.

가장 먼저 기억할 것은 "폴더 단위로 작업한다"는 점입니다.

파일 하나만 여는 게 아니라, 파일(File) 메뉴의 "폴더 열기(Open Folder)"로 작업할 폴더를 먼저 여는 게 기본입니다.

새 파일은 Ctrl+N으로 만들고, Ctrl+S로 저장합니다. 저장 안 한 파일은 탭에 흰 점으로 표시됩니다.

명령어를 실행하고 싶다면 Ctrl+백틱(숫자 1 왼쪽 키)으로 화면 아래에 내장 터미널을 열 수 있습니다.

메뉴에서 기능을 못 찾겠다면 Ctrl+Shift+P로 명령 팔레트를 여세요. 거의 모든 기능을 이름으로 검색해 실행할 수 있는 만능 검색창입니다.

개인적으로는 초보 단계에서 이 명령 팔레트 하나만 손에 익혀두면, 낯선 메뉴를 헤매는 시간이 크게 줄어든다고 봅니다.

맥은 이 부분만 다릅니다

맥 사용자라면 아래 몇 가지만 다르게 하면 됩니다.

다운로드는 code.visualstudio.com에서 "Download for Mac"을 누릅니다.

칩 선택 옵션이 세 개(Universal / Intel chip / Apple silicon) 나오는데, 잘 모르겠으면 인텔과 애플 실리콘에 모두 쓰이는 Universal을 고르면 됩니다.

맥은 윈도우 같은 설치 마법사가 없습니다.

받은 파일을 열면 나오는 "Visual Studio Code.app"을 응용 프로그램(Applications) 폴더로 드래그하는 것이 설치입니다.

앱을 처음 열 때 macOS가 "확인되지 않은 개발자"라며 막을 수 있습니다. 이때는 앱 아이콘을 우클릭해 "열기(Open)"를 누르거나, 시스템 설정의 개인정보 보호 및 보안에서 "그래도 열기(Open Anyway)"를 선택하면 됩니다. (이 경고 문구와 화면은 macOS 버전에 따라 다를 수 있어 발행 전 공식 문서 확인이 필요합니다.)

맥에서 터미널의 code . 명령을 쓰려면 한 단계가 더 필요합니다. VSCode를 실행한 뒤 Cmd+Shift+P로 "shell command"를 검색해 "Shell Command: Install 'code' command in PATH"를 실행하고 터미널을 껐다 켜면 됩니다. (윈도우는 설치 때 PATH 체크로 자동 처리되는 부분이라, 이게 맥과의 가장 큰 차이입니다.)

단축키는 대부분 CtrlCmd로 바뀝니다. 다만 터미널 열기 단축키인 Ctrl+백틱은 맥에서도 Control 키를 씁니다.

기능 윈도우
저장 Ctrl+S Cmd+S
명령 팔레트 Ctrl+Shift+P Cmd+Shift+P
터미널 열기 Ctrl+백틱 Ctrl+백틱
확장 탭 Ctrl+Shift+X Cmd+Shift+X
폴더 열기 Ctrl+K Ctrl+O Cmd+K Cmd+O

맥에서 Visual Studio Code 앱 아이콘을 응용 프로그램 폴더로 드래그하는 설치 화면

처음 깔 때 자주 막히는 부분

초보자가 설치 과정에서 특히 자주 걸리는 부분을 모았습니다.

설치 중 관리자 권한을 물어봐요

기본 다운로드 버튼으로 받은 User Installer는 관리자 권한이 필요 없습니다.

관리자 권한 창이 떴다면 System Installer를 받은 것이니, 취소하고 기본 버튼으로 다시 받으세요.

회사나 학교 PC라 권한이 없는 경우에도 User Installer면 설치할 수 있습니다.

한글 팩을 깔았는데 여전히 영어예요

한글 팩은 설치 후 반드시 재시작해야 적용됩니다.

다시 시작 알림을 놓쳤다면 Ctrl/Cmd+Shift+P로 "Configure Display Language"를 검색해 한국어(ko)를 고른 뒤 재시작하세요.

터미널에서 code . 가 안 먹혀요

윈도우는 설치 때 "Add to PATH"를 체크했는지 확인하고, 안 했다면 명령 팔레트에서 shell command를 검색해 설치합니다.

맥은 "Shell Command: Install 'code' command in PATH"를 실행한 뒤 터미널을 껐다 켜야 반영됩니다.

다운로드나 실행할 때 보안 경고가 떠요

공식 code.visualstudio.com에서 받은 파일이면 안전합니다.

윈도우에서 "Windows가 PC를 보호했습니다" 창이 뜨면 "추가 정보"를 눌러 실행하거나, 파일 속성에서 "차단 해제(Unblock)"를 체크한 뒤 실행하면 됩니다.

VSCode 정식 파일은 Microsoft가 서명해 대개 경고가 안 뜨지만, 브라우저나 보안 설정에 따라 나타날 수 있습니다.

폴더는 안 열고 파일만 열어서 헤매요

VSCode는 폴더 단위로 작업하는 게 기본입니다.

파일 하나만 열면 확장 기능이나 터미널 경로가 이상하게 동작할 수 있으니, "폴더 열기"로 작업 폴더를 먼저 여세요.

Final Check — 제대로 됐는지 확인

여기까지 따라왔다면 아래 항목을 하나씩 확인해 보세요. 다 체크되면 설치는 완벽합니다.

☐ VSCode가 실행되고 시작(Welcome) 탭이 보인다

☐ (원하면) 메뉴가 한국어로 바뀌었다

☐ 폴더 열기로 작업 폴더를 하나 열어봤다

☐ 새 파일을 만들고 Ctrl/Cmd+S로 저장해봤다

Ctrl+백틱으로 내장 터미널이 열린다

☐ (선택) 터미널에서 code .이 동작한다

마무리

여기까지 왔다면 코딩을 시작할 작업대는 다 갖춰진 셈입니다.

확장은 처음부터 많이 깔 필요 없습니다. 저장할 때 코드를 자동으로 정렬해 주는 Prettier, 웹 화면을 실시간으로 미리 보는 Live Server 정도만 필요할 때 추가해도 충분합니다.

개인적으로는 도구를 완벽히 세팅하려 애쓰기보다, 일단 폴더 하나 열고 파일을 만들어 저장해 보는 경험이 입문에는 훨씬 도움이 된다고 봅니다.

다음 편에서는 윈도우에서 리눅스 환경을 함께 쓰게 해주는 WSL 설치를 같은 방식으로 따라가 보겠습니다.

 

 

참고한 자료

Visual Studio Code 공식 문서의 윈도우 설치, 맥 설치, 시스템 요구사항 페이지와 Korean Language Pack 마켓플레이스 안내를 참고했습니다. 버전과 세부 화면은 발행 시점에 따라 달라질 수 있으니, 정확한 최신 정보는 공식 문서에서 확인하시길 권합니다.

728x90
반응형

관련글 더보기

댓글 영역