← 블로그 목록

2026년 6월 17일

VS Code 기본 기능 7가지 — 마케터가 안 깔아도 바로 쓰는 편한 기능 (+숨은 꿀팁)


VS Code 기본 기능 7가지 — 마케터가 안 깔아도 바로 쓰는 편한 기능 VS Code 처음 켜면 익스텐션부터 검색하게 되죠. 그런데 마케터가 쓰는 기능 대부분은 이미 안에 다 있어요. 안 깔아도 바로 쓰는 기본 4개 + 숨은 꿀팁 3개를 단축키와 함께 정리했어요.

VS Code를 처음 깔면 다들 비슷한 행동을 해요. "익스텐션 뭐부터 깔아야 하지?" 하고 검색창부터 켜죠. 유튜브에서 추천 익스텐션 20개를 받아 적고, 하나씩 깔다가 길을 잃어요. 그런데 막상 마케터가 매일 쓰는 기능 대부분은 이미 VS Code 안에 다 들어 있어요. 안 깔아도 됩니다.

"마케터의 클로드코드 실전" 환경 편 두 번째예요. 어제 글에서 "클로드코드는 왜 데스크탑 앱이 아니라 VS Code에서 쓰는가"를 풀었는데, 오늘은 그 화면에서 실제로 쓰는 편한 기능 7개를 보여드릴게요. 설치 없이 켜면 바로 있는 기본 4개와, 있는 줄 모르고 안 쓰는 숨은 꿀팁 3개예요. 전부 제 작업 화면 캡처와 단축키를 그대로 붙였어요.


데스크탑 앱보다 편한 이유 — '한 화면'에서 다 끝나요

어제 글의 핵심을 한 줄로 옮기면 이래요. 데스크탑 앱(ChatGPT·클로드 앱)은 화면이 대화창 하나예요. 반면 클로드코드 같은 코딩 에이전트는 파일을 직접 만들고 고치는데, 그 결과를 보고·확인하고·되돌릴 화면이 있어야 하죠. VS Code는 그 화면을 통째로 줘요.

그래서 "편하다"는 게 막연한 느낌이 아니에요. 만들고 → 보고 → 고치고 → 되돌리는 과정을 창 하나에서 끝내니까, 작업이 흩어지지 않아요. 아래 7개 기능이 바로 그 "한 화면"을 구성하는 부품들이에요. 익스텐션을 더 깔기 전에, 이것부터 손에 익히면 작업 속도가 달라져요.

먼저 안 깔아도 바로 쓰는 기본 기능 4개부터 볼게요.


기본 1 — 마크다운 미리보기: 쓴 글이 바로 보여요

마크다운 미리보기 — 원고 옆에 완성본 실시간 확인

마케터가 클로드코드로 만드는 원고는 대부분 마크다운(.md) 파일이에요. # 제목, **굵게** 같은 기호로 쓰여 있죠. 이 기호 그대로는 읽기 불편한데, VS Code는 완성된 모습으로 바꿔서 옆에 띄워줘요.

  • 단축키: 맥은 ⌘ K 누르고 이어서 V / 윈도우는 Ctrl KV
  • 왼쪽엔 코드(원본), 오른쪽엔 미리보기가 나란히 떠요
  • 글을 고치면 미리보기도 실시간으로 바뀌어요

따로 변환 프로그램을 돌릴 필요가 없어요. 원고가 어떻게 보일지 쓰면서 바로 확인하니까, 발행 전에 헤매는 시간이 줄어요. 이건 익스텐션이 아니라 VS Code 기본 기능이에요.


기본 2 — 변경점 비교(diff): AI가 바꾼 곳을 색으로

변경점 비교 diff — AI가 고친 부분을 초록·빨강 색으로 표시

클로드코드한테 "이 문단 고쳐줘"라고 시키면, AI가 파일을 바꿔요. 그런데 정확히 어디를 어떻게 바꿨는지 모르고 넘어가면 위험하죠. VS Code는 바뀐 부분을 색으로 보여줘요.

  • 초록색 = 새로 추가된 줄
  • 빨강색 = 삭제된 줄
  • 수정 전후를 좌우로 나란히 비교할 수도 있어요

AI가 일을 잘했는지 1초 만에 눈으로 확인하고 넘어가요. 시리즈에서 계속 한 얘기 그대로예요 — 점검은 AI에게 시키더라도, 판단은 내가 하는 거죠. 그 판단을 도와주는 게 이 변경점 비교 화면이에요.


기본 3 — 통합 터미널: 클로드코드를 같은 창에서

통합 터미널 — VS Code 안에서 클로드코드 바로 실행

