"터미널은 대화창이라면서요. 근데 코드는 어디에 적어요?" "메모장으로 하면 안 되나요?"

메모장으로 해도 됩니다. 근데 요리사가 식칼 대신 커터칼로 요리하는 것과 같아요. 할 수는 있지만, 무지하게 힘들죠.

우리는 **VS Code (Visual Studio Code)**라는 전문가용 조리대를 쓸 거예요. 전 세계 개발자의 70% 이상이 이걸 씁니다.

왜 쓸까요?

  • 자동 완성: cl만 쳐도 console.log를 추천해줌
  • 에러 표시: 틀린 문법은 빨간 줄로 알려줌
  • 터미널 내장: 따로 까만 창 안 열어도 됨

오늘은 이 최고의 조리대를 우리 부엌에 들여놓겠습니다.

설치하기 (너무 쉬움 주의)

  1. VS Code 공식 홈페이지 접속
  2. 파란색 'Download' 버튼 클릭
  3. 설치 파일 실행해서 '다음, 다음, 완료'

끝입니다.

1단계: VS Code 해부하기

VS Code를 켜면 뭔가 복잡해 보이죠? 딱 3군데만 알면 됩니다.

  1. 탐색기 (왼쪽 바): 파일 목록 보는 곳 (냉장고)
  2. 에디터 (가운데): 코드 짜는 곳 (도마)
  3. 터미널 (아래쪽): 명령어 치는 곳 (가스레인지)

VS Code 인터페이스 비교: 냉장고(탐색기), 도마(에디터), 가스레인지(터미널)

이 3개가 한 화면에 다 있어서 편한 거예요.

💡 터미널이 안 보인다면? 상단 메뉴에서 Terminal -> New Terminal을 누르거나 단축키 `Ctrl + `` (물결 표시 키)를 눌러보세요.

2단계: 필수 확장 프로그램 설치

VS Code는 '확장 프로그램(Extension)'이라는 걸로 기능을 추가할 수 있어요. 스마트폰에 앱 까는 거랑 똑같아요.

왼쪽 바에서 '네모 4개 아이콘(Extensions)'을 누르세요. 그리고 검색창에 딱 하나만 검색해서 설치합시다.

1. Korean Language Pack (한국어 패키지)

  • 검색: Korean
  • 맨 위에 나오는 'Korean Language Pack for Visual Studio Code' 클릭
  • 'Install' 버튼 클릭
  • 오른쪽 아래에 'Restart' 버튼 뜨면 클릭

이제 메뉴가 한글로 바뀔 거예요. 마음이 편안해지죠?

3단계: 터미널에서 VS Code 열기

자, 여기서 "바이브 코더"만의 꿀팁 나갑니다. 보통은 VS Code 아이콘 클릭해서 열고 -> 파일 -> 폴더 열기... 이렇게 하죠?

우리는 터미널 전사들이잖아요. 멋있게 열어봅시다.

  1. 터미널을 켜세요.
  2. 작업하고 싶은 폴더로 이동 (예: cd my-project)
  3. 이렇게 치세요:
code .

code는 "VS Code 실행해!", .(점)은 "현재 폴더를 열어!"라는 뜻이에요. 엔터를 치면? 방금 그 폴더가 VS Code로 딱! 열립니다.

이게 진짜 개발자 바이브죠.

실습: 파일 만들고 저장해보기

  1. code . 명령어로 VS Code를 엽니다.
  2. 탐색기(왼쪽) 빈 공간에 우클릭 -> 새 파일
  3. 이름 입력: hello.txt
  4. 내용 입력: 안녕하세요! 바이브 코딩입니다.
  5. 저장: Ctrl + S (맥은 Command + S)

🚨 주의: 파일 이름 옆에 **동그라미(●)**가 떠 있으면 "저장 안 됨"이라는 뜻이에요. 저장하면 X 표시로 바뀝니다. AI한테 "코드 고쳤어"라고 하기 전에 꼭 저장했는지 확인하세요!

정리: 최고의 요리 환경 완성

이제 여러분은:

  1. Claude Code (신입사원)
  2. 터미널 (대화창)
  3. VS Code (작업대/요리대)

이 3가지, 개발의 3신기를 모두 갖췄습니다.

이제 재료(코드)만 있으면 뭐든 만들 수 있어요. 근데 잠시만요, 요리하다 망치면 어떡하죠? 소금 대신 설탕을 왕창 부어버리면?

그래서 우리에겐 **"세이브 포인트"**가 필요합니다. 다음 편에서는 시간을 되돌리는 마법, Git을 배워볼게요.

셀프체크

오늘 배운 내용, 제대로 이해했는지 확인해볼까요?

  • 현재 폴더를 VS Code로 여는 명령어는? (정답: code .)
  • VS Code 화면 구성 3요소는? (정답: 탐색기, 에디터, 터미널)
  • 파일 이름 옆에 동그라미(●)는 무슨 뜻? (정답: 저장 안 됨)

다음 글 예고

"아, 실수로 다 지웠다!" "어제 코드가 더 잘 돌아갔는데..."

이런 비극을 막기 위해 Git이 존재합니다. Git은 어려워 보이지만, 사실 "게임 세이브"랑 똑같아요. 원하는 시점에 '저장'하고, 언제든 '불러오기' 할 수 있죠.

다음 편에서 Git이라는 타임머신을 설치해봅시다.