LabHub

블로그

VS Code 필수 익스텐션 2026 — GitLens / Error Lens / Pretty TypeScript Errors / Tailwind / Prisma / Biome 심층 가이드

2026-05-16 · 44 분 읽기 · #vscode#vscode-extensions#gitlens#path-intellisense#error-lens#pretty-typescript-errors#vscode-icons#material-icon-theme#indent-rainbow#dependi#tailwind-intellisense#prisma#eslint#prettier#biome#even-better-toml#live-server#rest-client#thunderclient#shellcheck#editorconfig#polacode#quokka-js#code-tour#project-manager#github-pull-requests#deep-dive

한국어English日本語

"에디터는 골격이고, 익스텐션은 근육이다. 근육이 없으면 골격은 의자에 앉아만 있다." — 어느 시니어 프런트엔드 개발자

이번 글은 2026년 5월 기준 VS Code 익스텐션 시장 지도다. 2024-2025년 사이에 AI 익스텐션이 주류로 올라오면서 익스텐션 시장의 무게중심이 한 번 크게 흔들렸다. GitHub Copilot이 디폴트가 됐고, Codeium/Cody/Tabnine 같은 무료 옵션이 그 옆에 줄을 섰으며, Continue와 Cline은 BYOK(Bring Your Own Key) 진영을 만들었다. 한편 비AI 진영에서는 GitLens(GitKraken)가 Git UI의 사실상 표준으로 굳어졌고, Error Lens와 Pretty TypeScript Errors가 만든 "에러는 인라인으로 봐야 한다"는 UX 합의가 자리잡았다.

이 글은 Git 도구(GitLens, GitHub Pull Requests), UI 개선(Path Intellisense, Error Lens, Pretty TypeScript Errors, Indent Rainbow, vscode-icons, Material Icon Theme), 언어/프레임워크(Tailwind CSS IntelliSense, Prisma, ESLint, Prettier, Biome, Even Better TOML, Dependi), AI(Tabnine, Codeium, Cody, GitHub Copilot, Continue, Cline), 워크플로(REST Client, ThunderClient, ShellCheck, EditorConfig, Polacode, Quokka.js, Code Tour, Project Manager, Live Server, Markdown All in One, Vim/Neovim 모드)를 분류해서 비교한다. 마지막에는 한국의 토스/카카오, 일본의 메르카리/ZOZO 추천 익스텐션을 짚고 "당신은 무엇을 깔아야 하는가"라는 의사결정 가이드로 마무리한다.

1. 2026년 VS Code 익스텐션 지도 — 네 가지 분류

2026년의 VS Code 익스텐션을 보려면 먼저 분류가 필요하다. Marketplace에 60,000개가 넘는 익스텐션이 있는데 "다 깔자"는 답은 없다. 익스텐션은 곧 메모리이고, 곧 익스텐션 호스트 프로세스의 CPU 사용량이며, 곧 시작 시간이다.

이 분류는 책임 경계가 다르다. Git 도구는 "이 코드가 왜 이렇게 됐는가"를 보여주고, UI 개선은 "지금 화면에서 뭘 봐야 하는가"를 명확히 하며, 언어/프레임워크 도구는 "타이핑 도와줘"를 해결한다. AI 어시스턴트는 "코드를 대신 써줘"를 맡고, 워크플로 도구는 "에디터를 벗어나지 않게 해줘"를 담당한다.

가장 흔한 실수는 "기능이 겹치는 익스텐션을 동시에 깔아두는" 것이다. 2026년 시점에서 흔한 충돌은 ESLint + Prettier + Biome 셋 다 설치(Biome는 단독으로 쓸 때 진가가 나옴), vscode-icons + Material Icon Theme 둘 다 활성화(둘 중 하나만 활성화 가능), GitHub Copilot + Codeium + Tabnine 셋 다 자동완성 활성화(트리거가 충돌해서 한 쪽 제안이 사라짐) 같은 패턴이다. 한 카테고리당 하나만 깐다가 2026년의 베스트 프랙티스다.