클로드코드는 '터미널'이라는 곳에서 실행돼요. 그런데 VS Code는 그 터미널을 창 안에 품고 있어요. 별도 앱을 열 필요 없이, 코드를 보던 그 화면 아래쪽에서 바로 클로드코드를 돌리고 결과도 여기서 봐요.

  • 단축키: ⌘ + (백틱, 숫자 1 왼쪽 키) / 윈도우는 Ctrl + `
  • 터미널에서 AI가 작업하는 동안, 위에서는 만들어진 파일을 바로 확인
  • 앱과 터미널을 왔다 갔다 하지 않아요

"실행하는 곳"과 "결과를 보는 곳"이 한 화면에 있다는 것 — 이게 데스크탑 앱과 가장 크게 갈리는 지점이에요.


기본 4 — 이미지·HTML 미리보기: 만든 결과물을 바로 띄워봐요

이미지·HTML 미리보기 — PNG·카드뉴스 HTML을 코드 옆에서 확인

마케터는 글만 만들지 않아요. 카드뉴스 이미지(PNG), 블로그용 HTML 같은 시각 결과물도 만들죠. VS Code는 이런 이미지와 HTML도 코드 옆에서 바로 미리봐요.

  • PNG 파일을 클릭하면 그 자리에서 이미지가 떠요
  • HTML은 코드 옆에 실제 화면처럼 띄워서 확인
  • 저장하면 바뀐 게 바로 반영돼요

예를 들어 카드뉴스 HTML을 고치면서 결과를 실시간으로 보는 거예요. "코드 → 결과물"을 오가는 시간이 사라지니까, 디자인 작업도 한 화면에서 끝나요.

여기까지가 안 깔아도 되는 기본 4개예요. 이제 있는 줄 모르고 안 쓰는 숨은 꿀팁 3개로 갈게요.


꿀팁 1 — 타임라인: 이전 버전으로 되돌리기

타임라인 — 저장 이력으로 이전 버전 복구

AI한테 작업을 시키다 보면 "아, 아까가 더 나았는데" 싶을 때가 있어요. VS Code는 파일을 저장할 때마다 이력을 자동으로 쌓아둬요. 그래서 30분 전 버전으로도 되돌릴 수 있어요.

  • 파일을 우클릭 → Open Timeline
  • 저장 시점마다 기록이 남아 있어요
  • 원하는 시점을 골라 그때 상태로 복구

별도 백업을 만들지 않아도, 실수가 되돌릴 수 있는 실수가 돼요. AI한테 과감하게 시켜보고, 아니다 싶으면 되돌리면 되니까 부담이 줄어요.


꿀팁 2 — 명령 팔레트: 기능을 검색해서 실행

명령 팔레트 — 기능 이름을 검색해서 바로 실행

VS Code 기능이 많다 보니 "그거 메뉴 어디 있더라" 싶을 때가 많아요. 그럴 때 명령 팔레트를 열면 돼요. 검색창에 기능 이름만 치면 바로 나와서 실행돼요.

  • 단축키: ⌘ ⇧ P (맥) / Ctrl Shift P (윈도우)
  • "미리보기", "터미널", "설정" 같은 단어만 쳐도 관련 기능이 떠요
  • 메뉴를 헤맬 필요 없이 바로 실행

기능 이름을 외우지 못해도 괜찮아요. "이거 어디 있더라"의 해결사예요. VS Code를 처음 쓰는 분일수록 이거 하나로 막힘이 확 줄어요.


꿀팁 3 — 전체 검색: 모든 파일에서 한 번에

전체 검색 — 폴더 전체에서 단어를 한 번에 찾기

"그 문구를 어느 글에 썼더라?" — 콘텐츠가 쌓이면 자주 겪는 일이죠. VS Code는 작업 폴더 전체를 한 번에 뒤져서 그 단어가 들어간 파일을 다 찾아줘요.

  • 단축키: ⌘ ⇧ F (맥) / Ctrl Shift F (윈도우)
  • 폴더 안 모든 파일에서 동시에 검색
  • 찾은 문구를 한꺼번에 바꾸는 것도 가능

파일을 하나씩 열어볼 필요가 없어요. "그 문장 어느 글에 썼지?"가 5초에 끝나요. 글을 많이 쌓아둔 사람일수록 효과가 커요.


한눈에 보는 단축키 7개

지금까지 본 기능을 단축키로 정리하면 이래요. 캡처해두고 오늘 하나씩 눌러보세요. (맥 기준, 윈도우는 Ctrl로)

기능 단축키 한 줄 설명
마크다운 미리보기 ⌘ KV 원고 옆에 완성본 바로
변경점 비교(diff) (저장 시 자동 표시) AI가 바꾼 곳을 색으로
통합 터미널 ⌘ + ` 클로드코드를 같은 창에서
이미지·HTML 미리보기 파일 열기/미리보기 만든 결과물 바로 확인
타임라인 우클릭 → Open Timeline 이전 버전으로 복구
명령 팔레트 ⌘ ⇧ P 기능을 검색해서 실행
전체 검색 ⌘ ⇧ F 모든 파일에서 한 번에

