Налаштовуємо Claude Code у VS Code і використовуємо його не лише для автодоповнення
Встановіть Claude Code, запустіть його з терміналу VS Code, напишіть CLAUDE.md і опануйте прийоми для великих задач, налагодження, роботи через тести й рефакторингу, а також дізнайтеся його обмеження.
Встановити — ще не означає вбудувати в роботу
Запустити Claude Code поруч із VS Code — справа хвилин десяти. Щоб він змінив те, як ви працюєте, потрібно більше часу. Типова історія: підключили й користуються як Copilot — автодоповнення по Tab, швидкі підказки, зрідка рефакторинг. Це нормально й корисно, але революції не стається: це наче їздити спорткаром на першій передачі. Claude в редакторі й Claude, вбудований у ваш робочий процес, — різні речі. Налаштування швидке, а віддача приходить, коли ви розумієте, що в нього просити.
Чотири способи працювати з Claude у VS Code
"Claude у VS Code" може означати кілька речей:
- Claude Code у терміналі — власний CLI від Anthropic. Він бачить усю кодову базу, читає й записує файли, запускає команди й працює одразу з багатьма файлами. Найпотужніший із чотирьох варіантів.
- GitHub Copilot із моделлю Claude: передплатник Copilot може перемкнути модель на Claude Sonnet і лишитися у звичному інтерфейсі.
- Claude.ai у вкладці браузера поруч із редактором: просто й недооцінено. Вставили код, отримали пропозиції, вставили назад. Повільніше, зате працює будь-де і нічого не коштує понад передплату.
- Сторонні розширення з чатом Claude на бічній панелі: якість різна, деякі не оновлювалися місяцями.
Далі йтиметься про Claude Code, бо саме він змінює те, на що здатен ШІ. Браузерний чат і Copilot зручні, але обмежені. Claude Code бачить увесь проєкт, розуміє зв'язки між файлами, запускає тести й допрацьовує результат — це інструмент іншого класу.
Налаштування у три кроки
Якщо ви вже це робили, піде близько 10 хвилин, уперше — хвилин 20.
Встановлення
Claude Code — інструмент командного рядка, встановлюється через npm:
npm install -g @anthropic-ai/claude-code
Потрібен Node.js 18 або новіший, тож спершу оновіться, якщо у вас старіша версія. Після встановлення запустіть його:
claude
Він попросить увійти в акаунт Anthropic. Для початку вистачить безкоштовного, але на реальному проєкті ви швидко впретеся в ліміти. Після авторизації все готово.
Запуск із терміналу VS Code
Описаний тут спосіб обходиться без розширення VS Code. Claude Code працює у вбудованому терміналі, тож порядок такий:
- Відкрийте проєкт у VS Code.
- Відкрийте вбудований термінал поєднанням Ctrl+
(Cmd+на Mac). - Перейдіть через cd у корінь проєкту.
- Введіть
claude.
Відтепер у нього є контекст проєкту. Він може читати файли, розбиратися в структурі, запускати ваші тести й змінювати кілька файлів за один прохід. І з редактором він чудово уживається: нехай Claude править код у панелі терміналу, а ви дивитеся, як зміни з'являються в редакторі в реальному часі. До розділеного екрана треба трохи звикнути, а потім це здається дуже природним.
Пишемо CLAUDE.md
Більшість туторіалів пропускають цей крок, а віддача від нього найбільша. CLAUDE.md — файл у корені проєкту, де ви розповідаєте Claude про свої домовленості, вподобання й правила. Без нього Claude робить розумні припущення з того, що бачить. З ним він поводиться так, ніби працює в команді вже кілька місяців. Мінімальна версія:
# Project conventions
## Tech stack
- Node.js 20, TypeScript, Express
- PostgreSQL via Prisma
- Jest for testing
## Code style
- Use async/await, never callbacks
- Prefer explicit error handling over try/catch everywhere
- All new functions need JSDoc comments
## Testing
- Every new endpoint needs at least 3 tests: happy path,
validation error, and auth failure
- Use factories, not fixtures
## What NOT to do
- Don't use any (TypeScript). Use unknown and narrow it.
- Don't add console.log for debugging. Use the logger.
- Don't install new dependencies without asking first.
П'ятнадцять хвилин на цей файл заощаджують години виправлень поведінки Claude за замовчуванням. Оновлюйте його щоразу, коли помічаєте, що Claude двічі повторив ту саму помилку.
Звички, заради яких ним варто користуватися
Налаштування завершено, тепер складна частина — користуватися ним так, щоб це було краще за звичайне вікно чату.
Давайте йому більші задачі
Спочатку багато хто використовує Claude Code як просунуте автодоповнення: просить по одній функції, одному виправленню синтаксису чи одному новому параметру. Це працює, але сила інструмента не в цьому. Найкраще він дає раду великим задачам. Наприклад: додай пагінацію в усі list-ендпоінти цього API, ось як зараз це зроблено в ендпоінті users, застосуй той самий підхід усюди. Вручну це година роботи, а Claude впорається хвилин за п'ять.
Контекстне вікно достатньо велике, щоб умістити помітну частину реальної кодової бази, тож користуйтеся цим. Дайте йому кілька файлів, опишіть усю картину й нехай працює з усіма одразу.
Просіть його розслідувати
Коли в продакшені вилазить щось дивне — повільний запит, трохи неправильна відповідь чи помилка, що з'являється лише іноді, — опишіть проблему, вкажіть Claude на потрібні файли й запитайте, де може бути збій. Він прочитає кодову базу й поверне список підозрюваних за ймовірністю. Він не завжди має рацію, але знаходить те, що ви б проґавили, і простежує шляхи виконання набагато швидше, ніж вручну.
У паралельному порівнянні з Cursor і Copilot на реальному баґу лише Claude Code зупинився й поставив уточнювальне запитання перед початком роботи — і це запитання влучило саме в суть баґа.
Спочатку тест
Звучить навпаки, але для всього, де вимоги зрозумілі, працює чудово. Напишіть тест, що описує потрібну поведінку, передайте його й скажіть: зроби так, щоб він проходив, нічого більше не зламавши. Звідси три переваги. Реалізація відповідає вашим справжнім вимогам, бо ви задали їх у коді. Неясності спливають рано, адже написання тесту змушує продумати граничні випадки. І наприкінці у вас є тест, якого могло б і не бути, якби ви спершу просили фічу, а тести потім. Особливо це виправдано для платежів, автентифікації й зовнішніх API, де помилки настільки дорогі, що правильну поведінку хочеться зафіксувати ще до появи коду.
Доручайте йому рефакторинг
Рефакторинг легко описати й нудно робити акуратно. Функція розрослася, модуль узяв на себе забагато, або той самий фрагмент скопіювали п'ять разів замість винести в абстракцію. Скажіть Claude, за що має відповідати модуль, попросіть винести решту в новий і оновити всі місця імпорту. Він проведе це по всій кодовій базі, виправить кожне посилання й прожене тести, щоб переконатися, що нічого не зламалося. Те, що забрало б цілий ранок уважної роботи, може бути готове за двадцять хвилин.
Де він не дотягує
- Він упевнено помиляється. Іноді Claude Code реалізує щось неправильно й ніяк не показує сумнівів, тож читайте результат, а не просто запускайте його, особливо якщо йдеться про дані чи гроші.
- Архітектуру за вас він не вигадає. Втілювати готовий задум він уміє добре, а вирішувати, що будувати, як улаштувати систему й на які компроміси йти, — ні. Ці рішення лишаються за вами.
- Обмеження контексту реальні. У дуже великій кодовій базі він бачить не все, тому вказуйте йому потрібні файли, а не сподівайтеся, що він сам знає, куди дивитися.
- Він не запустить те, що не запускається у вашому середовищі. Якщо тестам потрібне конкретне підключення до бази, запущений сервер чи змінні середовища, усе це має бути налаштовано. Він працює у вашому реальному середовищі, це не магія.
Перш ніж довіряти йому щось критичне для продакшену, варто точно зрозуміти, де він помилився на реалістичній задачі.
Три промпти, які варто зберегти
Вони з'явилися після безлічі спроб і помилок.
Спершу контекст. Прямо опишіть поточну й бажану поведінку, щоб Claude не зрозумів хибно те, що вже є:
I'm working in [filename]. Here's the current behavior:
[describe it]
Here's what I want it to do instead:
[describe it]
Constraints: [any important limits]
Make the change and update any affected tests.
Витягніть припущення назовні. Використовуйте цей промпт щоразу, коли вимоги бодай трохи неоднозначні. Він коштує пів хвилини й рятує від тонко неправильної реалізації:
Before you start coding, list the assumptions you're making
about how this should work. I'll confirm or correct them.
Рев'ю за чек-листом. Код-рев'ю найкорисніше, коли ви кажете, що шукати. Інакше модель схильна чіплятися до стилю й пропускати важливе. Запускайте це перед злиттям усього вагомого:
Review this code for: performance issues, security concerns,
missing error handling, and anything that would cause problems
at scale. Be specific. If something is fine, say it's fine
and move on.
Claude Code чи Copilot?
Вони сильні в різних задачах, тому ті, хто пробує обидва, зазвичай лишають обидва. Copilot виграє у вбудованому автодоповненні: підказки з'являються просто під час набору, без перемикання думок, автодоповнення по Tab у нього досі плавніше, і в інтерфейс VS Code він вбудований трохи краще. Claude Code сильніший у задачах на багато файлів, розслідуваннях, рефакторингу й у всьому, що можна описати звичайною мовою й лишити ШІ розбиратися по всій кодовій базі. В агентних можливостях він явно попереду.
Якщо обирати один, обирайте Claude Code: робота, яку добре робить лише він, цінніша за швидше автодоповнення. Багато розробників, які користуються ним щодня, однаково тримають Copilot увімкненим у фоні й перемикаються залежно від задачі.
Що змінило все
Після місяців щоденного використання найбільший приріст дало не налаштування. Його дала зміна того, що ви просите. Ті, хто вичавлює з Claude Code максимум, не пишуть із ним функції швидше. Вони дають йому більші, заплутаніші й життєвіші задачі: відкладений рефакторинг, фічу на шість файлів, розслідування, яке з'їло б пів дня читання логів.
Налаштування коштує десяти хвилин. Навчитися мислити такими великими задачами — ось справжня інвестиція, і вона того варта.