또 한 가지 큰 흐름은 AI 익스텐션이 비AI 익스텐션을 흡수하는 흐름이다. Tabnine은 처음에는 단순 자동완성이었지만 지금은 AI Chat과 Code Review까지 한다. Codeium은 무료 AI에서 시작해서 자체 IDE(Windsurf)까지 만들었다. GitHub Copilot은 Workspace와 Agent Mode를 추가하면서 사실상 작은 에이전트가 됐다. 이 흐름 때문에 "AI 어시스턴트 익스텐션 하나"의 비중이 점점 커진다.

2. GitLens — Git 히스토리의 표준

GitLens는 2016년 Eric Amodio가 만든 익스텐션으로, 2022년 GitKraken에 인수됐다. 2026년 현재 Marketplace 다운로드 3,500만 회 이상을 기록한 사실상 Git 익스텐션의 표준이다. VS Code의 내장 Git UI는 의도적으로 미니멀하기 때문에, GitLens는 "Git을 진지하게 쓸 거면 무조건 까는" 익스텐션이 됐다.

핵심 기능:

// .vscode/settings.json — GitLens를 가볍게 만드는 설정
{
  "gitlens.codeLens.enabled": false,
  "gitlens.currentLine.enabled": true,
  "gitlens.hovers.currentLine.over": "line",
  "gitlens.statusBar.enabled": true,
  "gitlens.blame.format": "${author|agoOrDate}",
  "gitlens.views.repositories.files.layout": "tree"
}

GitLens의 강점:

GitLens의 약점:

누가 써야 하나: Git을 매일 쓰는 모든 개발자. 사실상 디폴트. 대안으로는 Git Graph(가벼움), Git History(파일/라인 이력에 특화), GitLens — 셋 중 GitLens가 가장 종합적이다.

3. Path Intellisense / Error Lens / Pretty TypeScript Errors — UI 개선의 3대장

이 세 익스텐션은 "VS Code의 기본 UI를 한 단계 위로" 끌어올리는 도구다. 2026년 시점에서 신규 개발자가 까는 첫 번째 묶음이기도 하다.

Path Intellisense (Christian Kohler)

import나 require 안에서 파일 경로를 자동완성한다. VS Code 내장 자동완성도 있지만 Path Intellisense가 훨씬 빠르고 정확하다. 특히 모노레포에서 @workspace/... 같은 alias 경로도 잡아준다.

{
  "path-intellisense.mappings": {
    "@app": "${workspaceFolder}/src/app",
    "@components": "${workspaceFolder}/src/components"
  },
  "path-intellisense.showHiddenFiles": false,
  "path-intellisense.extensionOnImport": true
}

다운로드 1,000만 회 이상. 2026년 기준 대부분의 워크플로에서 첫째 날 깔린다.

Error Lens (Alexander)

Alexander의 Error Lens는 진단 메시지(error/warning/info)를 라인 끝에 인라인으로 표시한다. 기본 VS Code는 진단 메시지를 보려면 마우스를 올려야 하는데, Error Lens는 그걸 화면에 박아둔다.

{
  "errorLens.enabled": true,
  "errorLens.fontSize": "12px",
  "errorLens.messageBackgroundMode": "none",
  "errorLens.gutterIconsEnabled": true,
  "errorLens.followCursor": "allLines",
  "errorLens.excludeBySource": [
    "cSpell"
  ]
}

호불호가 갈리는 익스텐션이다. "화면이 시끄러워진다"는 비판이 있고, "한 번 익숙해지면 못 돌아간다"는 옹호가 있다. 절충안으로는 followCursor: "activeLine"으로 설정해서 활성 라인만 보여주는 방법이 있다. 다운로드 700만 회 이상.

Pretty TypeScript Errors (yoavbls)

TypeScript의 에러 메시지는 악명 높다. 길고, 중첩되고, 어디서 끊어 읽어야 할지 모른다. Pretty TypeScript Errors는 그 에러 메시지를 구조화해서 보여준다. 타입 비교, 누락된 프로퍼티, 함수 시그니처 불일치를 색깔과 들여쓰기로 표현한다.

// 기본 TS 에러 — 한 줄로 너무 길다
// Type 'NewUser' is not assignable to type 'User'. ... missing the following properties from type 'User': id, createdAt

