VS Code 준비하기: 설치·한국어 설정·폴더 열기
VS Code와 AI 확장을 구분하고, 한국어 화면으로 바꾼 뒤 실습 폴더를 엽니다.
VS Code만 설치하면 AI 코딩이 되나요?
VS Code는 코드를 읽고 편집하는 프로그램입니다. 이 과정에서는 VS Code를 준비한 뒤 Claude Code 또는 Codex 확장 하나를 선택해 연결합니다. 두 확장과 다른 AI 서비스를 모두 설치할 필요는 없습니다.
준비물은 지원되는 컴퓨터, 인터넷, 실습 폴더입니다. 이 글의 완료 기준은 VS Code가 열리고, 한국어 표시가 적용되고, 올바른 폴더가 보이는 것입니다. AI 로그인은 다음 글에서 진행합니다.
1. Mac·Windows에 설치하기
- VS Code 공식 다운로드 · 영문을 엽니다. Visual Studio와 Visual Studio Code는 이름이 비슷한 다른 제품이므로 확인하세요.
- Mac은 칩 종류, Windows는 시스템 종류에 맞는 설치 파일을 선택합니다. 지원 조건도 읽습니다.
- Mac에서는 내려받은 앱을 응용 프로그램 폴더에 넣어 실행합니다. 압축 파일로 제공되면 먼저 압축을 풉니다.
- Windows에서는 설치 프로그램을 실행하고 안내를 읽습니다. 설치 후 시작 메뉴에서 Visual Studio Code를 실행합니다.
- VS Code의 Welcome 화면이나 편집기 창이 보이면 설치는 완료입니다. 아직 AI 기능이 연결된 상태는 아닙니다.
2. 한국어 표시 언어로 바꾸기
- Mac은 Command+Shift+P, Windows는 Ctrl+Shift+P를 눌러 명령 팔레트를 엽니다. 화면 위쪽에 명령 검색창이 나옵니다.
Configure Display Language를 입력해 선택합니다.- 목록에서 한국어(ko)를 찾습니다. 언어 팩 설치가 필요하면 공식 Microsoft 한국어 언어 팩인지 확인하고 설치합니다.
- 재시작 안내가 나오면 작업을 저장한 뒤 재시작합니다.
- 메뉴 일부가 한국어로 표시되는지 확인합니다. 확장 프로그램의 모든 문구까지 번역되는 것은 아닙니다.
3. 실습 폴더 열고 화면 구분하기
파일 → 폴더 열기에서 code6office-practice를 선택합니다. 파일 하나를 여는 기능과 폴더 전체를 여는 기능을 구분하세요. 폴더 신뢰 안내가 나오면 직접 만든 실습 폴더가 맞는지 확인한 뒤 판단합니다.
- 탐색기: 현재 폴더의 파일 목록입니다.
- 편집기: 파일 내용을 읽고 쓰는 중앙 영역입니다.
- 확장 프로그램: 추가 도구를 설치하는 영역입니다.
- 터미널: 명령을 입력하는 영역입니다. AI 대화창과 다릅니다.
아직 파일이 없으면 목록이 비어 있어도 정상입니다. 폴더 이름과 위치를 확인했다면 다음 중 하나만 선택하세요.
첫 HTML 실습에는 Node.js·Git·GitHub 연결이 필수는 아닙니다. 이후 사용하는 프로젝트가 필요로 할 때 설치합니다.
정상 확인과 오류 구분
- 한국어가 없어요: 표시 언어 명령과 언어 팩 목록을 확인합니다. 한국어 프로그래밍 언어를 설치하는 것은 아닙니다.
- 폴더가 안 보여요: 단일 파일만 열었는지 확인하고 폴더 열기를 다시 사용합니다.
- AI가 응답하지 않아요: 이 글은 편집기 준비 단계입니다. 다음 글에서 확장 설치와 계정 로그인을 완료해야 합니다.
- 정체를 모르는 확장이 나와요: 이름만 보지 말고 공식 문서에서 연결한 확장인지와 게시자를 확인합니다.
완료 기준: 한국어 화면에서 실습 폴더를 열었습니다. 파일을 읽는 기능부터 익히고, 선택한 AI 확장 하나로 다음 단계를 진행하세요.
공식 자료 · 2026. 11. 14. 확인
공식 설치·표시 언어 문서는 확인한 영문 페이지를 연결했습니다. 이 글은 문서 기반으로 작성했으며 모든 환경의 설치 화면을 재현한 것은 아닙니다.