1 VSCode(Visual Studio Code)란 무엇인가?
1) VSCode란?
→ 프로그래밍할 때 코드를 쓰고 정리할 수 있게 도와주는 코드 편집기
→ 자동완성, 오류 감지, 색상 표시 등 편리한 기능이 많음
→ Microsoft에서 2015년에 만든 무료 프로그램
→ Windows, macOS, Linux 모두에서 사용 가능
2) 누가 VSCode를 쓰나요?
→ 프로그래밍 입문자부터 전문 개발자, 데이터 분석가까지 다양한 사용자
→ Python, JavaScript, HTML/CSS, Java 등 다양한 언어를 지원
3) Visual Studio와의 차이점
→ VSCode는 가볍고 빠른 코드 편집기
→ Visual Studio는 복잡하고 무거운 전문 개발 도구
→ 초보자에게는 VSCode가 더 적합
4) VSCode의 장점
→ 무료로 사용이 가능
→ 설치 및 실행이 간단하고 가벼움
→ 확장 기능으로 자신만의 개발 환경을 구성 가능
→ 자동완성, 오타 감지 등 초보자에게 유용한 기능이 많음
2 VSCode 설치 및 한글화
1) 설치 방법
→ VSCode 공식 홈페이지에 접속
→ 자신의 운영체제에 맞는 파일을 다운로드
→ 설치 마법사 안내에 따라 설치를 진행
→ 설치 후 실행
2) 한글 언어팩 설치 방법
→ VSCode 실행 후 좌측 확장 아이콘을 클릭하거나 또는 Ctrl + Shift + X를 클릭
→ 검색창에 Korean 또는 Korean language pack을 입력
→ 결과에서 설치 클릭 후 "Change Language and Restart" 선택
3) 한글화가 되지 않았을 때
→ 상단 메뉴의 [보기 > 명령 팔레트] 또는 Ctrl + Shift + P를 클릭
→ display 입력 후 표시 언어 구성 클릭
→ 한국어(ko) 선택 후 재시작
4) 자동 업데이트
→ VSCode는 자동으로 최신 버전으로 유지되므로 따로 업데이트할 필요가 없음
3 VSCode 기본 화면 구성
1) 활동 표시줄 (Activity Bar)
→ 화면 왼쪽에 세로로 배치된 아이콘 메뉴
→ 주요 기능은 파일 탐색기, 검색, 소스 제어, 디버그, 확장 기능 등이 있음
→ 자주 사용하는 기능은 위로 올리고, 사용하지 않는 건 숨기거나 제거가 가능
2) 사이드바 (SideBar)
→ 활동 표시줄에서 선택한 기능의 상세 내용을 보여주는 공간
→ 파일 구조, 검색 결과, 확장 목록 등이 표시됨
3) 편집기 영역 (Editor)
→ 코드를 작성하고 수정하는 메인 공간
→ 탭 형태로 여러 파일을 열기가 가능
→ Ctrl + \로 화면을 분할하고, Ctrl + 1 / Ctrl + 2로 그룹 간 이동
4) 상태 표시줄 (Status Bar)
→ 화면 하단 파란 줄
→ 현재 파일의 인코딩, 줄 끝 형식, 언어, 자동 저장 여부 등 표시
→ 클릭으로 빠른 설정 변경 가능
5) 명령 팔레트 (Command Palette)
→ 다양한 명령어를 검색해 실행할 수 있는 기능
→ 단축키는 Ctrl + Shift + P
6) 미니맵 (Minimap)
→ 전체 코드의 축소판 미리보기
→ 긴 코드에서 구조 파악 및 빠른 이동에 유용
4 폴더 및 파일 다루기
1) 폴더 열기 / 만들기
→ 파일 > 폴더 열기 메뉴에서 프로젝트 폴더 선택
→ 탐색기에서 우클릭 > 새 폴더 생성
2) 새 파일 만들기
→ 탐색기 상단의 새 파일 아이콘 클릭
→ 이름 + 확장자 입력 후 Enter
3) 저장 / 자동 저장
→ Ctrl + S로 저장
→ 상태 표시줄에서 'Auto Save'로 활성화 가능
4) 파일 전환 / 닫기
→ Ctrl + Tab으로 최근 파일 전환
→ 탭의 X 아이콘으로 닫기
5) 파일 이동 / 정렬
→ 드래그로 위치 변경 가능
→ 이름 순 자동 정렬, 마우스로 순서 조절도 가능
6) 미리보기 탭 해제
→ 한 번 클릭 시 미리보기 탭으로 열림 -> 두 번 클릭 시 고정
→ 설정 > "Enable Preview" 옵션 끄기
7) 파일명 변경 / 삭제
→ 우클릭 -> 이름 바꾸기 / 삭제 선택
8) 인코딩 깨짐 해결
→ 상태 표시줄의 인코딩 클릭 -> UTF-8로 다시 열기 선택
9) 파일 고정 / 자동 열림 방지
→ 자주 여는 파일 : 탭 우클릭 후 고정
→ 설정 > explorer.autoReveal: false 설정
10) Git 상태 아이콘 이해
→ ●은 저장 안 됨, M은 변경됨, U는 Git 미추적 파일
5 확장 기능 설치 및 추천 플러그인
1) 확장 기능이란?
→ VSCode에 필요한 기능을 추가하는 도구
→ 코드 자동 정리, 언어 지원, 실시간 미리보기 등이 있음
2) 설치 방법 2가지
→ 왼쪽 네모 4개 아이콘을 클릭하여 원하는 확장 이름을 검색하여 설치
→ 명령 팔레트에서 Extensions: Install Extensions를 입력하여 확장을 검색하고 설치
3) 추천 확장 기능 (입문자용)
| 확장 이름 | 설명 |
| Korean Language Pack | VSCode를 한글로 변환 |
| Prettier | 코드 자동 정리 |
| Live Server | HTML 실시간 미리보기 |
| Python | 파이썬 개발 지원 |
| C/C++ | C/C++ 개발 환경 지원 |
| Code Runner | 다양한 언어 코드 빠른 실행 |
| Bracket Pair Colorizer 2 | 괄호 색으로 짝 구분 |
| GitLens | Git 변경 내역 확인 |
※ 사용하지 않는 언어 확장은 설치하지 않아도 됨
4) 설치 후 관리 팁
→ 확장 아이콘(네모 4개)에서 비활성화/삭제 가능
→ 설정 변경은 파일 > 기본 설정 > 설정
→ 같은 기능 확장을 여러 개 설치하면 충돌 위험이 있으므로 설치 금지
→ 검색 시 영어 키워드를 활용
5) 문제 해결 팁
| 문제 | 해결 방법 |
| 설치했는데 작동 안 함 | VSCode를 재시작 -> 삭제 후 재설치 |
| 단축키 충돌 | 파일 > 기본 설정 > 키보드 단축키에서 수정 |
| 확장 아이콘 안 보임 | Ctrl + Shift + X 또는 보기 > 확장 메뉴 사용 |
6 테마 및 아이콘 설정
1) 테마란?
→ VSCode 전체 색상 분위기
2) 아이콘 테마란?
→ 사이드바 파일/폴더 아이콘 스타일 설정
3) 변경 방법
→ 명령 팔레트로 Color Theme 또는 File Icon Theme 입력 후 선택
→ 파일 > 기본 설정 > 테마 클릭
4) 추천 테마 & 아이콘
| 구분 | 추천 |
| 테마 | One Dark Pro, Dracula, GitHub Theme |
| 아이콘 | Material Icon Theme, VSCode Icons |
5) 고급 팁
→ 자동 다크/라이트 전환 확장 사용 가능
7 통합 터미널 사용법
1) 통합 터미널이란?
→ VSCode 내부에서 명령어 실행 가능한 창
→ 외부 cmd/bash 없이 폴더 이동, 파일 실행, Git 사용 가능
2) 열기 방법
→ 터미널 > 새 터미널
→ Ctrl + Shift + `
3) 자주 쓰는 명령어
| 명령어 | 설명 |
| dir / ls | 폴더 내 파일 목록 확인 |
| cd 폴더명 / cd .. | 폴더 이동 / 상위 폴더 이동 |
| cls / clear | 터미널 화면 초기화 |
| python 파일명.py | 파이썬 파일 실행 |
4) 셀 종류 변경 (선택)
→ Ctrl + Shift + P -> Select Default Profile로 셀 변경
→ Windows는 PowerShell, CMD / Git Bash 선택 가능
5) 자주 발생하는 에러 메시지
| 에러 | 원인 |
| command not found | 명령어 오타 / 미설치 |
| "node"는 명령이 아닙니다 | Node.js 미설치 or 환경변수 오류 |
| Permission denied | 권한 부족 |
8 VSCode 자주 묻는 질문 (FAQ)
1) 한글로 설정했는데 영어로 나와요
→ Ctrl + Shift + P -> Configure Display Language에서 ko 선택
2) 글자가 너무 커요/작아요
→ Ctrl + = / - / 0 또는 설정 > font size에서 조절
3) 한글 입력 안 됨
→ 입력기 복원 / 확장 기능 충돌 확인
4) 자동 저장 설정
→ 파일 > 자동 저장 또는 상태표시줄의 Auto Save 클릭
5) 자동 완성 끄기
→ 설정에서 suggest 검색 -> 관련 항목 끄기
6) 테마, 확장 다른 PC에서 공유
→ 설정 동기화 기능으로 백업 후 복원
7) 줄 끝 문자 CRLF/LF 바꾸기
→ 상태표시줄 클릭 -> 원하는 포맷 선택
8) 한글 깨짐
→ 상태표시줄 인코딩 클릭 -> UTF-8로 다시 열기
9) 설치 위치 바꾸기
→ 설치 시 위치 변경 가능
→ 초보자는 기본 경로 추천
VSCode에 대해 더 상세한 설명을 원하는 분들은 아래 사이트에 접속
VSCode 뿐만 아니라 다른 부분에 대해 알고 싶은 분들은 아래 사이트에 접속하여 원하는 링크에 접속
'공통' 카테고리의 다른 글
| 코딩이란? 누구나 이해하는 코딩 개념부터 시작하는 입문 가이드 (9) | 2025.06.26 |
|---|---|
| [프로그래밍 기초] 제어 구조 완벽 정리 - 순차, 조건, 반복문과 흐름도까지 쉽게 설명 (1) | 2025.06.25 |
| 버전이란? 의미부터 버전 번호, 종류, 충돌까지 쉽게 정리 (1) | 2025.06.24 |
| 개발 환경이란? 코딩 입문자를 위한 쉬운 설명과 필수 도구 총정리 (0) | 2025.06.22 |
| 4차 산업혁명이란? 핵심 기술부터 우리의 미래까지 한눈에 정리! (1) | 2025.06.21 |