// Pretty TypeScript Errors가 보여주는 것
// ┌─ Type mismatch: NewUser vs User
// │  Missing properties:
// │  - id: number
// │  - createdAt: Date
// └─

특히 React/Next.js/tRPC를 쓰면서 제네릭 타입 에러를 자주 만나는 개발자에게 필수다. 다운로드 500만 회 이상.

이 세 도구의 공통점은 "기존 정보를 더 잘 보여준다"는 것이다. 새 기능을 추가하는 게 아니라 이미 있는 진단/타입/경로 정보를 가독성 있게 재배치한다. 그래서 거의 모든 워크플로에 무해하게 추가할 수 있다.

4. vscode-icons vs Material Icon Theme — 아이콘 전쟁

VS Code의 사이드바 파일 아이콘을 바꾸는 두 익스텐션이다. 둘 중 하나만 활성화할 수 있다(같은 contribution point를 점유). 2026년 시점에서 둘은 사실상 무승부 상태로 양분된다.

vscode-icons (icons-for-visual-studio-code 팀)

Material Icon Theme (Philipp Kief)

{
  "workbench.iconTheme": "material-icon-theme",
  "material-icon-theme.folders.theme": "specific",
  "material-icon-theme.activeIconPack": "nest",
  "material-icon-theme.hidesExplorerArrows": true
}

선택 가이드:

2026년 트렌드는 Material Icon Theme이 약간 우세다. 다만 Material Icon Theme의 폴더 입체감이 너무 강해서 "단순한 vscode-icons가 좋다"는 사용자도 여전히 많다.

5. Indent Rainbow — 시각 보조의 시조

oderwat의 Indent Rainbow는 들여쓰기 레벨을 색깔로 표시한다. Python처럼 들여쓰기가 문법인 언어에서 특히 유용하다. 2025년 시점에서는 VS Code의 내장 "bracket pair colorization"이 비슷한 효과를 주기 때문에 필수성이 줄었지만, 여전히 Python/YAML 개발자에게 인기가 많다.

{
  "indentRainbow.colors": [
    "rgba(255,255,64,0.07)",
    "rgba(127,255,127,0.07)",
    "rgba(255,127,255,0.07)",
    "rgba(79,236,236,0.07)"
  ],
  "indentRainbow.ignoreLinePatterns": [
    "/[ \t]* [*]/g"
  ],
  "indentRainbow.tabmixColor": "rgba(255,127,127,0.3)"
}

장점:

단점:

대안으로는 Bracket Pair Color DLW(deprecated, 내장 기능으로 대체), Rainbow CSV(CSV 전용) 등이 있다. 2026년 권장: Python/Kubernetes를 자주 쓴다면 깐다, 아니면 굳이 필요 없음.

6. Dependi (구 Crates) — Rust 의존성 인라인

Rust의 Cargo.toml에서 crate 버전 위에 최신 버전 정보를 인라인으로 표시하는 익스텐션이다. 원래 이름은 "crates"였는데 2023년 maintainer가 바뀌면서 "Dependi"로 리브랜딩됐고, Rust뿐 아니라 npm(package.json), PHP(composer.json), Python(pyproject.toml/requirements.txt), Go(go.mod) 등 여러 패키지 매니저를 지원하게 됐다.

# Cargo.toml — Dependi가 인라인으로 최신 버전 표시
[dependencies]
serde = "1.0.197"     # ◀ latest: 1.0.219
tokio = "1.36.0"      # ◀ latest: 1.41.0
clap = "4.5.4"        # ◀ latest: 4.5.21

{
  "dependi.npm.indexServerURL": "https://registry.npmjs.org",
  "dependi.rust.indexServerURL": "https://crates.io",
  "dependi.vulnerability.ghsa.enabled": true,
  "dependi.vulnerability.osv.enabled": true
}

장점:

단점:

Rust 개발자라면 무조건 깐다. Node 개발자도 깔아두면 좋다(다만 Renovate/Dependabot 같은 자동화가 있으면 중복).

7. Vim / Neovim 모드 — 마우스 없이

VS Code에서 Vim 키바인딩을 쓰려면 두 가지 선택지가 있다.

VSCodeVim (vscodevim)