오늘 1단계 — 이번에 바로 해보기

VS Code를 켜고, 마크다운(.md) 파일을 하나 열어
⌘K → V 로 미리보기를 띄워보세요.

코드 왼쪽, 미리보기 오른쪽이 나란히 뜨면 성공이에요.
이 화면 하나가 데스크탑 앱과 가장 크게 다른 점이에요.

자주 묻는 질문 (FAQ)

Q1. 그래서 익스텐션은 아예 안 깔아도 되나요? 처음엔 거의 안 깔아도 돼요. 위 7개는 전부 기본 기능이라 설치가 필요 없어요. 익숙해진 다음에 한글 UI가 필요하면 'Korean Language Pack', HTML을 더 편하게 미리보고 싶으면 'Live Preview' 정도만 추가하면 충분해요. 처음부터 익스텐션 20개를 깔면 오히려 길을 잃어요.

Q2. 저는 맥이 아니라 윈도우인데 단축키가 다르죠? 네, 맥의 ⌘(커맨드)를 윈도우에서는 Ctrl로 바꾸면 거의 그대로 통해요. 마크다운 미리보기는 Ctrl KV, 명령 팔레트는 Ctrl Shift P, 전체 검색은 Ctrl Shift F예요. 단축키가 헷갈리면 명령 팔레트(Ctrl Shift P)에서 기능 이름을 검색하는 게 가장 확실해요.

Q3. 코드를 전혀 몰라도 이 기능들을 쓸 수 있나요? 네. 여기 소개한 7개는 코드를 짜는 기능이 아니라 '보고·확인하고·되돌리는' 작업 환경 기능이에요. 마크다운 원고를 보고, AI가 바꾼 걸 확인하고, 이전으로 되돌리는 일에는 코딩 지식이 필요 없어요. 마케터가 클로드코드를 다룰 때 딱 필요한 부분만 골라 담았어요.

Q4. 기능을 다 외워야 하나요? 아니요. 명령 팔레트(⌘⇧P) 하나만 기억하면 나머지는 검색으로 다 불러올 수 있어요. 처음엔 마크다운 미리보기랑 통합 터미널 두 개만 손에 익혀도 충분해요. 나머지는 쓰다 보면 자연스럽게 손이 가요.


마무리 — 익스텐션은 그다음이에요

VS Code가 데스크탑 앱보다 편한 이유는 거창하지 않아요. 만들고·보고·고치고·되돌리는 걸 한 화면에서 끝내준다는 것, 그게 전부예요. 그리고 그 화면을 구성하는 기능 대부분은 익스텐션이 아니라 이미 깔려 있는 기본 기능이에요.

그러니 익스텐션 검색은 잠깐 미뤄도 돼요. 오늘 본 7개 — 마크다운 미리보기, 변경점 비교, 통합 터미널, 이미지 미리보기, 타임라인, 명령 팔레트, 전체 검색 — 부터 손에 익히면, 클로드코드로 하는 작업이 훨씬 매끄러워져요.

오늘은 마크다운 미리보기 하나(⌘K → V)부터 눌러보세요. 그 화면 하나가 시작이에요.


함께 보면 좋은 글

마케터의 클로드코드 실전 시리즈

  • 클로드코드는 왜 VS Code에서 써야 할까 — 직접 써보니 이 5가지 때문이었어요 (2026-06-16 발행)
  • 콘텐츠 성과 분석, AI한테 시키는 법 — 월요일 30분 루틴 공개 (2026-06-15 발행)
  • 클로드코드 흔한 실수 5가지 — 같은 도구로 결과가 갈리는 이유 (2026-06-13 발행)

매일 1개 AI 마케팅 인사이트 — 오픈채팅방 입장

💬 매일 1개 AI 마케팅 인사이트 AI로 마케팅 자립하려는 마케터·1인 운영자가 모인 오픈채팅방. 매일 1개씩 인사이트가 올라와요. 👉 오픈채팅방 입장하기


마케팅, AI로 어디까지 할 수 있을까 — AI 마케팅 사례 17개

🔍 마케팅, AI로 어디까지 할 수 있을까? 리뷰 분석 자동화·라운지 운영 대시보드·블로그 생성 시스템 — 실제 클라이언트와 만든 AI 마케팅 사례 17개를 한 페이지에 모아뒀어요. 본인 브랜드에 바로 적용할 아이디어를 찾아보세요. 15년차 마케터가 AI로 마케팅 하는 다양한 사례를 소개하고 교육합니다. 👉 AI 마케팅 사례 17개 보러가기