{
  "vim.useSystemClipboard": true,
  "vim.useCtrlKeys": true,
  "vim.hlsearch": true,
  "vim.leader": "<space>",
  "vim.normalModeKeyBindingsNonRecursive": [
    {
      "before": ["<leader>", "w"],
      "commands": ["workbench.action.files.save"]
    },
    {
      "before": ["<leader>", "f"],
      "commands": ["workbench.action.quickOpen"]
    }
  ],
  "vim.handleKeys": {
    "<C-d>": true,
    "<C-f>": false
  }
}

단점: 진짜 Neovim의 Lua 플러그인을 못 쓴다. 복잡한 매크로/플러그인은 안 됨.

vscode-neovim (asvetliakov)

{
  "vscode-neovim.neovimExecutablePaths.darwin": "/opt/homebrew/bin/nvim",
  "vscode-neovim.neovimInitVimPaths.darwin": "~/.config/nvim/init.lua",
  "vscode-neovim.useWSL": false
}

선택 가이드:

2026년 시점에서 신규 Vim 사용자는 VSCodeVim으로 시작하고, Neovim 사용자가 VS Code에 발 한 짝 걸칠 때 vscode-neovim을 쓰는 패턴이 일반적이다.

8. AI 익스텐션 — Tabnine / Codeium / Cody / Copilot / Continue / Cline

2026년 AI 익스텐션 시장은 6개 주요 플레이어로 정리됐다. 각자 포지션이 다르다.

GitHub Copilot (GitHub/Microsoft)

Codeium (Codeium Inc., 현 Windsurf)

Tabnine (Tabnine Ltd.)

Cody (Sourcegraph)

Continue (Continue Dev)

Cline (구 Claude Dev)

// 한 가지만 활성화하는 게 정신건강에 좋다
{
  "github.copilot.enable": {
    "*": true,
    "plaintext": false,
    "markdown": true
  },
  "github.copilot.editor.enableAutoCompletions": true,
  "continue.enableTabAutocomplete": false,
  "codeium.enableConfig": {
    "*": false
  }
}

선택 가이드:

중요: 자동완성 익스텐션을 두 개 이상 동시에 켜면 트리거가 충돌해서 양쪽 다 사라진다. 한 번에 하나만 활성화하라.

9. Tailwind CSS IntelliSense / Prisma — 프레임워크 친화

특정 프레임워크가 만든 공식 익스텐션 중 가장 잘 만들어진 두 개다.

Tailwind CSS IntelliSense (Tailwind Labs)

Adam Wathan을 비롯한 Tailwind 팀 공식 익스텐션. Tailwind를 쓴다면 무조건 깐다.

{
  "tailwindCSS.experimental.classRegex": [
    ["cva\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
    ["cx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
  ],
  "tailwindCSS.includeLanguages": {
    "typescript": "javascript",
    "typescriptreact": "javascript"
  },
  "editor.quickSuggestions": {
    "strings": "on"
  }
}

cva/cx/clsx/twMerge 같은 헬퍼 함수 안에서도 자동완성을 받으려면 위 같은 정규식 설정이 필요하다.

Prisma (Prisma)

Prisma 공식 익스텐션. schema.prisma 파일의 문법 하이라이팅, 자동완성, 포맷팅, 모델 간 관계 jump-to-definition을 지원한다.

{
  "[prisma]": {
    "editor.defaultFormatter": "Prisma.prisma",
    "editor.formatOnSave": true
  },
  "prisma.fileWatcher": true
}

특히 schema.prisma의 model 사이 관계 자동완성과 @@index/@relation 옵션 자동완성이 강력하다. Prisma를 쓴다면 무조건 깐다.

다른 프레임워크 친화 익스텐션:

공통 패턴: 프레임워크 팀이 만든 공식 익스텐션은 거의 항상 third-party 대안보다 낫다.

10. ESLint / Prettier / Biome — linter + formatter

2026년 JS/TS 생태계에서 가장 시끄러운 영역이다. 세 도구의 포지션이 갈라졌다.

ESLint (ESLint 팀)

Prettier (Prettier 팀)

Biome (Biome 팀, 구 Rome)

// .vscode/settings.json — ESLint + Prettier 조합
{
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  },
  "eslint.experimental.useFlatConfig": true,
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  }
}

// .vscode/settings.json — Biome 단독 (ESLint + Prettier 둘 다 대체)
{
  "editor.defaultFormatter": "biomejs.biome",
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "quickfix.biome": "explicit",
    "source.organizeImports.biome": "explicit"
  },
  "[typescript]": {
    "editor.defaultFormatter": "biomejs.biome"
  }
}

2026년 선택 가이드:

중요: ESLint + Prettier + Biome 셋 다 깔면 포맷팅이 충돌해서 저장할 때마다 코드가 뒤바뀐다. 한 카테고리당 하나만 활성화하라.

11. Even Better TOML / Markdown All in One — 마크업

Even Better TOML (tamasfe)

TOML 파일(Cargo.toml, pyproject.toml, netlify.toml 등)을 위한 익스텐션. 문법 하이라이팅, 자동완성, 검증, 포맷팅을 지원한다.

{
  "[toml]": {
    "editor.defaultFormatter": "tamasfe.even-better-toml",
    "editor.formatOnSave": true
  },
  "evenBetterToml.schema.associations": {
    "Cargo\\.toml": "https://json.schemastore.org/cargo.json",
    "pyproject\\.toml": "https://json.schemastore.org/pyproject.json"
  }
}

Rust/Python 개발자에게 필수. 다운로드 800만 회 이상.

Markdown All in One (Yu Zhang)

Markdown 파일 편집에 필요한 거의 모든 기능을 모은 익스텐션.

{
  "markdown.extension.toc.levels": "2..6",
  "markdown.extension.toc.updateOnSave": true,
  "markdown.extension.preview.autoShowPreviewToSide": false,
  "markdown.extension.list.indentationSize": "adaptive",
  "markdown.extension.tableFormatter.normalizeIndentation": true
}

블로그를 MDX로 쓰는 사람, README를 자주 갱신하는 사람, 기술 문서를 쓰는 사람 모두에게 유용. 다운로드 1,300만 회 이상.

대안:

12. Live Server (Ritwick Dey) — HTML 미리보기

Ritwick Dey의 Live Server는 정적 HTML을 로컬 서버로 띄우고 파일 변경 시 자동 리로드한다. 다운로드 4,000만 회 이상으로 VS Code Marketplace 최상위권 익스텐션이다.

{
  "liveServer.settings.port": 5500,
  "liveServer.settings.donotShowInfoMsg": true,
  "liveServer.settings.donotVerifyTags": true,
  "liveServer.settings.CustomBrowser": "chrome"
}

장점:

단점:

대안:

2026년 권장: 순수 HTML/CSS 학습 단계라면 깔자, 프레임워크 프로젝트라면 dev 서버 쓰자.

13. REST Client / ThunderClient — API 테스트

Postman/Insomnia를 VS Code 안에서 대체한다.

REST Client (Huachao Mao)

.http 또는 .rest 파일에 HTTP 요청을 plain text로 쓰고 실행한다.

### GET 사용자 정보
GET https://api.example.com/users/1
Authorization: Bearer {{token}}
Accept: application/json

### POST 새 사용자
POST https://api.example.com/users
Content-Type: application/json

{
  "name": "Alice",
  "email": "alice@example.com"
}

### 환경별 변수
@baseUrl = https://api.example.com
@token = abc123

장점:

다운로드 800만 회 이상. API 테스트를 Git에 남기고 싶은 팀에게 최적.

ThunderClient (Ranga Vadhineni)

GUI 기반 API 클라이언트. Postman을 VS Code 안에서 직접 흉내낸다.

장점:

단점:

2026년 선택 가이드:

14. ShellCheck / EditorConfig — 스타일 가드

ShellCheck (Timon Wong)

bash/sh 스크립트 정적 분석기. ShellCheck 자체는 OSS 도구이고, VS Code 익스텐션은 그 결과를 표시한다.

#!/bin/bash
# ShellCheck가 잡는 흔한 실수들

# SC2086: 인용 부호 누락 (단어 분리 위험)
files=$1
ls $files          # warning

# SC2046: $() 결과를 인용 없이 사용
files=$(ls *.txt)
echo $files        # warning

# 올바른 방식
ls "$files"
echo "$files"

{
  "shellcheck.enable": true,
  "shellcheck.run": "onSave",
  "shellcheck.exclude": ["SC2086"],
  "shellcheck.customArgs": ["-x"]
}

장점:

단점:

DevOps/SRE 직군에 필수. 다운로드 200만 회 이상.

EditorConfig (EditorConfig 팀)

.editorconfig 파일을 읽어 들여쓰기/줄바꿈/인코딩을 프로젝트별로 통일한다. 거의 모든 IDE/에디터가 지원하므로 팀에 IDE가 섞여 있을 때 필수.

# .editorconfig
root = true

[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.{md,mdx}]
trim_trailing_whitespace = false

[Makefile]
indent_style = tab

장점:

단점:

2026년 권장: 모든 신규 프로젝트에 .editorconfig 추가. 익스텐션은 무료 + 무해.

15. Polacode / Quokka.js / Code Tour — 데모/스크래치/투어

이 세 익스텐션은 "흔치 않지만 특정 상황에서 유일한 답"인 도구들이다.

Polacode (P. Cong)

코드 블록을 예쁜 이미지로 캡처한다. 트위터/블로그/발표 자료에 코드를 넣을 때 사용.

대안: Carbon (carbon.now.sh), Ray.so, CodeSnap (VS Code 익스텐션). 2026년 시점에서는 Carbon이 더 인기지만 Polacode는 에디터 안에서 끝낼 수 있다는 장점이 있다.

Quokka.js (Wallaby.js)

JavaScript/TypeScript scratchpad. 코드를 작성하는 동시에 라인별 결과가 인라인으로 표시된다.

// Quokka가 실행 결과를 인라인으로 표시
const arr = [1, 2, 3, 4, 5]
const sum = arr.reduce((a, b) => a + b, 0)  // ◀ 15
const avg = sum / arr.length                  // ◀ 3

const fetched = await fetch('https://api.example.com/data').then(r => r.json())
console.log(fetched)                          // ◀ { id: 1, ... }

대안: Node REPL, 브라우저 콘솔, replit, Observable. Quokka는 "에디터 안에서 즉시"라는 점이 강점.

Code Tour (Microsoft)

코드베이스에 가이드 투어를 만들 수 있다. 마치 슬라이드처럼 "이 파일의 이 라인을 봐, 다음은 이 함수야" 식으로 단계별 안내.

// .tours/onboarding.tour
{
  "title": "신규 개발자 온보딩",
  "steps": [
    {
      "file": "src/app.ts",
      "line": 1,
      "description": "앱 진입점. dotenv 로딩 후 server.ts로 위임한다."
    },
    {
      "file": "src/server.ts",
      "line": 24,
      "description": "Express 미들웨어 등록. CORS/auth/error 순서가 중요."
    }
  ]
}

다운로드 100만 회 이상. 사용 빈도는 낮지만 만들 때 한 번 만들면 6개월~1년 가치 있음.

16. Project Manager / GitHub Pull Requests — 워크플로

Project Manager (Alessandro Fragnani)

여러 프로젝트를 빠르게 전환하는 익스텐션. VS Code 내장 "Recent Workspaces"보다 강력하다.

{
  "projectManager.git.baseFolders": [
    "~/dev",
    "~/work"
  ],
  "projectManager.git.maxDepthRecursion": 3,
  "projectManager.sortList": "Recent",
  "projectManager.openInNewWindowWhenClickingInStatusBar": true
}

상태바에 현재 프로젝트 이름이 표시되고, 클릭하면 프로젝트 목록이 뜬다. 동시에 여러 클라이언트/사이드 프로젝트를 오가는 개발자에게 필수.

대안: Workspace Explorer, Peacock(프로젝트별 색깔 자동 변경). Project Manager가 가장 완성도 높음.

GitHub Pull Requests (GitHub)

GitHub 공식 익스텐션. PR을 VS Code 안에서 만들고 리뷰한다.

{
  "githubPullRequests.pullBranch": "always",
  "githubPullRequests.defaultMergeMethod": "squash",
  "githubPullRequests.notifications": "pullRequests"
}

장점: GitHub로 작업하는 거의 모든 팀에게 유용. CLI(gh)와 함께 쓰면 키보드/GUI 둘 다 빠름.

단점: GitLab/Bitbucket은 지원 안 됨 (별도 익스텐션 필요).

대안: GitLens의 PR 통합(일부 기능), GitHub CLI(터미널 선호).

17. 한국 / 일본 — 토스, 카카오, 메르카리, ZOZO

회사별 추천 익스텐션 풀을 비교한다. 출처는 각 회사 기술 블로그와 공개 컨퍼런스 발표.

토스 (Toss / Viva Republica)

토스 프런트엔드 챕터가 공개한 익스텐션 묶음 (2024-2025년 토스 SLASH 컨퍼런스 자료 기준):

토스는 "프론트엔드 펀더멘털 챕터" 단위로 도구 표준화를 했다. 새 입사자는 첫째 날 동일한 익스텐션 묶음을 깔게 된다.

카카오 (Kakao)

카카오 FE/BE 챕터별로 추천 익스텐션이 다르다 (Kakao Tech Blog 기준):

카카오는 사내 LLM 게이트웨이를 운영하기 때문에 Continue + 사내 모델 조합도 일부 팀이 사용한다.

메르카리 (Mercari)

메르카리 마이크로서비스팀의 공개 dotfiles 기준:

메르카리는 마이크로서비스 100+ 개를 운영하기 때문에 Project Manager 사용률이 높다.

ZOZO (ZOZOTOWN)

ZOZO 테크블로그가 공개한 추천 익스텐션 (2024-2025년 ZOZO TECH BLOG):

ZOZO는 디자인 시스템 "ZOZO Design System"용 자체 익스텐션을 만들어 사내 배포한다 (Material 컴포넌트 자동완성).

공통 패턴:

18. 누가 무엇을 골라야 하나 — 신규 / TS / Rust / 풀스택

마지막 의사결정 가이드다. "전부 깐다"는 답은 없다. 역할에 맞는 묶음을 깐다.

신규 개발자 (학습 중)

미니멀 묶음. 화면을 시끄럽게 만들지 않는다.

총 7개. 익숙해지면 하나씩 추가한다.

TypeScript 풀스택 (Next.js / tRPC / Prisma)

타입 에러와 매일 싸우는 직군. UI 개선 익스텐션이 핵심.

총 14개 안팎. Continue나 Cline을 추가하면 더 강력해지지만 Copilot과 충돌 주의.

Rust 개발자

총 12개 안팎. rust-analyzer는 Rust 개발의 사실상 모든 것이라 비중이 크다.

DevOps / SRE

AI 익스텐션은 선택. DevOps는 명령어 자체보다 "이 환경에서 어떻게 동작할까"가 본질이라 AI 자동완성 가치가 상대적으로 낮다.

데이터 엔지니어 / ML

총 11개 안팎. Python 개발은 Microsoft 공식 익스텐션 묶음(Python + Pylance + Jupyter)이 사실상 표준이다.

모든 직군 공통 추가 추천

VS Code 익스텐션 선정은 도구의 문제가 아니라 워크플로의 문제다. 2026년의 차이점은 AI 익스텐션이 디폴트가 됐다는 점이고, 동시에 Biome 같은 통합 도구가 나오면서 "여러 도구를 깔지 말고 하나를 깔자"는 흐름이 시작됐다는 점이다. 한 카테고리당 하나만 깔고, 기본 설정을 30분 정도 다듬고, 6개월에 한 번 정리하면 익스텐션은 친구가 된다. 그 정리를 안 하면 익스텐션은 점점 메모리를 잡아먹고 시작 시간을 늘리는 짐이 된다. 익스텐션은 추가하기는 쉬워도 빼기는 어려운 자산이라는 점을 기억하라.

참고 / References

원문 보기: https://www.youngju.dev/blog/culture/2026-05-16-vs-code-essential-extensions-2026-gitlens-error-lens-pretty-typescript-errors-tailwind-prisma-biome-deep-dive

댓글

아직 댓글이 없습니다.

로그인하면 댓글을 쓸 수 있습니다