Visual Studio Code — это один из популярных редакторов кода современности, который используют разработчики самых разных направлений. Он сочетает высокую скорость, простоту, гибкость и набор функций, характерный для профессиональных инструментов разработки. Это не тяжёлая IDE, а лёгкий, расширяемый редактор, который вмещает огромный потенциал благодаря системе дополнений. VS Code доступен на всех популярных операционных системах, бесплатен, может быть настроен практически под любой стек технологий.
Что такое Visual Studio Code и чем он отличается от Visual Studio
Несмотря на схожие названия, Visual Studio Code и Visual Studio — два разных инструмента. Visual Studio — это полноценная IDE с большим количеством встроенных компонентов, предназначенная для разработки крупномасштабных проектов. Она мощная, но тяжёлая, ресурсоемкая, требует глубокого понимания экосистемы.
VS Code, наоборот, представляет собой легковесный редактор кода, который запускается быстрее, потребляет меньше ресурсов и подходит даже тем, кто только начинает изучать программирование. Он не перегружен инструментами, но при необходимости их можно добавить через расширения.
Кому подходит Visual Studio Code
Это универсальный инструмент. Им активно пользуются:
-
Веб-разработчики, работающие с HTML, CSS, JavaScript, PHP. Visual Studio Code предоставляет удобные инструменты для верстки, подсветку синтаксиса, автоматическую проверку кода, интеграцию с популярными фронтенд-фреймворками. Это делает его привлекательным для тех, кто создает сайты и веб-приложения с нуля.
-
Фронтенд-инженеры, использующие React, Vue, Angular. Благодаря расширениям для JSX, TypeScript, Vue, Angular разработчики получают полноценную среду с автодополнением, навигацией по компонентам, поддержкой сниппетов, инструментами для сборки.
-
Бекенд-разработчики, пишущие на Python, Node.js, Go, Rust, Ruby, PHP. Для этих языков доступны мощные плагины, предоставляющие дебаггер, анализ кода, форматирование, виртуальные окружения, интеграцию с серверами. VS Code легко превращается в комфортную среду для работы с любой серверной логикой.
-
Инженеры C#, которым не требуется полный функционал Visual Studio. Благодаря расширению OmniSharp VS Code обеспечивает поддержку C# и .NET, что делает редактор удобным выбором для тех, кому не нужна тяжелая IDE, но важны инструменты рефакторинга, отладки.
-
Разработчики мобильных приложений, работающие с Flutter и React Native. Плагины Flutter, React Native позволяют запускать, отлаживать приложения и работать с симуляторами прямо из редактора, а также получать подсказки по виджетам, структуре проекта.
-
DevOps-специалисты, благодаря поддержке Docker, Kubernetes, терминала. Редактор обеспечивает удобную работу с Dockerfile, YAML-конфигурациями, helm-чартами и CI/CD-сценариями. Встроенный терминал делает его отличным инструментом для автоматизации, инфраструктурных задач.
-
Студенты, начинающие разработчики, которым нужен лёгкий, понятный редактор. Интерфейс VS Code интуитивен, а огромное количество обучающих материалов помогает новичкам быстро освоиться. Он не перегружен функциями, но позволяет постепенно расширять возможности за счет дополнений.
VS Code охватывает практически любой язык программирования за счёт огромного количества плагинов. Именно поэтому его так любят в IT-сообществе — редактор подстраивается под задачу, а не наоборот.
Для чего нужен Visual Studio Code
Главная задача — обеспечить разработчику удобную и эффективную среду для написания, редактирования, форматирования кода. Это универсальный инструмент, который значительно упрощает работу как над небольшими скриптами, так и над полноценными проектами любой сложности. Благодаря встроенным возможностям, поддержке расширений редактор помогает:
-
Создавать структуры проектов. VS Code позволяет формировать базовые папки, файлы и конфигурации, облегчая организацию кода, структуру будущего приложения.
-
Подсвечивать синтаксис. Редактор автоматически определяет язык и выделяет ключевые элементы кода, обеспечивая удобное чтение, предотвращая визуальные ошибки.
-
Автоматически исправлять мелкие ошибки. Благодаря линтерам и форматтерам VS Code сам предлагает корректировки для типичных опечаток, неправильных отступов, несоответствий стилю.
-
Запускать, отлаживать проекты. Инструменты отладки позволяют пошагово выполнять код, анализировать переменные, моментально находить проблемные места.
-
Работать с терминалом. Встроенный терминал избавляет от нужды переключаться между окнами, позволяет запускать команды прямо в редакторе.
-
Контролировать версии через Git. VS Code предоставляет удобный визуальный интерфейс для коммитов, ветвления, слияния, просмотра изменений.
-
Быстро перемещаться по проекту. Умный поиск, переход к определениям и глобальная навигация помогают легко ориентироваться даже в больших проектах.
-
Конфигурировать рабочее пространство под разные цели. Редактор полностью настраивается — от тем оформления до поведения инструментов, что позволяет адаптировать VS Code под стиль, потребности конкретного разработчика.
VS Code поддерживает полноценную отладку, интеллектуальное автодополнение (IntelliSense), навигацию по функциям, многое другое. Вместо того чтобы искать нужные инструменты по отдельности, разработчик получает всё в одном приложении.
Где скачать и как установить
Скачивание программы
Visual Studio Code доступен бесплатно. Скачать его можно напрямую с официального сайта Microsoft. На главной странице пользователь увидит большую кнопку быстрой загрузки — редактор автоматически определит операционную систему, предложит установочный файл. Это делает процесс простым, исключает ошибки при выборе версии.
Помимо стандартной версии, для удобства доступны варианты установки под разные платформы:
-
Windows — включая портативную сборку, которую можно запускать без установки;
-
Linux — представлены пакеты в форматах .deb, .rpm, а также архив tar.gz для универсальной установки;
-
macOS — доступны версии как для процессоров Intel, так и для Apple Silicon.
Если хотите лишь ознакомиться с возможностями редактора, но не готовы устанавливать его на компьютер, можно воспользоваться онлайн-версией, работающей прямо в браузере. Она подходит для тестирования и небольших задач, хотя, конечно, не способна полностью заменить приложение.
Установка программы
После загрузки файла остаётся только запустить инсталлятор и по очереди выполнить шаги мастера установки. Процесс простой — всего несколько кликов, и редактор будет установлен.
Новичкам лучше оставить настройки по умолчанию. В дальнейшем, когда появится опыт работы, можно подключить дополнительные параметры:
-
интеграцию в контекстное меню;
-
добавление Visual Studio Code в PATH;
-
создание удобных ярлыков запуска.
Запуск на слабых компьютерах
Иногда на старых ПК или системах с недостаточными ресурсами VS Code может запускаться медленно, зависать или показывать чёрный экран. Это связано с тем, что редактор построен на Electron — платформе, напоминающей по работе браузер, и потому требовательной к графике, оперативной памяти.
Однако существует решение:
-
Откройте свойства ярлыка VS Code.
-
В конце строки с путем к приложению добавьте флаг:
Этот параметр отключает аппаратное ускорение и позволяет запустить редактор даже на слабых устройствах, снижая нагрузку на видеокарту, процессор.
Как установить русский язык в Visual Studio Code
Чтобы изменить язык интерфейса:
-
Откройте панель расширений (Ctrl+Shift+X).
-
Введите в поиске Russian Language Pack.
-
Установите пакет, перезапустите VS Code.
После перезапуска интерфейс станет русскоязычным. Однако опытные разработчики часто предпочитают английскую версию, поскольку большинство статей, документаций, обсуждений в сети — англоязычные.
Интерфейс
Visual Studio Code основан на Electron, а значит интерфейс собирается с помощью веб-технологий. Это делает его гибким и функциональным, но одновременно легким для освоения.
Основные элементы интерфейса:
-
Рабочая область — место, где открыт файл с кодом.
-
Верхнее меню — доступ к базовым функциям.
-
Боковая панель — структура проекта, Git, поиск, расширения, отладка.
-
Терминал — встроенная командная строка, которую можно открыть горячей клавишей Ctrl+` (тильда).
VS Code поддерживает работу с несколькими файлами в разных вкладках, а также позволяет разделить экран на две или три части, как в полноценных IDE.
Настройка Visual Studio Code
Настройки открываются сочетанием Ctrl + , или через меню File → Preferences → Settings.
Есть два пути настройки:
1. Графический интерфейс
Подходит новичкам — все параметры разбиты по категориям.
2. Ручное редактирование settings.json
Подходит опытным пользователям — позволяет глубоко изменить поведение редактора.
Полезные параметры:
-
Auto Save — включает автоматическое сохранение.
-
Font Size — изменение размера шрифта.
-
Format On Paste — автоформатирование при вставке.
-
Trim Trailing Whitespace — удаление пробелов в конце строк.
Также можно быстро менять цветовую схему через командную палитру (Ctrl+Shift+P → Theme).
Возможности Visual Studio Code
Редактирование и написание кода
Visual Studio Code предоставляет разработчику обширный набор инструментов, которые облегчают работу с кодом на любом языке. Редактор автоматически анализирует структуру файлов и предоставляет набор средств для комфортной разработки:
-
Подсветка синтаксиса. Цветовое выделение элементов кода делает его визуально понятным, позволяет быстрее замечать ошибки.
-
Умное автодополнение. IntelliSense предлагает варианты продолжения кода на основе контекста, структуры проекта, подключенных библиотек.
-
Автоформатирование. Редактор автоматически выравнивает отступы, расставляет пробелы, приводит код к единообразному стилю.
-
Рефакторинг. Поддерживаются быстрые операции: переименование переменных, перенос кода в функции, исправление импорта.
-
Подсказки IntelliSense. Всплывающие подсказки помогают быстрее ориентироваться в API, структуре проекта.
-
Отображение ошибок в режиме реального времени. Visual Studio Code подсвечивает проблемные участки, предлагает варианты исправления еще до запуска программы.
Благодаря такому набору возможностей редактор превращается в полноценную рабочую платформу, а не просто в инструмент для набора текста.
Автоматическое редактирование
VS Code позволяет автоматизировать большое количество рутинных задач при помощи расширений вроде Prettier, ESLint. Эти инструменты:
-
Исправляют отступы. Приводят структуру кода к единообразному оформлению.
-
Убирают лишние пробелы. Автоматически очищают файл от ненужных символов при сохранении.
-
Следят за стилем. Применяют выбранный командой стиль написания кода, что особенно важно в больших проектах.
-
Предотвращают синтаксические ошибки. Линтеры сразу подсказывают, где нарушены правила или возможны логические проблемы.
Автоматизация упрощает работу команды, помогает поддерживать чистоту, читаемость проекта.
Поиск и вставка
Инструменты поиска в VS Code позволяют быстро ориентироваться даже в крупных проектах. Встроенная система поддерживает:
-
Обычный поиск по файлу. Подходит для точечного поиска переменных, функций или фрагментов текста.
-
Расширенный поиск по проекту. Помогает находить нужные элементы во всех папках, файлах проекта одновременно.
-
Регулярные выражения. Позволяют выполнять сложные запросы и находить паттерны, соответствующие определенным правилам.
-
Массовую замену текста. Ускоряет редактирование, позволяя менять повторяющиеся конструкции всего за пару кликов.
Эти инструменты существенно увеличивают скорость работы, минимизируют рутинные операции.
Контроль версий
Visual Studio Code содержит встроенную, очень удобную интеграцию с Git. Прямо из редактора можно выполнять все основные действия:
-
Просмотр изменений. Показывает, что было удалено, добавлено или изменено.
-
Создание коммитов. Позволяет фиксировать изменения одним нажатием кнопки.
-
Управление ветками. Создание, переключение, удаление веток доступно через визуальный интерфейс.
-
Визуальный дифф. Открывает разницу между версиями файлов в удобном формате.
-
Работа с удалёнными репозиториями. Поддерживает GitHub, GitLab, Bitbucket, другие платформы.
-
Интеграция с GitHub, GitLab. Позволяет выполнять pull requests, другие операции прямо из редактора.
Благодаря этому Visual Studio Code помогает экономить время и избегать ошибок, связанных с ручным вводом команд.
Запуск и отладка кода
Вкладка «Запуск и отладка» делает VS Code полноценным инструментом для тестирования приложений:
-
Просматривать состояние переменных. Показывает текущие значения и помогает анализировать поведение программы.
-
Выполнять код пошагово. Позволяет отслеживать каждый этап выполнения.
-
Устанавливать точки останова. Останавливает программу в нужном месте для анализа.
-
Отслеживать стеки вызовов. Показывает, как именно был достигнут конкретный участок кода.
Большинству языков достаточно установить профильное расширение — VS Code становится комфортной средой для отладки.
Горячие клавиши в Visual Studio Code
Редактор содержит десятки удобных сочетаний клавиш, которые значительно ускоряют работу. Многие опытные разработчики работают почти без мыши, переключаясь между файлами, функциями, вкладками с помощью клавиатуры.
Таблица горячих клавиш из исходного текста полностью корректна, может быть использована в готовом виде.
Установка расширений (плагинов)
Расширения — особенность Visual Studio Code. Именно они превращают его из лёгкого редактора в мощную, гибкую платформу разработки.
Чтобы установить расширение, достаточно:
-
Открыть панель расширений (Ctrl+Shift+X).
-
Найти нужный плагин через поиск.
-
Нажать Install.
-
Управлять параметрами через меню Manage.
На странице каждого расширения доступна подробная информация:
-
описание, область применения;
-
количество установок — показатель доверия сообщества;
-
рейтинг на основе отзывов;
-
история изменений;
-
зависимости от других плагинов;
-
список возможностей, команд;
-
поддерживаемые горячие клавиши.
Каталог расширений содержит плагины для всех популярных языков, инструментов, фреймворков. Есть небольшие дополнения — например, панели, темизации, визуальные улучшения.
Преимущества Visual Studio Code
VS Code стал популярным благодаря сочетанию преимуществ, которые сделали его универсальным инструментом для разработчиков разного уровня и специализации.
Простота освоения
Редактор обладает интуитивно понятным интерфейсом и логичной навигацией, поэтому даже новичок может быстро начать работать в нём. Большое количество обучающих материалов, подсказок, встроенных функций облегчает первые шаги в программировании.
Малый вес
По сравнению с IDE, Visual Studio Code потребляет значительно меньше ресурсов, запускается заметно быстрее. Он остается легким даже при установке нескольких расширений, из-за чего комфортно работает на большинстве устройств.
Кроссплатформенность
Редактор доступен на Windows, Linux и macOS, что делает его удобным для разработчиков, работающих с разными операционными системами. Возможность синхронизации настроек между устройствами позволяет легко переносить рабочую среду.
Поддержка множества языков
VS Code подходит тем, кто работает в мультистековой среде: редактор поддерживает десятки языков из коробки, а остальные подключаются через расширения. Это делает его особенно удобным для разработчиков, которые совмещают несколько технологий в рамках одного проекта.
Гибкость
Благодаря огромной экосистеме расширений VS Code можно адаптировать практически под любую задачу — от простой верстки до работы с контейнерами, базами данных, облачными сервисами. Настройки, темы, плагины, профили дают возможность создать полностью персонализированную рабочую среду.
Недостатки Visual Studio Code
Несмотря на впечатляющий набор возможностей и огромное количество преимуществ, важно понимать, что VS Code остаётся именно редактором кода, а не полноценной интегрированной средой разработки. Его философия — легкость, гибкость и минимализм, поэтому некоторые задачи, характерные для крупных IDE, здесь реализуются через расширения или требуют дополнительной настройки.
Ограниченная функциональность
Существуют языки и технологии, для которых необходима глубокая интеграция с инструментами компиляции, профилирования или анализа производительности — например, Java, C++ или некоторые промышленные фреймворки. В таких случаях IDE предоставляют расширенные возможности, которые Visual Studio Code восполняет только частично. Для сложных корпоративных проектов редактор может оказаться недостаточно мощным.
Производительность на слабых ПК
VS Code работает на движке Electron, который по сути представляет собой легкий браузер. Это дает кроссплатформенность, но требует ресурсов. На компьютерах с устаревшими процессорами, медленными HDD-дисками или небольшим количеством оперативной памяти редактор может запускаться дольше, иногда подвисать, работать менее плавно. Особенно заметны проблемы при открытии больших проектов.
Зависимость от расширений
Базовая версия VS Code минималистична. Чтобы превратить редактор в рабочий инструмент, приходится устанавливать десятки расширений: для языков, форматирования, дебага, работы с контейнерами и так далее. Это гибко и удобно, но чрезмерное количество плагинов может повлиять на скорость работы, вызвать конфликты или потребовать регулярного обновления, контроля совместимости.
Visual Studio Code — это гибкий, мощный и бесплатный инструмент, который подходит для большинства разработчиков. Его простота сочетается с огромными возможностями, а установка дополнительных расширений превращает его в среду разработки для любого проекта. VS Code продолжает активно развиваться, поддерживается Microsoft и огромным комьюнити, что делает его одним из перспективных редакторов на рынке.
<!DOCTYPE html>
<html class="h-100" data-bs-theme="light" data-mantine-color-scheme="light" lang="ru" prefix="og: https://ogp.me/ns#">
<head>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<link crossorigin="true" href="https://cdn.hexlet.io" rel="preconnect">
<link href="https://mc.yandex.ru" rel="preconnect">
<meta content="aa2vrdtq64dub8knuf83lwywit311w" name="facebook-domain-verification">
<link href="/favicon.ico" rel="icon" sizes="any">
<link href="/favicon.svg" rel="icon" type="image/svg+xml">
<link href="/apple-touch-icon.png" rel="apple-touch-icon">
<link href="/manifest.webmanifest" rel="manifest">
<script>
//<![CDATA[
window.gon={};gon.ym_counter="25559621";gon.is_bot=true;gon.applications={};gon.current_user={"id":null,"last_viewed_notification_id":null,"email":null,"state":null,"first_name":"","last_name":"","created_at":"2026-02-26 18:13:44 UTC","current_program":null,"current_team":null,"full_name":"","guest":true,"can_use_paid_features":false,"is_hexlet_employee":false,"sanitized_phone_number":"","can_subscribe":true,"can_renew_education":false};gon.token="XmTYIIiuVn0YMH_p_mHu-4UnJMRpZ3Z_i4PWO_eWXVCxtRMXetD7Ha5zW3Hybh6MRS4JbmFQiN02Y0xvpZG6Pg";gon.locale="ru";gon.language="ru";gon.theme="light";gon.rails_env="production";gon.mobile=false;gon.google={"analytics_key":"UA-1360700-51","optimize_key":"GTM-5QDVFPF"};gon.captcha={"google_v3_site_key":"6LenGbgZAAAAAM7HbrDbn5JlizCSzPcS767c9vaY","yandex_site_key":"ysc1_Vyob5ZPPUdPBsu0ykt8bVFdzsfpoVjQChLGl2b4g19647a89","verification_failed":null};gon.social_signin=false;gon.typoreporter_google_form_id="1FAIpQLSeibfGq-KvWQ2Fyru-zkFFRVTLBuzXAHAoEyN1p49FtDmNoNA";
//]]>
</script>
<meta charset="utf-8">
<title>Что такое Visual Studio Code? — Q&A Хекслет</title>
<meta name="description" content="2 ответа на вопрос, что такое Visual Studio Code простыми словами? Глоссарий Хекслета.">
<link rel="canonical" href="https://ru.hexlet.io/qna/glossary/questions/chto-takoe-visual-studio-code">
<meta property="og:description" content="2 ответа
на вопрос, что такое Visual Studio Code простыми словами? Глоссарий Хекслета.">
<meta property="og:title" content="Что такое Visual Studio Code? — Q&A Хекслет">
<meta property="og:url" content="https://ru.hexlet.io/qna/glossary/questions/chto-takoe-visual-studio-code">
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="RqTodWC3YsGl10T3liz5PeCrbLbez7mWx2qKjGJNObepdSNCksnPoROUYG-aIwlKIKJBHNb4RzR6ihDYMEre2Q" />
<script src="/vite/assets/inertia-BIn5nEMk.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="/vite/assets/chunk-DsPFFUou.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/preload-helper-BJ4cLWpC.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/init-DOv3_-Z_.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/ahoy-DrlRQ-1D.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/analytics-cb8xch9l.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/ErrorFallbackBlock-naDSYSy9.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Surface-DL2bpZA-.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/gon-D3e4yh1x.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/mantine-CGMYrt2Y.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/utils-DRqSHbQE.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/routes-CCH8ilKF.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/extends-C-EagtpE.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/inheritsLoose-BBd-DCVI.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/objectWithoutPropertiesLoose-DRHXDhjp.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/index.esm-DAqKOkZ0.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Button-CGPUux8l.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/CloseButton-D1euiPao.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Group-BX48WcuU.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Loader-BQEY8g6v.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Modal-Cy3HByv7.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/OptionalPortal-1Hza5P2w.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Stack-CtjJzfw4.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Textarea-Ck64llAy.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Box-B5-OOzBf.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/DirectionProvider-Dc9zdUke.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/events-DJQOhap0.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/use-reduced-motion-D2owz4wa.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/use-disclosure-zKtK5W1r.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/use-hotkeys-Cnc_Rwkb.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/random-id-DOQyszCZ.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/notifications.store-C-3AFSMn.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/exports-C_MrNx_T.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/axios-BEvgo0ym.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/dayjs.min-BkKovM-s.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/i18next-BlSq9s7B.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/client-U9M77rxp.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-dom-DaLxUz_h.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/useTranslation-Bx1Cdrkz.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/compiler-runtime-6XxiPFnt.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/jsx-runtime-CwjcCKJi.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-CkL4ZRHB.js" as="script" crossorigin="anonymous">
<link rel="stylesheet" href="/vite/assets/application-BqhCP46M.js" />
<script src="/vite/assets/application-Df9RExpe.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="/vite/assets/chunk-DsPFFUou.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/autocomplete-VMNbxKGl.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/routes-CCH8ilKF.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/createPopper-C3aM9r1M.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/js.cookie-D1-O8zkX.js" as="script" crossorigin="anonymous"><link rel="stylesheet" href="/vite/assets/application-C8HjmMaq.css" media="screen" />
<script>
window.ym = function(){(ym.a=ym.a||[]).push(arguments)};
window.addEventListener('load', function() {
setTimeout(function() {
ym.l = 1*new Date();
ym(window.gon.ym_counter, "init", {
clickmap: true,
trackLinks: true,
accurateTrackBounce: true,
webvisor: true
});
// Загружаем скрипт
var k = document.createElement('script');
k.async = 1;
k.src = 'https://mc.yandex.ru/metrika/tag.js';
document.head.appendChild(k);
ym(window.gon.ym_counter, 'getClientID', function(clientID) {
window.ymClientId = clientID;
});
}, 1500);
});
</script>
<!-- Google Tag Manager - deferred -->
<script>
// dataLayer stub сразу — пуши работают до загрузки скрипта
window.dataLayer = window.dataLayer || [];
// Сам скрипт — отложенно после load
window.addEventListener('load', function() {
setTimeout(function() {
dataLayer.push({'gtm.start': new Date().getTime(), event: 'gtm.js'});
var j = document.createElement('script');
j.async = true;
j.src = 'https://www.googletagmanager.com/gtm.js?id=GTM-WK88TH';
document.head.appendChild(j);
}, 1500);
});
</script>
<!-- End Google Tag Manager -->
</head>
<body>
<noscript>
<div>
<img alt="" src="https://mc.yandex.ru/watch/25559621" style="position:absolute; left:-9999px;">
</div>
</noscript>
<header class="sticky-top bg-body">
<nav class="navbar navbar-expand-lg">
<div class="container-xxl">
<a class="navbar-brand" href="/"><img alt="Логотип Хекслета" height="24" src="https://ru.hexlet.io/vite/assets/logo_ru_light-BpiEA1LT.svg" width="96">
</a><button aria-controls="collapsable" aria-expanded="false" aria-label="Меню" class="navbar-toggler border-0 mb-0 mt-1" data-bs-target="#collapsable" data-bs-toggle="collapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="collapsable">
<ul class="navbar-nav mb-lg-0 mt-lg-1">
<li class="nav-item dropdown">
<button aria-haspopup class="btn nav-link" data-bs-toggle="dropdown" type="button">
Все курсы
<span class="bi bi-chevron-down align-middle ms-1"></span>
</button>
<ul class="dropdown-menu">
<li>
<a class="dropdown-item d-flex py-2" href="/courses"><div class="fw-bold me-auto">Все что есть</div>
<div class="text-muted">117</div>
</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li class="dropdown-item">
<b>Популярные категории</b>
</li>
<li>
<a class="dropdown-item py-2" href="/courses_devops">Курсы по DevOps
</a></li>
<li>
<a class="dropdown-item py-2" href="/courses_data_analytics">Курсы по аналитике данных
</a></li>
<li>
<a class="dropdown-item py-2" href="/courses_programming">Курсы по программированию
</a></li>
<li>
<a class="dropdown-item py-2" href="/courses_testing">Курсы по тестированию
</a></li>
<li>
<hr class="dropdown-divider">
</li>
<li class="dropdown-item">
<b>Популярные курсы</b>
</li>
<li>
<a class="dropdown-item py-2" href="/programs/devops-engineer-from-scratch">DevOps-инженер с нуля
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/go">Go-разработчик
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/java">Java-разработчик
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/python">Python-разработчик
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/qa-auto-engineer-java">Автоматизатор тестирования на Java
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/data-analytics">Аналитик данных
</a></li>
<li>
<a class="dropdown-item py-2" href="/programs/frontend">Фронтенд-разработчик
</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<button aria-haspopup class="btn nav-link" data-bs-toggle="dropdown" type="button">
О Хекслете
<span class="bi bi-chevron-down align-middle"></span>
</button>
<ul class="dropdown-menu bg-body">
<li>
<a class="dropdown-item py-2" href="/pages/about">О нас
</a></li>
<li>
<a class="dropdown-item py-2" href="/blog">Блог
</a></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://special.hexlet.io/hse-research" role="button">Результаты (Исследование)
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://career.hexlet.io" role="button">Хекслет Карьера
</span></li>
<li>
<a class="dropdown-item py-2" href="/testimonials">Отзывы студентов
</a></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://t.me/hexlet_help_bot" role="button">Поддержка (В ТГ)
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://special.hexlet.io/referal-program/?promo_creative=priglasite-druzei&promo_name=referal-program&promo_position=promo_position&promo_start=010724&promo_type=link" role="button">Реферальная программа
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://special.hexlet.io/certificate" role="button">Подарочные сертификаты
</span></li>
<li>
<span class="dropdown-item py-2 external-link" data-href="https://hh.ru/employer/4307094" role="button">Вакансии
</span></li>
<li>
<span class="dropdown-item d-flex external-link" rel="noopener noreferrer nofollow" data-href="https://b2b.hexlet.io" data-target="_blank" role="button">Компаниям
</span></li>
<li>
<span class="dropdown-item d-flex external-link" rel="noopener noreferrer nofollow" data-href="https://hexly.ru/" data-target="_blank" role="button">Колледж
</span></li>
<li>
<span class="dropdown-item d-flex external-link" rel="noopener noreferrer nofollow" data-href="https://hexlyschool.ru/" data-target="_blank" role="button">Частная школа
</span></li>
</ul>
</li>
<li><a class="nav-link" href="/subscription/new">Подписка</a></li>
</ul>
<ul class="navbar-nav flex-lg-row align-items-lg-center gap-2 ms-auto">
<li>
<a class="nav-link" aria-label="Переключить тему" href="/theme/switch?new_theme=dark"><span aria-hidden="true" class="bi bi-moon"></span>
</a></li>
<li>
<span data-target="_self" class="nav-link external-link" data-href="/u/new" role="button"><span>Регистрация</span>
</span></li>
<li>
<span data-target="_self" class="nav-link external-link" data-href="https://ru.hexlet.io/session/new" role="button"><span>Вход</span>
</span></li>
</ul>
</div>
</div>
</nav>
</header>
<div class="x-container-xxxl">
</div>
<main class="mb-6 min-vh-100 h-100">
<link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Mzk3MSwicHVyIjoiYmxvYl9pZCJ9fQ==--126b25f39a57b0fdbd31895236a8d1da05b80ac4/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Server-amico.png"/><link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzcyNywicHVyIjoiYmxvYl9pZCJ9fQ==--2d5cbbf5c3b4a73ae4b2c50632305d78f5872e4d/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Programmer-rafiki.png"/><link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6NDAzNCwicHVyIjoiYmxvYl9pZCJ9fQ==--ba516ea9573bdfcd1d21e2aa0fff8818561828f2/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Typing-bro.png"/><link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY3NywicHVyIjoiYmxvYl9pZCJ9fQ==--745022c2f47ba4203dd11cd8922cd55d5bebfdca/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Code%20typing-rafiki.png"/><link rel="preload" as="image" href="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY4NywicHVyIjoiYmxvYl9pZCJ9fQ==--8b6c104f41f902085a7d6e50ea73457f84a3ac33/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Coding-amico.png"/><link rel="preload" as="image" href="/vite/assets/development-BVihs_d5.png"/><div id="app" data-page="{"component":"web/qna/questions/show","props":{"errors":{},"locale":"ru","language":"ru","httpsHost":"https://ru.hexlet.io","host":"ru.hexlet.io","colorScheme":"light","auth":{"user":{"id":null,"last_viewed_notification_id":null,"email":null,"state":null,"first_name":"","last_name":"","created_at":"2026-02-26T18:13:44.539Z","current_program":null,"current_team":null,"full_name":"","guest":true,"can_use_paid_features":false,"is_hexlet_employee":false,"sanitized_phone_number":"","can_subscribe":true,"can_renew_education":false}},"cloudflareTurnstileSiteKey":"0x4AAAAAAA15KmeFXzd2H0Xo","vkIdClientId":"51586979","yandexIdClientId":"88d071f1d3384eb4bd1deb37910235c7","formAuthToken":"iEZZViPqNca4KoEDM7yr4M-fO-gK6PLleTklTXERvQ5nl5Jh0ZSYpg5ppZs_s1uXD5YWQgLfDEfE2b8ZIxZaYA","category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"mainStackCategory":{"id":7,"name":"Курсы по DevOps","slug":"devops","short_name":"DevOps","order":4,"state":"published","category_slug":"courses_devops"},"answerDto":{"id":null,"body":"","meta":{"model":"question_answer","relations":{}}},"question":{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3771,"answers_count":2,"slug":"chto-takoe-visual-studio-code","state":"published","title":"Visual Studio Code","created_at":"2023-06-05T10:02:24.977Z","details":null,"best_answer_id":5349,"related_stacks_count":5},"answers":[{"user":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"question":{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3771,"answers_count":2,"slug":"chto-takoe-visual-studio-code","state":"published","title":"Visual Studio Code","created_at":"2023-06-05T10:02:24.977Z","details":null,"best_answer_id":5349,"related_stacks_count":5},"id":5349,"state":"active","body":"Visual Studio Code — это один из популярных редакторов кода современности, который используют разработчики самых разных направлений. Он сочетает высокую скорость, простоту, гибкость и набор функций, характерный для профессиональных инструментов разработки. Это не тяжёлая IDE, а лёгкий, расширяемый редактор, который вмещает огромный потенциал благодаря системе дополнений. VS Code доступен на всех популярных операционных системах, бесплатен, может быть настроен практически под любой стек технологий.\n\n\n\n## Что такое Visual Studio Code и чем он отличается от Visual Studio\n\nНесмотря на схожие названия, **Visual Studio Code** и **Visual Studio** — два разных инструмента. Visual Studio — это полноценная IDE с большим количеством встроенных компонентов, предназначенная для разработки крупномасштабных проектов. Она мощная, но тяжёлая, ресурсоемкая, требует глубокого понимания экосистемы.\n\nVS Code, наоборот, представляет собой легковесный редактор кода, который запускается быстрее, потребляет меньше ресурсов и подходит даже тем, кто только начинает изучать программирование. Он не перегружен инструментами, но при необходимости их можно добавить через расширения.\n\n## Кому подходит Visual Studio Code\n\nЭто универсальный инструмент. Им активно пользуются:\n\n* **Веб-разработчики, работающие с HTML, CSS, JavaScript, PHP. Visual Studio Code** предоставляет удобные инструменты для верстки, подсветку синтаксиса, автоматическую проверку кода, интеграцию с популярными фронтенд-фреймворками. Это делает его привлекательным для тех, кто создает сайты и веб-приложения с нуля.\n\n* **Фронтенд-инженеры, использующие React, Vue, Angular.** Благодаря расширениям для JSX, TypeScript, Vue, Angular разработчики получают полноценную среду с автодополнением, навигацией по компонентам, поддержкой сниппетов, инструментами для сборки.\n\n* **Бекенд-разработчики, пишущие на Python, Node.js, Go, Rust, Ruby, PHP.** Для этих языков доступны мощные плагины, предоставляющие дебаггер, анализ кода, форматирование, виртуальные окружения, интеграцию с серверами. VS Code легко превращается в комфортную среду для работы с любой серверной логикой.\n\n* **Инженеры C#, которым не требуется полный функционал Visual Studio.** Благодаря расширению OmniSharp VS Code обеспечивает поддержку C# и .NET, что делает редактор удобным выбором для тех, кому не нужна тяжелая IDE, но важны инструменты рефакторинга, отладки.\n\n* **Разработчики мобильных приложений, работающие с Flutter и React Native.** Плагины Flutter, React Native позволяют запускать, отлаживать приложения и работать с симуляторами прямо из редактора, а также получать подсказки по виджетам, структуре проекта.\n\n* **DevOps-специалисты, благодаря поддержке Docker, Kubernetes, терминала.** Редактор обеспечивает удобную работу с Dockerfile, YAML-конфигурациями, helm-чартами и CI/CD-сценариями. Встроенный терминал делает его отличным инструментом для автоматизации, инфраструктурных задач.\n\n* **Студенты, начинающие разработчики, которым нужен лёгкий, понятный редактор.** Интерфейс VS Code интуитивен, а огромное количество обучающих материалов помогает новичкам быстро освоиться. Он не перегружен функциями, но позволяет постепенно расширять возможности за счет дополнений.\n\nVS Code охватывает практически любой язык программирования за счёт огромного количества плагинов. Именно поэтому его так любят в IT-сообществе — редактор подстраивается под задачу, а не наоборот.\n\n## Для чего нужен Visual Studio Code\n\nГлавная задача — обеспечить разработчику удобную и эффективную среду для написания, редактирования, форматирования кода. Это универсальный инструмент, который значительно упрощает работу как над небольшими скриптами, так и над полноценными проектами любой сложности. Благодаря встроенным возможностям, поддержке расширений редактор помогает:\n\n* **Создавать структуры проектов.** VS Code позволяет формировать базовые папки, файлы и конфигурации, облегчая организацию кода, структуру будущего приложения.\n\n* **Подсвечивать синтаксис.** Редактор автоматически определяет язык и выделяет ключевые элементы кода, обеспечивая удобное чтение, предотвращая визуальные ошибки.\n\n* **Автоматически исправлять мелкие ошибки.** Благодаря линтерам и форматтерам VS Code сам предлагает корректировки для типичных опечаток, неправильных отступов, несоответствий стилю.\n\n* **Запускать, отлаживать проекты.** Инструменты отладки позволяют пошагово выполнять код, анализировать переменные, моментально находить проблемные места.\n\n* **Работать с терминалом.** Встроенный терминал избавляет от нужды переключаться между окнами, позволяет запускать команды прямо в редакторе.\n\n* **Контролировать версии через Git.** VS Code предоставляет удобный визуальный интерфейс для коммитов, ветвления, слияния, просмотра изменений.\n\n* **Быстро перемещаться по проекту.** Умный поиск, переход к определениям и глобальная навигация помогают легко ориентироваться даже в больших проектах.\n\n* **Конфигурировать рабочее пространство под разные цели.** Редактор полностью настраивается — от тем оформления до поведения инструментов, что позволяет адаптировать VS Code под стиль, потребности конкретного разработчика.\n\nVS Code поддерживает полноценную отладку, интеллектуальное автодополнение (IntelliSense), навигацию по функциям, многое другое. Вместо того чтобы искать нужные инструменты по отдельности, разработчик получает всё в одном приложении.\n\n## Где скачать и как установить\n\n\n\n### Скачивание программы\n\nVisual Studio Code доступен бесплатно. Скачать его можно напрямую с официального сайта Microsoft. На главной странице пользователь увидит большую кнопку быстрой загрузки — редактор автоматически определит операционную систему, предложит установочный файл. Это делает процесс простым, исключает ошибки при выборе версии.\n\nПомимо стандартной версии, для удобства доступны варианты установки под разные платформы:\n\n* **Windows** — включая портативную сборку, которую можно запускать без установки;\n\n* **Linux** — представлены пакеты в форматах **.deb**, **.rpm**, а также архив **tar.gz** для универсальной установки;\n\n* **macOS** — доступны версии как для процессоров **Intel**, так и для **Apple Silicon**.\n\nЕсли хотите лишь ознакомиться с возможностями редактора, но не готовы устанавливать его на компьютер, можно воспользоваться онлайн-версией, работающей прямо в браузере. Она подходит для тестирования и небольших задач, хотя, конечно, не способна полностью заменить приложение.\n\n### Установка программы\n\nПосле загрузки файла остаётся только запустить инсталлятор и по очереди выполнить шаги мастера установки. Процесс простой — всего несколько кликов, и редактор будет установлен.\n\nНовичкам лучше оставить настройки по умолчанию. В дальнейшем, когда появится опыт работы, можно подключить дополнительные параметры:\n\n* интеграцию в контекстное меню;\n\n* добавление **Visual Studio Code** в `PATH`;\n\n* создание удобных ярлыков запуска.\n\n### Запуск на слабых компьютерах\n\nИногда на старых ПК или системах с недостаточными ресурсами VS Code может запускаться медленно, зависать или показывать чёрный экран. Это связано с тем, что редактор построен на Electron — платформе, напоминающей по работе браузер, и потому требовательной к графике, оперативной памяти.\n\nОднако существует решение:\n\n1. Откройте свойства ярлыка VS Code.\n\n2. В конце строки с путем к приложению добавьте флаг:\n\n```bash\n--disable-gpu\n```\n\nЭтот параметр отключает аппаратное ускорение и позволяет запустить редактор даже на слабых устройствах, снижая нагрузку на видеокарту, процессор.\n\n## Как установить русский язык в Visual Studio Code\n\nЧтобы изменить язык интерфейса:\n\n1. Откройте панель расширений (<kbd>Ctrl+Shift+X</kbd>).\n\n2. Введите в поиске *Russian Language Pack*.\n\n3. Установите пакет, перезапустите VS Code.\n\nПосле перезапуска интерфейс станет русскоязычным. Однако опытные разработчики часто предпочитают английскую версию, поскольку большинство статей, документаций, обсуждений в сети — англоязычные.\n\n## Интерфейс\n\nVisual Studio Code основан на Electron, а значит интерфейс собирается с помощью веб-технологий. Это делает его гибким и функциональным, но одновременно легким для освоения.\n\n### Основные элементы интерфейса:\n\n* **Рабочая область** — место, где открыт файл с кодом.\n\n* **Верхнее меню** — доступ к базовым функциям.\n\n* **Боковая панель** — структура проекта, Git, поиск, расширения, отладка.\n\n* **Терминал** — встроенная командная строка, которую можно открыть горячей клавишей <kbd>Ctrl+`</kbd> (тильда).\n\nVS Code поддерживает работу с несколькими файлами в разных вкладках, а также позволяет разделить экран на две или три части, как в полноценных IDE.\n\n## Настройка Visual Studio Code\n\nНастройки открываются сочетанием <kbd>Ctrl + ,</kbd> или через меню *File → Preferences → Settings*.\n\nЕсть два пути настройки:\n\n### 1. Графический интерфейс\n\nПодходит новичкам — все параметры разбиты по категориям.\n\n### 2. Ручное редактирование settings.json\n\nПодходит опытным пользователям — позволяет глубоко изменить поведение редактора.\n\n### Полезные параметры:\n\n* **Auto Save** — включает автоматическое сохранение.\n\n* **Font Size** — изменение размера шрифта.\n\n* **Format On Paste** — автоформатирование при вставке.\n\n* **Trim Trailing Whitespace** — удаление пробелов в конце строк.\n\nТакже можно быстро менять цветовую схему через командную палитру (<kbd>Ctrl+Shift+P</kbd> → Theme).\n\n## Возможности Visual Studio Code\n\n### Редактирование и написание кода\n\n**Visual Studio Code** предоставляет разработчику обширный набор инструментов, которые облегчают работу с кодом на любом языке. Редактор автоматически анализирует структуру файлов и предоставляет набор средств для комфортной разработки:\n\n* **Подсветка синтаксиса.** Цветовое выделение элементов кода делает его визуально понятным, позволяет быстрее замечать ошибки.\n\n* **Умное автодополнение.** IntelliSense предлагает варианты продолжения кода на основе контекста, структуры проекта, подключенных библиотек.\n\n* **Автоформатирование.** Редактор автоматически выравнивает отступы, расставляет пробелы, приводит код к единообразному стилю.\n\n* **Рефакторинг.** Поддерживаются быстрые операции: переименование переменных, перенос кода в функции, исправление импорта.\n\n* **Подсказки IntelliSense.** Всплывающие подсказки помогают быстрее ориентироваться в API, структуре проекта.\n\n* **Отображение ошибок в режиме реального времени. Visual Studio Code** подсвечивает проблемные участки, предлагает варианты исправления еще до запуска программы.\n\nБлагодаря такому набору возможностей редактор превращается в полноценную рабочую платформу, а не просто в инструмент для набора текста.\n\n## Автоматическое редактирование\n\n\n\nVS Code позволяет автоматизировать большое количество рутинных задач при помощи расширений вроде Prettier, ESLint. Эти инструменты:\n\n* **Исправляют отступы.** Приводят структуру кода к единообразному оформлению.\n\n* **Убирают лишние пробелы.** Автоматически очищают файл от ненужных символов при сохранении.\n\n* **Следят за стилем.** Применяют выбранный командой стиль написания кода, что особенно важно в больших проектах.\n\n* **Предотвращают синтаксические ошибки.** Линтеры сразу подсказывают, где нарушены правила или возможны логические проблемы.\n\nАвтоматизация упрощает работу команды, помогает поддерживать чистоту, читаемость проекта.\n\n## Поиск и вставка\n\nИнструменты поиска в VS Code позволяют быстро ориентироваться даже в крупных проектах. Встроенная система поддерживает:\n\n* **Обычный поиск по файлу.** Подходит для точечного поиска переменных, функций или фрагментов текста.\n\n* **Расширенный поиск по проекту.** Помогает находить нужные элементы во всех папках, файлах проекта одновременно.\n\n* **Регулярные выражения.** Позволяют выполнять сложные запросы и находить паттерны, соответствующие определенным правилам.\n\n* **Массовую замену текста.** Ускоряет редактирование, позволяя менять повторяющиеся конструкции всего за пару кликов.\n\nЭти инструменты существенно увеличивают скорость работы, минимизируют рутинные операции.\n\n## Контроль версий\n\n**Visual Studio Code** содержит встроенную, очень удобную интеграцию с Git. Прямо из редактора можно выполнять все основные действия:\n\n* **Просмотр изменений.** Показывает, что было удалено, добавлено или изменено.\n\n* **Создание коммитов.** Позволяет фиксировать изменения одним нажатием кнопки.\n\n* **Управление ветками.** Создание, переключение, удаление веток доступно через визуальный интерфейс.\n\n* **Визуальный дифф.** Открывает разницу между версиями файлов в удобном формате.\n\n* **Работа с удалёнными репозиториями.** Поддерживает GitHub, GitLab, Bitbucket, другие платформы.\n\n* **Интеграция с GitHub, GitLab.** Позволяет выполнять pull requests, другие операции прямо из редактора.\n\nБлагодаря этому **Visual Studio Code** помогает экономить время и избегать ошибок, связанных с ручным вводом команд.\n\n## Запуск и отладка кода\n\nВкладка **«Запуск и отладка»** делает VS Code полноценным инструментом для тестирования приложений:\n\n* **Просматривать состояние переменных.** Показывает текущие значения и помогает анализировать поведение программы.\n\n* **Выполнять код пошагово.** Позволяет отслеживать каждый этап выполнения.\n\n* **Устанавливать точки останова.** Останавливает программу в нужном месте для анализа.\n\n* **Отслеживать стеки вызовов.** Показывает, как именно был достигнут конкретный участок кода.\n\nБольшинству языков достаточно установить профильное расширение — VS Code становится комфортной средой для отладки.\n\n## Горячие клавиши в Visual Studio Code\n\nРедактор содержит десятки удобных сочетаний клавиш, которые значительно ускоряют работу. Многие опытные разработчики работают почти без мыши, переключаясь между файлами, функциями, вкладками с помощью клавиатуры.\n\nТаблица горячих клавиш из исходного текста полностью корректна, может быть использована в готовом виде.\n\n## Установка расширений (плагинов)\n\nРасширения — особенность **Visual Studio Code**. Именно они превращают его из лёгкого редактора в мощную, гибкую платформу разработки.\n\n\n\nЧтобы установить расширение, достаточно:\n\n1. Открыть панель расширений (<kbd>Ctrl+Shift+X</kbd>).\n\n2. Найти нужный плагин через поиск.\n\n3. Нажать **Install**.\n\n4. Управлять параметрами через меню **Manage**.\n\nНа странице каждого расширения доступна подробная информация:\n\n* **описание,** область применения;\n\n* **количество установок** — показатель доверия сообщества;\n\n* **рейтинг** на основе отзывов;\n\n* **история изменений**;\n\n* **зависимости от других плагинов**;\n\n* **список возможностей, команд**;\n\n* **поддерживаемые горячие клавиши**.\n\nКаталог расширений содержит плагины для всех популярных языков, инструментов, фреймворков. Есть небольшие дополнения — например, панели, темизации, визуальные улучшения.\n\n## Преимущества Visual Studio Code\n\nVS Code стал популярным благодаря сочетанию преимуществ, которые сделали его универсальным инструментом для разработчиков разного уровня и специализации.\n\n### Простота освоения\n\nРедактор обладает интуитивно понятным интерфейсом и логичной навигацией, поэтому даже новичок может быстро начать работать в нём. Большое количество обучающих материалов, подсказок, встроенных функций облегчает первые шаги в программировании.\n\n### Малый вес\n\nПо сравнению с IDE, **Visual Studio Code** потребляет значительно меньше ресурсов, запускается заметно быстрее. Он остается легким даже при установке нескольких расширений, из-за чего комфортно работает на большинстве устройств.\n\n### Кроссплатформенность\n\nРедактор доступен на Windows, Linux и macOS, что делает его удобным для разработчиков, работающих с разными операционными системами. Возможность синхронизации настроек между устройствами позволяет легко переносить рабочую среду.\n\n### Поддержка множества языков\n\nVS Code подходит тем, кто работает в мультистековой среде: редактор поддерживает десятки языков из коробки, а остальные подключаются через расширения. Это делает его особенно удобным для разработчиков, которые совмещают несколько технологий в рамках одного проекта.\n\n### Гибкость\n\nБлагодаря огромной экосистеме расширений VS Code можно адаптировать практически под любую задачу — от простой верстки до работы с контейнерами, базами данных, облачными сервисами. Настройки, темы, плагины, профили дают возможность создать полностью персонализированную рабочую среду.\n\n## Недостатки Visual Studio Code\n\nНесмотря на впечатляющий набор возможностей и огромное количество преимуществ, важно понимать, что VS Code остаётся именно редактором кода, а не полноценной интегрированной средой разработки. Его философия — легкость, гибкость и минимализм, поэтому некоторые задачи, характерные для крупных IDE, здесь реализуются через расширения или требуют дополнительной настройки.\n\n### Ограниченная функциональность\n\nСуществуют языки и технологии, для которых необходима глубокая интеграция с инструментами компиляции, профилирования или анализа производительности — например, Java, C++ или некоторые промышленные фреймворки. В таких случаях IDE предоставляют расширенные возможности, которые **Visual Studio Code** восполняет только частично. Для сложных корпоративных проектов редактор может оказаться недостаточно мощным.\n\n### Производительность на слабых ПК\n\nVS Code работает на движке Electron, который по сути представляет собой легкий браузер. Это дает кроссплатформенность, но требует ресурсов. На компьютерах с устаревшими процессорами, медленными HDD-дисками или небольшим количеством оперативной памяти редактор может запускаться дольше, иногда подвисать, работать менее плавно. Особенно заметны проблемы при открытии больших проектов.\n\n### Зависимость от расширений\n\nБазовая версия VS Code минималистична. Чтобы превратить редактор в рабочий инструмент, приходится устанавливать десятки расширений: для языков, форматирования, дебага, работы с контейнерами и так далее. Это гибко и удобно, но чрезмерное количество плагинов может повлиять на скорость работы, вызвать конфликты или потребовать регулярного обновления, контроля совместимости.\n\nVisual Studio Code — это гибкий, мощный и бесплатный инструмент, который подходит для большинства разработчиков. Его простота сочетается с огромными возможностями, а установка дополнительных расширений превращает его в среду разработки для любого проекта. VS Code продолжает активно развиваться, поддерживается Microsoft и огромным комьюнити, что делает его одним из перспективных редакторов на рынке.\n","votes_up_count":1,"votes_down_count":0,"created_at":"2025-12-15T18:12:00.596Z","user_id":104929,"category_slug":"glossary"},{"user":{"id":647057,"email":"redkinaelena10.02.89@yandex.ru","first_name":"Елена","last_name":"Редькина","telegram":"89670235676","full_name":"Елена Редькина","removed":false},"question":{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3771,"answers_count":2,"slug":"chto-takoe-visual-studio-code","state":"published","title":"Visual Studio Code","created_at":"2023-06-05T10:02:24.977Z","details":null,"best_answer_id":5349,"related_stacks_count":5},"id":3122,"state":"active","body":"Visual Studio Code - это бесплатный редактор исходного кода, разработанный Microsoft для Windows, Linux и macOS. Он включает в себя множество функций, таких как поддержка различных языков программирования, отладка, рефакторинг и интеграция с системами контроля версий.","votes_up_count":0,"votes_down_count":0,"created_at":"2023-11-16T14:47:23.335Z","user_id":647057,"category_slug":"glossary"}],"relatedQuestions":[{"creator":{"id":583099,"email":"shade.mailbox@gmail.com","first_name":"Arthur","last_name":"Cheremisin","telegram":"","full_name":"Arthur Cheremisin","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[{"id":1095,"slug":"data-analitika","name":"data-аналитика"},{"id":1096,"slug":"analitika","name":"Аналитика"}],"id":2709,"answers_count":2,"slug":"chto-takoe-pandas","state":"published","title":"Pandas","created_at":"2023-03-29T12:39:32.428Z","details":"","best_answer_id":5306,"related_stacks_count":5},{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3577,"answers_count":1,"slug":"chto-takoe-1c-buhgalteriya","state":"published","title":"1C:Бухгалтерия","created_at":"2023-06-05T10:02:18.923Z","details":null,"best_answer_id":3315,"related_stacks_count":0},{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3578,"answers_count":1,"slug":"chto-takoe-1c-predpriyatie","state":"published","title":"1C:Предприятие","created_at":"2023-06-05T10:02:18.960Z","details":null,"best_answer_id":3314,"related_stacks_count":5},{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3579,"answers_count":1,"slug":"chto-takoe-a-b-testirovanie","state":"published","title":"A/B-тестирование","created_at":"2023-06-05T10:02:18.988Z","details":null,"best_answer_id":3313,"related_stacks_count":5},{"creator":{"id":104929,"email":"feycot@gmail.com","first_name":"Nikolai","last_name":"Gagarinov","telegram":"","full_name":"Nikolai Gagarinov","removed":false},"category":{"id":15,"title":"Глоссарий","slug":"glossary","questions_count":382,"locale":"ru"},"tags":[],"id":3580,"answers_count":1,"slug":"chto-takoe-agile","state":"published","title":"Agile","created_at":"2023-06-05T10:02:19.016Z","details":null,"best_answer_id":3312,"related_stacks_count":5}],"relatedLandings":[{"stack":{"id":46,"slug":"local-environment-automation","title":"Автоматизация локального окружения","audience":"for_programmers","start_type":"anytime","pricing_model":"subscription","priority":"medium","kind":"track","state":"published","stack_state":"finished","order":1800,"duration_in_months":1},"id":80,"slug":"local-environment-automation","title":"Автоматизация локального окружения","subtitle":"Навык настраивать локальное окружение с помощью специализированных инструментов для удобной и эффективной разработки","subtitle_for_lists":"Освоите настройку окружения с dev-инструментами","locale":"ru","current":true,"duration_in_months_text":"1 месяц","stack_slug":"local-environment-automation","price_text":"от 3 900 ₽","duration_text":"1 месяц","cover_list_variant":"https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Mzk3MSwicHVyIjoiYmxvYl9pZCJ9fQ==--126b25f39a57b0fdbd31895236a8d1da05b80ac4/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Server-amico.png"},{"stack":{"id":12,"slug":"frontend","title":"Фронтенд-разработчик","audience":"for_beginners","start_type":"weekly","pricing_model":"purchase","priority":"high","kind":"profession","state":"published","stack_state":"finished","order":20,"duration_in_months":10},"id":17,"slug":"frontend","title":"Фронтенд-разработчик","subtitle":"Изучите HTML, CSS, JavaScript и React","subtitle_for_lists":"Изучите HTML, CSS, JavaScript и React","locale":"ru","current":true,"duration_in_months_text":"10 месяцев","stack_slug":"frontend","price_text":"от 6 792 ₽","duration_text":"10 месяцев","cover_list_variant":"https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzcyNywicHVyIjoiYmxvYl9pZCJ9fQ==--2d5cbbf5c3b4a73ae4b2c50632305d78f5872e4d/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Programmer-rafiki.png"},{"stack":{"id":19,"slug":"layout-designer","title":"Профессиональная верстка","audience":"for_beginners","start_type":"anytime","pricing_model":"purchase","priority":"medium","kind":"track","state":"published","stack_state":"finished","order":1700,"duration_in_months":5},"id":26,"slug":"professional-layout","title":"Профессиональная верстка","subtitle":"Навык адаптивной вёрстки с современными подходами для корректного отображения сайтов на любых устройствах и разрешениях","subtitle_for_lists":"Адаптивная вёрстка для отображения на любых устройствах ","locale":"ru","current":true,"duration_in_months_text":"5 месяцев","stack_slug":"layout-designer","price_text":"от 3 900 ₽","duration_text":"5 месяцев","cover_list_variant":"https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6NDAzNCwicHVyIjoiYmxvYl9pZCJ9fQ==--ba516ea9573bdfcd1d21e2aa0fff8818561828f2/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Typing-bro.png"},{"stack":{"id":131,"slug":"flask","title":"Веб разработка на Python","audience":"for_beginners","start_type":"anytime","pricing_model":"subscription","priority":"medium","kind":"track","state":"published","stack_state":"finished","order":1050,"duration_in_months":1},"id":222,"slug":"flask","title":"Веб-разработка на Python","subtitle":"Навык создания веб-приложений на Flask для разработки лёгких и гибких серверных решений","subtitle_for_lists":"Навык создания веб-приложений на Flask","locale":"ru","current":true,"duration_in_months_text":"1 месяц","stack_slug":"flask","price_text":"от 3 900 ₽","duration_text":"1 месяц","cover_list_variant":"https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY3NywicHVyIjoiYmxvYl9pZCJ9fQ==--745022c2f47ba4203dd11cd8922cd55d5bebfdca/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Code%20typing-rafiki.png"},{"stack":{"id":118,"slug":"web-development-free","title":"Основы веб-разработки","audience":"for_beginners","start_type":"anytime","pricing_model":"free","priority":"low","kind":"track","state":"published","stack_state":"finished","order":1000,"duration_in_months":1},"id":194,"slug":"web-development-free","title":"Основы веб-разработки","subtitle":"Изучите основы HTML, CSS и базовый JavaScript","subtitle_for_lists":null,"locale":"ru","current":true,"duration_in_months_text":"1 месяц","stack_slug":"web-development-free","price_text":"Бесплатно","duration_text":"1 месяц","cover_list_variant":"https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY4NywicHVyIjoiYmxvYl9pZCJ9fQ==--8b6c104f41f902085a7d6e50ea73457f84a3ac33/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Coding-amico.png"}]},"url":"/qna/glossary/questions/chto-takoe-visual-studio-code","version":"143505ecd123087a8fdfa4acb7147980e9d23d76","encryptHistory":false,"clearHistory":false}"><style data-mantine-styles="true">:root, :host{--mantine-font-family: Arial, sans-serif;--mantine-font-family-headings: Arial, sans-serif;--mantine-heading-font-weight: normal;--mantine-radius-default: 0rem;--mantine-primary-color-filled: var(--mantine-color-indigo-filled);--mantine-primary-color-filled-hover: var(--mantine-color-indigo-filled-hover);--mantine-primary-color-light: var(--mantine-color-indigo-light);--mantine-primary-color-light-hover: var(--mantine-color-indigo-light-hover);--mantine-primary-color-light-color: var(--mantine-color-indigo-light-color);--mantine-spacing-xxl: calc(4rem * var(--mantine-scale));--mantine-font-size-xs: 12px;--mantine-font-size-sm: 14px;--mantine-font-size-md: 16px;--mantine-font-size-lg: clamp(16.0000px, calc(15.2727px + 0.2273vw), 18.0000px);--mantine-font-size-xl: clamp(16.0000px, calc(14.5455px + 0.4545vw), 20.0000px);--mantine-font-size-display-3: clamp(32.0000px, calc(26.1818px + 1.8182vw), 48.0000px);--mantine-font-size-display-2: clamp(36.0000px, calc(25.8182px + 3.1818vw), 64.0000px);--mantine-font-size-display-1: clamp(40.0000px, calc(25.4545px + 4.5455vw), 80.0000px);--mantine-font-size-h1: clamp(28.0000px, calc(23.6364px + 1.3636vw), 40.0000px);--mantine-font-size-h2: clamp(24.0000px, calc(21.0909px + 0.9091vw), 32.0000px);--mantine-font-size-h3: clamp(20.0000px, calc(17.0909px + 0.9091vw), 28.0000px);--mantine-font-size-h4: clamp(16.0000px, calc(13.0909px + 0.9091vw), 24.0000px);--mantine-font-size-h5: clamp(16.0000px, calc(14.5455px + 0.4545vw), 20.0000px);--mantine-font-size-h6: 1rem;--mantine-primary-color-0: var(--mantine-color-indigo-0);--mantine-primary-color-1: var(--mantine-color-indigo-1);--mantine-primary-color-2: var(--mantine-color-indigo-2);--mantine-primary-color-3: var(--mantine-color-indigo-3);--mantine-primary-color-4: var(--mantine-color-indigo-4);--mantine-primary-color-5: var(--mantine-color-indigo-5);--mantine-primary-color-6: var(--mantine-color-indigo-6);--mantine-primary-color-7: var(--mantine-color-indigo-7);--mantine-primary-color-8: var(--mantine-color-indigo-8);--mantine-primary-color-9: var(--mantine-color-indigo-9);--mantine-color-red-0: #ffeaea;--mantine-color-red-1: #fed4d4;--mantine-color-red-2: #f4a7a8;--mantine-color-red-3: #ec7878;--mantine-color-red-4: #e55050;--mantine-color-red-5: #e03131;--mantine-color-red-6: #e02829;--mantine-color-red-7: #c71a1c;--mantine-color-red-8: #b21218;--mantine-color-red-9: #9c0411;--mantine-color-violet-0: #fce9ff;--mantine-color-violet-1: #f1cfff;--mantine-color-violet-2: #e09bff;--mantine-color-violet-3: #d16fff;--mantine-color-violet-4: #be37fe;--mantine-color-violet-5: #b51afe;--mantine-color-violet-6: #b009ff;--mantine-color-violet-7: #9b00e4;--mantine-color-violet-8: #8a00cc;--mantine-color-violet-9: #7800b3;--mantine-color-indigo-0: #edecff;--mantine-color-indigo-1: #d6d5fe;--mantine-color-indigo-2: #aaa9f4;--mantine-color-indigo-3: #7b79eb;--mantine-color-indigo-4: #5451e4;--mantine-color-indigo-5: #3b37e0;--mantine-color-indigo-6: #2d2adf;--mantine-color-indigo-7: #1f1ec7;--mantine-color-indigo-8: #1819b2;--mantine-color-indigo-9: #0c149e;--mantine-color-cyan-0: #dffdff;--mantine-color-cyan-1: #caf5ff;--mantine-color-cyan-2: #99e8ff;--mantine-color-cyan-3: #64daff;--mantine-color-cyan-4: #3ccffe;--mantine-color-cyan-5: #24c8fe;--mantine-color-cyan-6: #00c2ff;--mantine-color-cyan-7: #00ade4;--mantine-color-cyan-8: #009acd;--mantine-color-cyan-9: #0085b5;--mantine-color-green-0: #e9fdec;--mantine-color-green-1: #d7f6dc;--mantine-color-green-2: #b0eab9;--mantine-color-green-3: #86df94;--mantine-color-green-4: #62d574;--mantine-color-green-5: #4ccf5f;--mantine-color-green-6: #3fcc54;--mantine-color-green-7: #2fb344;--mantine-color-green-8: #25a03b;--mantine-color-green-9: #138a2e;--mantine-color-yellow-0: #fff7e2;--mantine-color-yellow-1: #ffeecd;--mantine-color-yellow-2: #ffdc9c;--mantine-color-yellow-3: #ffc966;--mantine-color-yellow-4: #feb93a;--mantine-color-yellow-5: #feae1e;--mantine-color-yellow-6: #ffa90f;--mantine-color-yellow-8: #ca8200;--mantine-color-yellow-9: #af7000;--mantine-h1-font-size: clamp(28.0000px, calc(23.6364px + 1.3636vw), 40.0000px);--mantine-h1-font-weight: normal;--mantine-h2-font-size: clamp(24.0000px, calc(21.0909px + 0.9091vw), 32.0000px);--mantine-h2-font-weight: normal;--mantine-h3-font-size: clamp(20.0000px, calc(17.0909px + 0.9091vw), 28.0000px);--mantine-h3-font-weight: normal;--mantine-h4-font-size: clamp(16.0000px, calc(13.0909px + 0.9091vw), 24.0000px);--mantine-h4-font-weight: normal;--mantine-h5-font-size: clamp(16.0000px, calc(14.5455px + 0.4545vw), 20.0000px);--mantine-h5-font-weight: normal;--mantine-h6-font-size: 1rem;--mantine-h6-font-weight: normal;}
:root[data-mantine-color-scheme="dark"], :host([data-mantine-color-scheme="dark"]){--mantine-color-anchor: var(--mantine-color-text);--mantine-color-dimmed: #495057;--mantine-color-dark-filled: var(--mantine-color-dark-5);--mantine-color-dark-filled-hover: var(--mantine-color-dark-6);--mantine-color-dark-light: rgba(105, 105, 105, 0.15);--mantine-color-dark-light-hover: rgba(105, 105, 105, 0.2);--mantine-color-dark-light-color: var(--mantine-color-dark-0);--mantine-color-dark-outline: var(--mantine-color-dark-1);--mantine-color-dark-outline-hover: rgba(184, 184, 184, 0.05);--mantine-color-gray-filled: var(--mantine-color-gray-5);--mantine-color-gray-filled-hover: var(--mantine-color-gray-6);--mantine-color-gray-light: rgba(222, 226, 230, 0.15);--mantine-color-gray-light-hover: rgba(222, 226, 230, 0.2);--mantine-color-gray-light-color: var(--mantine-color-gray-0);--mantine-color-gray-outline: var(--mantine-color-gray-1);--mantine-color-gray-outline-hover: rgba(241, 243, 245, 0.05);--mantine-color-red-filled: var(--mantine-color-red-5);--mantine-color-red-filled-hover: var(--mantine-color-red-6);--mantine-color-red-light: rgba(236, 120, 120, 0.15);--mantine-color-red-light-hover: rgba(236, 120, 120, 0.2);--mantine-color-red-light-color: var(--mantine-color-red-0);--mantine-color-red-outline: var(--mantine-color-red-1);--mantine-color-red-outline-hover: rgba(254, 212, 212, 0.05);--mantine-color-pink-filled: var(--mantine-color-pink-5);--mantine-color-pink-filled-hover: var(--mantine-color-pink-6);--mantine-color-pink-light: rgba(250, 162, 193, 0.15);--mantine-color-pink-light-hover: rgba(250, 162, 193, 0.2);--mantine-color-pink-light-color: var(--mantine-color-pink-0);--mantine-color-pink-outline: var(--mantine-color-pink-1);--mantine-color-pink-outline-hover: rgba(255, 222, 235, 0.05);--mantine-color-grape-filled: var(--mantine-color-grape-5);--mantine-color-grape-filled-hover: var(--mantine-color-grape-6);--mantine-color-grape-light: rgba(229, 153, 247, 0.15);--mantine-color-grape-light-hover: rgba(229, 153, 247, 0.2);--mantine-color-grape-light-color: var(--mantine-color-grape-0);--mantine-color-grape-outline: var(--mantine-color-grape-1);--mantine-color-grape-outline-hover: rgba(243, 217, 250, 0.05);--mantine-color-violet-filled: var(--mantine-color-violet-5);--mantine-color-violet-filled-hover: var(--mantine-color-violet-6);--mantine-color-violet-light: rgba(209, 111, 255, 0.15);--mantine-color-violet-light-hover: rgba(209, 111, 255, 0.2);--mantine-color-violet-light-color: var(--mantine-color-violet-0);--mantine-color-violet-outline: var(--mantine-color-violet-1);--mantine-color-violet-outline-hover: rgba(241, 207, 255, 0.05);--mantine-color-indigo-filled: var(--mantine-color-indigo-5);--mantine-color-indigo-filled-hover: var(--mantine-color-indigo-6);--mantine-color-indigo-light: rgba(123, 121, 235, 0.15);--mantine-color-indigo-light-hover: rgba(123, 121, 235, 0.2);--mantine-color-indigo-light-color: var(--mantine-color-indigo-0);--mantine-color-indigo-outline: var(--mantine-color-indigo-1);--mantine-color-indigo-outline-hover: rgba(214, 213, 254, 0.05);--mantine-color-blue-filled: var(--mantine-color-blue-5);--mantine-color-blue-filled-hover: var(--mantine-color-blue-6);--mantine-color-blue-light: rgba(116, 192, 252, 0.15);--mantine-color-blue-light-hover: rgba(116, 192, 252, 0.2);--mantine-color-blue-light-color: var(--mantine-color-blue-0);--mantine-color-blue-outline: var(--mantine-color-blue-1);--mantine-color-blue-outline-hover: rgba(208, 235, 255, 0.05);--mantine-color-cyan-filled: var(--mantine-color-cyan-5);--mantine-color-cyan-filled-hover: var(--mantine-color-cyan-6);--mantine-color-cyan-light: rgba(100, 218, 255, 0.15);--mantine-color-cyan-light-hover: rgba(100, 218, 255, 0.2);--mantine-color-cyan-light-color: var(--mantine-color-cyan-0);--mantine-color-cyan-outline: var(--mantine-color-cyan-1);--mantine-color-cyan-outline-hover: rgba(202, 245, 255, 0.05);--mantine-color-teal-filled: var(--mantine-color-teal-5);--mantine-color-teal-filled-hover: var(--mantine-color-teal-6);--mantine-color-teal-light: rgba(99, 230, 190, 0.15);--mantine-color-teal-light-hover: rgba(99, 230, 190, 0.2);--mantine-color-teal-light-color: var(--mantine-color-teal-0);--mantine-color-teal-outline: var(--mantine-color-teal-1);--mantine-color-teal-outline-hover: rgba(195, 250, 232, 0.05);--mantine-color-green-filled: var(--mantine-color-green-5);--mantine-color-green-filled-hover: var(--mantine-color-green-6);--mantine-color-green-light: rgba(134, 223, 148, 0.15);--mantine-color-green-light-hover: rgba(134, 223, 148, 0.2);--mantine-color-green-light-color: var(--mantine-color-green-0);--mantine-color-green-outline: var(--mantine-color-green-1);--mantine-color-green-outline-hover: rgba(215, 246, 220, 0.05);--mantine-color-lime-filled: var(--mantine-color-lime-5);--mantine-color-lime-filled-hover: var(--mantine-color-lime-6);--mantine-color-lime-light: rgba(192, 235, 117, 0.15);--mantine-color-lime-light-hover: rgba(192, 235, 117, 0.2);--mantine-color-lime-light-color: var(--mantine-color-lime-0);--mantine-color-lime-outline: var(--mantine-color-lime-1);--mantine-color-lime-outline-hover: rgba(233, 250, 200, 0.05);--mantine-color-yellow-filled: var(--mantine-color-yellow-5);--mantine-color-yellow-filled-hover: var(--mantine-color-yellow-6);--mantine-color-yellow-light: rgba(255, 201, 102, 0.15);--mantine-color-yellow-light-hover: rgba(255, 201, 102, 0.2);--mantine-color-yellow-light-color: var(--mantine-color-yellow-0);--mantine-color-yellow-outline: var(--mantine-color-yellow-1);--mantine-color-yellow-outline-hover: rgba(255, 238, 205, 0.05);--mantine-color-orange-filled: var(--mantine-color-orange-5);--mantine-color-orange-filled-hover: var(--mantine-color-orange-6);--mantine-color-orange-light: rgba(255, 192, 120, 0.15);--mantine-color-orange-light-hover: rgba(255, 192, 120, 0.2);--mantine-color-orange-light-color: var(--mantine-color-orange-0);--mantine-color-orange-outline: var(--mantine-color-orange-1);--mantine-color-orange-outline-hover: rgba(255, 232, 204, 0.05);--app-cta-gradient: linear-gradient(90deg, var(--mantine-color-blue-9) 0%, var(--mantine-color-cyan-7) 100%);--app-color-surface: #2e2e2e;}
:root[data-mantine-color-scheme="light"], :host([data-mantine-color-scheme="light"]){--mantine-color-anchor: var(--mantine-color-text);--mantine-color-dimmed: #495057;--mantine-color-red-light: rgba(224, 40, 41, 0.1);--mantine-color-red-light-hover: rgba(224, 40, 41, 0.12);--mantine-color-red-outline-hover: rgba(224, 40, 41, 0.05);--mantine-color-violet-light: rgba(176, 9, 255, 0.1);--mantine-color-violet-light-hover: rgba(176, 9, 255, 0.12);--mantine-color-violet-outline-hover: rgba(176, 9, 255, 0.05);--mantine-color-indigo-light: rgba(45, 42, 223, 0.1);--mantine-color-indigo-light-hover: rgba(45, 42, 223, 0.12);--mantine-color-indigo-outline-hover: rgba(45, 42, 223, 0.05);--mantine-color-cyan-light: rgba(0, 194, 255, 0.1);--mantine-color-cyan-light-hover: rgba(0, 194, 255, 0.12);--mantine-color-cyan-outline-hover: rgba(0, 194, 255, 0.05);--mantine-color-green-light: rgba(63, 204, 84, 0.1);--mantine-color-green-light-hover: rgba(63, 204, 84, 0.12);--mantine-color-green-outline-hover: rgba(63, 204, 84, 0.05);--mantine-color-yellow-light: rgba(255, 169, 15, 0.1);--mantine-color-yellow-light-hover: rgba(255, 169, 15, 0.12);--mantine-color-yellow-outline-hover: rgba(255, 169, 15, 0.05);--app-color-surface: #f1f3f5;--app-cta-gradient: linear-gradient(90deg, var(--mantine-color-blue-filled) 0%, var(--mantine-color-cyan-5) 100%);}</style><style data-mantine-styles="classes">@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}</style><script type="application/ld+json">{"@context":"https://schema.org","@type":"QAPage","mainEntity":{"@type":"Question","name":"Visual Studio Code","answerCount":2,"datePublished":"2023-06-05T10:02:24.977Z","author":{"@type":"Person","name":"Nikolai Gagarinov"},"acceptedAnswer":{"@type":"Answer","text":"Visual Studio Code — это один из популярных редакторов кода современности, который используют разработчики самых разных направлений. Он сочетает высокую скорость, простоту, гибкость и набор функций, характерный для профессиональных инструментов разработки. Это не тяжёлая IDE, а лёгкий, расширяемый редактор, который вмещает огромный потенциал благодаря системе дополнений. VS Code доступен на всех популярных операционных системах, бесплатен, может быть настроен практически под любой стек технологий.\n\n\n\n## Что такое Visual Studio Code и чем он отличается от Visual Studio\n\nНесмотря на схожие названия, **Visual Studio Code** и **Visual Studio** — два разных инструмента. Visual Studio — это полноценная IDE с большим количеством встроенных компонентов, предназначенная для разработки крупномасштабных проектов. Она мощная, но тяжёлая, ресурсоемкая, требует глубокого понимания экосистемы.\n\nVS Code, наоборот, представляет собой легковесный редактор кода, который запускается быстрее, потребляет меньше ресурсов и подходит даже тем, кто только начинает изучать программирование. Он не перегружен инструментами, но при необходимости их можно добавить через расширения.\n\n## Кому подходит Visual Studio Code\n\nЭто универсальный инструмент. Им активно пользуются:\n\n* **Веб-разработчики, работающие с HTML, CSS, JavaScript, PHP. Visual Studio Code** предоставляет удобные инструменты для верстки, подсветку синтаксиса, автоматическую проверку кода, интеграцию с популярными фронтенд-фреймворками. Это делает его привлекательным для тех, кто создает сайты и веб-приложения с нуля.\n\n* **Фронтенд-инженеры, использующие React, Vue, Angular.** Благодаря расширениям для JSX, TypeScript, Vue, Angular разработчики получают полноценную среду с автодополнением, навигацией по компонентам, поддержкой сниппетов, инструментами для сборки.\n\n* **Бекенд-разработчики, пишущие на Python, Node.js, Go, Rust, Ruby, PHP.** Для этих языков доступны мощные плагины, предоставляющие дебаггер, анализ кода, форматирование, виртуальные окружения, интеграцию с серверами. VS Code легко превращается в комфортную среду для работы с любой серверной логикой.\n\n* **Инженеры C#, которым не требуется полный функционал Visual Studio.** Благодаря расширению OmniSharp VS Code обеспечивает поддержку C# и .NET, что делает редактор удобным выбором для тех, кому не нужна тяжелая IDE, но важны инструменты рефакторинга, отладки.\n\n* **Разработчики мобильных приложений, работающие с Flutter и React Native.** Плагины Flutter, React Native позволяют запускать, отлаживать приложения и работать с симуляторами прямо из редактора, а также получать подсказки по виджетам, структуре проекта.\n\n* **DevOps-специалисты, благодаря поддержке Docker, Kubernetes, терминала.** Редактор обеспечивает удобную работу с Dockerfile, YAML-конфигурациями, helm-чартами и CI/CD-сценариями. Встроенный терминал делает его отличным инструментом для автоматизации, инфраструктурных задач.\n\n* **Студенты, начинающие разработчики, которым нужен лёгкий, понятный редактор.** Интерфейс VS Code интуитивен, а огромное количество обучающих материалов помогает новичкам быстро освоиться. Он не перегружен функциями, но позволяет постепенно расширять возможности за счет дополнений.\n\nVS Code охватывает практически любой язык программирования за счёт огромного количества плагинов. Именно поэтому его так любят в IT-сообществе — редактор подстраивается под задачу, а не наоборот.\n\n## Для чего нужен Visual Studio Code\n\nГлавная задача — обеспечить разработчику удобную и эффективную среду для написания, редактирования, форматирования кода. Это универсальный инструмент, который значительно упрощает работу как над небольшими скриптами, так и над полноценными проектами любой сложности. Благодаря встроенным возможностям, поддержке расширений редактор помогает:\n\n* **Создавать структуры проектов.** VS Code позволяет формировать базовые папки, файлы и конфигурации, облегчая организацию кода, структуру будущего приложения.\n\n* **Подсвечивать синтаксис.** Редактор автоматически определяет язык и выделяет ключевые элементы кода, обеспечивая удобное чтение, предотвращая визуальные ошибки.\n\n* **Автоматически исправлять мелкие ошибки.** Благодаря линтерам и форматтерам VS Code сам предлагает корректировки для типичных опечаток, неправильных отступов, несоответствий стилю.\n\n* **Запускать, отлаживать проекты.** Инструменты отладки позволяют пошагово выполнять код, анализировать переменные, моментально находить проблемные места.\n\n* **Работать с терминалом.** Встроенный терминал избавляет от нужды переключаться между окнами, позволяет запускать команды прямо в редакторе.\n\n* **Контролировать версии через Git.** VS Code предоставляет удобный визуальный интерфейс для коммитов, ветвления, слияния, просмотра изменений.\n\n* **Быстро перемещаться по проекту.** Умный поиск, переход к определениям и глобальная навигация помогают легко ориентироваться даже в больших проектах.\n\n* **Конфигурировать рабочее пространство под разные цели.** Редактор полностью настраивается — от тем оформления до поведения инструментов, что позволяет адаптировать VS Code под стиль, потребности конкретного разработчика.\n\nVS Code поддерживает полноценную отладку, интеллектуальное автодополнение (IntelliSense), навигацию по функциям, многое другое. Вместо того чтобы искать нужные инструменты по отдельности, разработчик получает всё в одном приложении.\n\n## Где скачать и как установить\n\n\n\n### Скачивание программы\n\nVisual Studio Code доступен бесплатно. Скачать его можно напрямую с официального сайта Microsoft. На главной странице пользователь увидит большую кнопку быстрой загрузки — редактор автоматически определит операционную систему, предложит установочный файл. Это делает процесс простым, исключает ошибки при выборе версии.\n\nПомимо стандартной версии, для удобства доступны варианты установки под разные платформы:\n\n* **Windows** — включая портативную сборку, которую можно запускать без установки;\n\n* **Linux** — представлены пакеты в форматах **.deb**, **.rpm**, а также архив **tar.gz** для универсальной установки;\n\n* **macOS** — доступны версии как для процессоров **Intel**, так и для **Apple Silicon**.\n\nЕсли хотите лишь ознакомиться с возможностями редактора, но не готовы устанавливать его на компьютер, можно воспользоваться онлайн-версией, работающей прямо в браузере. Она подходит для тестирования и небольших задач, хотя, конечно, не способна полностью заменить приложение.\n\n### Установка программы\n\nПосле загрузки файла остаётся только запустить инсталлятор и по очереди выполнить шаги мастера установки. Процесс простой — всего несколько кликов, и редактор будет установлен.\n\nНовичкам лучше оставить настройки по умолчанию. В дальнейшем, когда появится опыт работы, можно подключить дополнительные параметры:\n\n* интеграцию в контекстное меню;\n\n* добавление **Visual Studio Code** в `PATH`;\n\n* создание удобных ярлыков запуска.\n\n### Запуск на слабых компьютерах\n\nИногда на старых ПК или системах с недостаточными ресурсами VS Code может запускаться медленно, зависать или показывать чёрный экран. Это связано с тем, что редактор построен на Electron — платформе, напоминающей по работе браузер, и потому требовательной к графике, оперативной памяти.\n\nОднако существует решение:\n\n1. Откройте свойства ярлыка VS Code.\n\n2. В конце строки с путем к приложению добавьте флаг:\n\n```bash\n--disable-gpu\n```\n\nЭтот параметр отключает аппаратное ускорение и позволяет запустить редактор даже на слабых устройствах, снижая нагрузку на видеокарту, процессор.\n\n## Как установить русский язык в Visual Studio Code\n\nЧтобы изменить язык интерфейса:\n\n1. Откройте панель расширений (<kbd>Ctrl+Shift+X</kbd>).\n\n2. Введите в поиске *Russian Language Pack*.\n\n3. Установите пакет, перезапустите VS Code.\n\nПосле перезапуска интерфейс станет русскоязычным. Однако опытные разработчики часто предпочитают английскую версию, поскольку большинство статей, документаций, обсуждений в сети — англоязычные.\n\n## Интерфейс\n\nVisual Studio Code основан на Electron, а значит интерфейс собирается с помощью веб-технологий. Это делает его гибким и функциональным, но одновременно легким для освоения.\n\n### Основные элементы интерфейса:\n\n* **Рабочая область** — место, где открыт файл с кодом.\n\n* **Верхнее меню** — доступ к базовым функциям.\n\n* **Боковая панель** — структура проекта, Git, поиск, расширения, отладка.\n\n* **Терминал** — встроенная командная строка, которую можно открыть горячей клавишей <kbd>Ctrl+`</kbd> (тильда).\n\nVS Code поддерживает работу с несколькими файлами в разных вкладках, а также позволяет разделить экран на две или три части, как в полноценных IDE.\n\n## Настройка Visual Studio Code\n\nНастройки открываются сочетанием <kbd>Ctrl + ,</kbd> или через меню *File → Preferences → Settings*.\n\nЕсть два пути настройки:\n\n### 1. Графический интерфейс\n\nПодходит новичкам — все параметры разбиты по категориям.\n\n### 2. Ручное редактирование settings.json\n\nПодходит опытным пользователям — позволяет глубоко изменить поведение редактора.\n\n### Полезные параметры:\n\n* **Auto Save** — включает автоматическое сохранение.\n\n* **Font Size** — изменение размера шрифта.\n\n* **Format On Paste** — автоформатирование при вставке.\n\n* **Trim Trailing Whitespace** — удаление пробелов в конце строк.\n\nТакже можно быстро менять цветовую схему через командную палитру (<kbd>Ctrl+Shift+P</kbd> → Theme).\n\n## Возможности Visual Studio Code\n\n### Редактирование и написание кода\n\n**Visual Studio Code** предоставляет разработчику обширный набор инструментов, которые облегчают работу с кодом на любом языке. Редактор автоматически анализирует структуру файлов и предоставляет набор средств для комфортной разработки:\n\n* **Подсветка синтаксиса.** Цветовое выделение элементов кода делает его визуально понятным, позволяет быстрее замечать ошибки.\n\n* **Умное автодополнение.** IntelliSense предлагает варианты продолжения кода на основе контекста, структуры проекта, подключенных библиотек.\n\n* **Автоформатирование.** Редактор автоматически выравнивает отступы, расставляет пробелы, приводит код к единообразному стилю.\n\n* **Рефакторинг.** Поддерживаются быстрые операции: переименование переменных, перенос кода в функции, исправление импорта.\n\n* **Подсказки IntelliSense.** Всплывающие подсказки помогают быстрее ориентироваться в API, структуре проекта.\n\n* **Отображение ошибок в режиме реального времени. Visual Studio Code** подсвечивает проблемные участки, предлагает варианты исправления еще до запуска программы.\n\nБлагодаря такому набору возможностей редактор превращается в полноценную рабочую платформу, а не просто в инструмент для набора текста.\n\n## Автоматическое редактирование\n\n\n\nVS Code позволяет автоматизировать большое количество рутинных задач при помощи расширений вроде Prettier, ESLint. Эти инструменты:\n\n* **Исправляют отступы.** Приводят структуру кода к единообразному оформлению.\n\n* **Убирают лишние пробелы.** Автоматически очищают файл от ненужных символов при сохранении.\n\n* **Следят за стилем.** Применяют выбранный командой стиль написания кода, что особенно важно в больших проектах.\n\n* **Предотвращают синтаксические ошибки.** Линтеры сразу подсказывают, где нарушены правила или возможны логические проблемы.\n\nАвтоматизация упрощает работу команды, помогает поддерживать чистоту, читаемость проекта.\n\n## Поиск и вставка\n\nИнструменты поиска в VS Code позволяют быстро ориентироваться даже в крупных проектах. Встроенная система поддерживает:\n\n* **Обычный поиск по файлу.** Подходит для точечного поиска переменных, функций или фрагментов текста.\n\n* **Расширенный поиск по проекту.** Помогает находить нужные элементы во всех папках, файлах проекта одновременно.\n\n* **Регулярные выражения.** Позволяют выполнять сложные запросы и находить паттерны, соответствующие определенным правилам.\n\n* **Массовую замену текста.** Ускоряет редактирование, позволяя менять повторяющиеся конструкции всего за пару кликов.\n\nЭти инструменты существенно увеличивают скорость работы, минимизируют рутинные операции.\n\n## Контроль версий\n\n**Visual Studio Code** содержит встроенную, очень удобную интеграцию с Git. Прямо из редактора можно выполнять все основные действия:\n\n* **Просмотр изменений.** Показывает, что было удалено, добавлено или изменено.\n\n* **Создание коммитов.** Позволяет фиксировать изменения одним нажатием кнопки.\n\n* **Управление ветками.** Создание, переключение, удаление веток доступно через визуальный интерфейс.\n\n* **Визуальный дифф.** Открывает разницу между версиями файлов в удобном формате.\n\n* **Работа с удалёнными репозиториями.** Поддерживает GitHub, GitLab, Bitbucket, другие платформы.\n\n* **Интеграция с GitHub, GitLab.** Позволяет выполнять pull requests, другие операции прямо из редактора.\n\nБлагодаря этому **Visual Studio Code** помогает экономить время и избегать ошибок, связанных с ручным вводом команд.\n\n## Запуск и отладка кода\n\nВкладка **«Запуск и отладка»** делает VS Code полноценным инструментом для тестирования приложений:\n\n* **Просматривать состояние переменных.** Показывает текущие значения и помогает анализировать поведение программы.\n\n* **Выполнять код пошагово.** Позволяет отслеживать каждый этап выполнения.\n\n* **Устанавливать точки останова.** Останавливает программу в нужном месте для анализа.\n\n* **Отслеживать стеки вызовов.** Показывает, как именно был достигнут конкретный участок кода.\n\nБольшинству языков достаточно установить профильное расширение — VS Code становится комфортной средой для отладки.\n\n## Горячие клавиши в Visual Studio Code\n\nРедактор содержит десятки удобных сочетаний клавиш, которые значительно ускоряют работу. Многие опытные разработчики работают почти без мыши, переключаясь между файлами, функциями, вкладками с помощью клавиатуры.\n\nТаблица горячих клавиш из исходного текста полностью корректна, может быть использована в готовом виде.\n\n## Установка расширений (плагинов)\n\nРасширения — особенность **Visual Studio Code**. Именно они превращают его из лёгкого редактора в мощную, гибкую платформу разработки.\n\n\n\nЧтобы установить расширение, достаточно:\n\n1. Открыть панель расширений (<kbd>Ctrl+Shift+X</kbd>).\n\n2. Найти нужный плагин через поиск.\n\n3. Нажать **Install**.\n\n4. Управлять параметрами через меню **Manage**.\n\nНа странице каждого расширения доступна подробная информация:\n\n* **описание,** область применения;\n\n* **количество установок** — показатель доверия сообщества;\n\n* **рейтинг** на основе отзывов;\n\n* **история изменений**;\n\n* **зависимости от других плагинов**;\n\n* **список возможностей, команд**;\n\n* **поддерживаемые горячие клавиши**.\n\nКаталог расширений содержит плагины для всех популярных языков, инструментов, фреймворков. Есть небольшие дополнения — например, панели, темизации, визуальные улучшения.\n\n## Преимущества Visual Studio Code\n\nVS Code стал популярным благодаря сочетанию преимуществ, которые сделали его универсальным инструментом для разработчиков разного уровня и специализации.\n\n### Простота освоения\n\nРедактор обладает интуитивно понятным интерфейсом и логичной навигацией, поэтому даже новичок может быстро начать работать в нём. Большое количество обучающих материалов, подсказок, встроенных функций облегчает первые шаги в программировании.\n\n### Малый вес\n\nПо сравнению с IDE, **Visual Studio Code** потребляет значительно меньше ресурсов, запускается заметно быстрее. Он остается легким даже при установке нескольких расширений, из-за чего комфортно работает на большинстве устройств.\n\n### Кроссплатформенность\n\nРедактор доступен на Windows, Linux и macOS, что делает его удобным для разработчиков, работающих с разными операционными системами. Возможность синхронизации настроек между устройствами позволяет легко переносить рабочую среду.\n\n### Поддержка множества языков\n\nVS Code подходит тем, кто работает в мультистековой среде: редактор поддерживает десятки языков из коробки, а остальные подключаются через расширения. Это делает его особенно удобным для разработчиков, которые совмещают несколько технологий в рамках одного проекта.\n\n### Гибкость\n\nБлагодаря огромной экосистеме расширений VS Code можно адаптировать практически под любую задачу — от простой верстки до работы с контейнерами, базами данных, облачными сервисами. Настройки, темы, плагины, профили дают возможность создать полностью персонализированную рабочую среду.\n\n## Недостатки Visual Studio Code\n\nНесмотря на впечатляющий набор возможностей и огромное количество преимуществ, важно понимать, что VS Code остаётся именно редактором кода, а не полноценной интегрированной средой разработки. Его философия — легкость, гибкость и минимализм, поэтому некоторые задачи, характерные для крупных IDE, здесь реализуются через расширения или требуют дополнительной настройки.\n\n### Ограниченная функциональность\n\nСуществуют языки и технологии, для которых необходима глубокая интеграция с инструментами компиляции, профилирования или анализа производительности — например, Java, C++ или некоторые промышленные фреймворки. В таких случаях IDE предоставляют расширенные возможности, которые **Visual Studio Code** восполняет только частично. Для сложных корпоративных проектов редактор может оказаться недостаточно мощным.\n\n### Производительность на слабых ПК\n\nVS Code работает на движке Electron, который по сути представляет собой легкий браузер. Это дает кроссплатформенность, но требует ресурсов. На компьютерах с устаревшими процессорами, медленными HDD-дисками или небольшим количеством оперативной памяти редактор может запускаться дольше, иногда подвисать, работать менее плавно. Особенно заметны проблемы при открытии больших проектов.\n\n### Зависимость от расширений\n\nБазовая версия VS Code минималистична. Чтобы превратить редактор в рабочий инструмент, приходится устанавливать десятки расширений: для языков, форматирования, дебага, работы с контейнерами и так далее. Это гибко и удобно, но чрезмерное количество плагинов может повлиять на скорость работы, вызвать конфликты или потребовать регулярного обновления, контроля совместимости.\n\nVisual Studio Code — это гибкий, мощный и бесплатный инструмент, который подходит для большинства разработчиков. Его простота сочетается с огромными возможностями, а установка дополнительных расширений превращает его в среду разработки для любого проекта. VS Code продолжает активно развиваться, поддерживается Microsoft и огромным комьюнити, что делает его одним из перспективных редакторов на рынке.\n","datePublished":"2025-12-15T18:12:00.596Z","upvoteCount":1,"author":{"@type":"Person","name":"Nikolai Gagarinov"},"url":"https://ru.hexlet.io/qna/glossary/questions/chto-takoe-visual-studio-code#answer-5349"},"suggestedAnswer":[{"@type":"Answer","text":"Visual Studio Code - это бесплатный редактор исходного кода, разработанный Microsoft для Windows, Linux и macOS. Он включает в себя множество функций, таких как поддержка различных языков программирования, отладка, рефакторинг и интеграция с системами контроля версий.","datePublished":"2023-11-16T14:47:23.335Z","upvoteCount":0,"author":{"@type":"Person","name":"Елена Редькина"},"url":"https://ru.hexlet.io/qna/glossary/questions/chto-takoe-visual-studio-code#answer-3122"}]}}</script><div style="--container-size:var(--container-size-lg);margin-top:var(--mantine-spacing-xl);height:100%" class="m_7485cace mantine-Container-root" data-size="lg" data-strategy="block"><script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"position":1,"@type":"ListItem","item":{"@id":"/qna","name":"Вопросы и ответы"}},{"position":2,"@type":"ListItem","item":{"@id":"/qna/glossary/questions","name":"Глоссарий"}},{"position":3,"@type":"ListItem","item":{"@id":"/qna/glossary/questions/chto-takoe-visual-studio-code","name":"Visual Studio Code"}}]}</script><div style="margin-bottom:var(--mantine-spacing-xs)" class="m_8b3717df mantine-Breadcrumbs-root"><a style="--text-fz:var(--mantine-font-size-sm);--text-lh:var(--mantine-line-height-sm);white-space:normal;color:inherit" class="mantine-focus-auto m_849cf0da m_f678d540 mantine-Breadcrumbs-breadcrumb m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-size="sm" data-underline="hover" href="/"><div style="color:inherit" class="m_4451eb3a mantine-Center-root"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-home-link "><path d="M20.085 11.085l-8.085 -8.085l-9 9h2v7a2 2 0 0 0 2 2h4.5"></path><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 1.807 1.143"></path><path d="M20 21a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M20 16a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M15 19a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M21 16l-5 3l5 2"></path></svg></div></a><div class="m_3b8f2208 mantine-Breadcrumbs-separator">/</div><a style="--text-fz:var(--mantine-font-size-sm);--text-lh:var(--mantine-line-height-sm);white-space:normal;color:inherit" class="mantine-focus-auto m_849cf0da m_f678d540 mantine-Breadcrumbs-breadcrumb m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-size="sm" data-underline="hover" href="/qna">Вопросы и ответы</a><div class="m_3b8f2208 mantine-Breadcrumbs-separator">/</div><a style="--text-fz:var(--mantine-font-size-sm);--text-lh:var(--mantine-line-height-sm);white-space:normal;color:inherit" class="mantine-focus-auto m_849cf0da m_f678d540 mantine-Breadcrumbs-breadcrumb m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-size="sm" data-underline="hover" href="/qna/glossary/questions">Глоссарий</a><div class="m_3b8f2208 mantine-Breadcrumbs-separator">/</div><p style="--text-fz:var(--mantine-font-size-sm);--text-lh:var(--mantine-line-height-sm);white-space:normal;color:var(--mantine-color-dimmed)" class="mantine-focus-auto m_f678d540 mantine-Breadcrumbs-breadcrumb m_b6d8b162 mantine-Text-root" data-size="sm">Visual Studio Code</p></div><style data-mantine-styles="inline">.__m__-_R_eub_{margin-bottom:var(--mantine-spacing-xs);}@media(min-width: 36em){.__m__-_R_eub_{margin-bottom:var(--mantine-spacing-xs);}}</style><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:space-between;--group-wrap:wrap" class="m_4081bf90 mantine-Group-root __m__-_R_eub_"><style data-mantine-styles="inline">.__m__-_R_deub_{width:100%;}@media(min-width: 36em){.__m__-_R_deub_{width:70%;}}@media(min-width: 75em){.__m__-_R_deub_{width:75%;}}</style><div class="__m__-_R_deub_"><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><h1 style="--title-fw:var(--mantine-h1-font-weight);--title-lh:var(--mantine-h1-line-height);--title-fz:var(--mantine-h1-font-size)" class="m_8a5d1357 mantine-Title-root" data-order="1">Visual Studio Code</h1></div></div></div><style data-mantine-styles="inline">.__m__-_R_iub_{--grid-gutter:var(--mantine-spacing-md);}</style><div class="m_410352e9 mantine-Grid-root __m__-_R_iub_"><div class="m_dee7bd2f mantine-Grid-inner"><style data-mantine-styles="inline">.__m__-_R_3diub_{--col-flex-grow:auto;--col-flex-basis:100%;--col-max-width:100%;}@media(min-width: 48em){.__m__-_R_3diub_{--col-flex-grow:auto;--col-flex-basis:83.33333333333334%;--col-max-width:83.33333333333334%;}}@media(min-width: 62em){.__m__-_R_3diub_{--col-flex-grow:auto;--col-flex-basis:66.66666666666667%;--col-max-width:66.66666666666667%;}}</style><div class="m_96bdd299 mantine-Grid-col __m__-_R_3diub_"><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:flex-start;--group-wrap:wrap;margin-bottom:var(--mantine-spacing-lg)" class="m_4081bf90 mantine-Group-root"></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:flex-start;--group-wrap:wrap;margin-bottom:var(--mantine-spacing-xl);font-size:var(--mantine-font-size-sm)" class="m_4081bf90 mantine-Group-root"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:wrap;margin-inline-start:auto" class="m_4081bf90 mantine-Group-root"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar "><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M11 15h1"></path><path d="M12 15v3"></path></svg><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-inherit="true">3 года назад</p></div><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:wrap" class="m_4081bf90 mantine-Group-root"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-user "><path d="M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0"></path><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-inherit="true">Nikolai Gagarinov</p></div></div><div role="link" tabindex="0" style="cursor:pointer"><button style="display:block;width:100%" class="mantine-focus-auto m_87cf2631 mantine-UnstyledButton-root" type="button" aria-label="Присоединяйтесь к нашему Telegram-сообществу"><div style="background-color:light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-6));margin-block:var(--mantine-spacing-xs)" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root"><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:flex-start;--group-wrap:wrap" class="m_4081bf90 mantine-Group-root"><div style="--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;margin-inline-end:auto;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-telegram "><path d="M15 10l-4 4l6 6l4 -16l-18 7l4 2l2 6l3 -4"></path></svg></div>Присоединяйтесь к нашему Telegram-сообществу</div></div></button></div><h2 style="--title-fw:var(--mantine-h2-font-weight);--title-lh:var(--mantine-h2-line-height);--title-fz:var(--mantine-h2-font-size);margin-block:var(--mantine-spacing-xl)" class="m_8a5d1357 mantine-Title-root" data-order="2">Ответы</h2><div style="margin-bottom:var(--mantine-spacing-xl);padding:var(--mantine-spacing-lg)" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true" id="answer-5349"><div style="--group-gap:calc(1.125rem * var(--mantine-scale));--group-align:stretch;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><div style="--stack-gap:var(--mantine-spacing-md);--stack-align:stretch;--stack-justify:flex-start;font-size:var(--mantine-font-size-h1);font-weight:lighter;text-align:center" class="m_6d731127 mantine-Stack-root">1<a style="color:inherit" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-visual-studio-code/answers/5349/vote"><div style="--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-thumb-up "><path d="M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3"></path></svg></div></a><div style="--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-check "><path d="M5 12l5 5l10 -10"></path></svg></div></div><div style="--stack-gap:var(--mantine-spacing-md);--stack-align:stretch;--stack-justify:flex-start;width:100%;min-width:0rem" class="m_6d731127 mantine-Stack-root"><div style="margin-bottom:auto" class="m_d08caa0 mantine-Typography-root"><p>Visual Studio Code — это один из популярных редакторов кода современности, который используют разработчики самых разных направлений. Он сочетает высокую скорость, простоту, гибкость и набор функций, характерный для профессиональных инструментов разработки. Это не тяжёлая IDE, а лёгкий, расширяемый редактор, который вмещает огромный потенциал благодаря системе дополнений. VS Code доступен на всех популярных операционных системах, бесплатен, может быть настроен практически под любой стек технологий.</p>
<p><img style="--image-object-fit:contain;width:auto" class="m_9e117634 mantine-Image-root" src="https://cdn6.hexlet.io/uuDnVkkyhewe.jpg" alt="" loading="lazy"/></p>
<h2 id="heading-2-1">Что такое Visual Studio Code и чем он отличается от Visual Studio</h2>
<p>Несмотря на схожие названия, <strong>Visual Studio Code</strong> и <strong>Visual Studio</strong> — два разных инструмента. Visual Studio — это полноценная IDE с большим количеством встроенных компонентов, предназначенная для разработки крупномасштабных проектов. Она мощная, но тяжёлая, ресурсоемкая, требует глубокого понимания экосистемы.</p>
<p>VS Code, наоборот, представляет собой легковесный редактор кода, который запускается быстрее, потребляет меньше ресурсов и подходит даже тем, кто только начинает изучать программирование. Он не перегружен инструментами, но при необходимости их можно добавить через расширения.</p>
<h2 id="heading-2-2">Кому подходит Visual Studio Code</h2>
<p>Это универсальный инструмент. Им активно пользуются:</p>
<ul>
<li>
<p><strong>Веб-разработчики, работающие с HTML, CSS, JavaScript, PHP. Visual Studio Code</strong> предоставляет удобные инструменты для верстки, подсветку синтаксиса, автоматическую проверку кода, интеграцию с популярными фронтенд-фреймворками. Это делает его привлекательным для тех, кто создает сайты и веб-приложения с нуля.</p>
</li>
<li>
<p><strong>Фронтенд-инженеры, использующие React, Vue, Angular.</strong> Благодаря расширениям для JSX, TypeScript, Vue, Angular разработчики получают полноценную среду с автодополнением, навигацией по компонентам, поддержкой сниппетов, инструментами для сборки.</p>
</li>
<li>
<p><strong>Бекенд-разработчики, пишущие на Python, Node.js, Go, Rust, Ruby, PHP.</strong> Для этих языков доступны мощные плагины, предоставляющие дебаггер, анализ кода, форматирование, виртуальные окружения, интеграцию с серверами. VS Code легко превращается в комфортную среду для работы с любой серверной логикой.</p>
</li>
<li>
<p><strong>Инженеры C#, которым не требуется полный функционал Visual Studio.</strong> Благодаря расширению OmniSharp VS Code обеспечивает поддержку C# и .NET, что делает редактор удобным выбором для тех, кому не нужна тяжелая IDE, но важны инструменты рефакторинга, отладки.</p>
</li>
<li>
<p><strong>Разработчики мобильных приложений, работающие с Flutter и React Native.</strong> Плагины Flutter, React Native позволяют запускать, отлаживать приложения и работать с симуляторами прямо из редактора, а также получать подсказки по виджетам, структуре проекта.</p>
</li>
<li>
<p><strong>DevOps-специалисты, благодаря поддержке Docker, Kubernetes, терминала.</strong> Редактор обеспечивает удобную работу с Dockerfile, YAML-конфигурациями, helm-чартами и CI/CD-сценариями. Встроенный терминал делает его отличным инструментом для автоматизации, инфраструктурных задач.</p>
</li>
<li>
<p><strong>Студенты, начинающие разработчики, которым нужен лёгкий, понятный редактор.</strong> Интерфейс VS Code интуитивен, а огромное количество обучающих материалов помогает новичкам быстро освоиться. Он не перегружен функциями, но позволяет постепенно расширять возможности за счет дополнений.</p>
</li>
</ul>
<p>VS Code охватывает практически любой язык программирования за счёт огромного количества плагинов. Именно поэтому его так любят в IT-сообществе — редактор подстраивается под задачу, а не наоборот.</p>
<h2 id="heading-2-3">Для чего нужен Visual Studio Code</h2>
<p>Главная задача — обеспечить разработчику удобную и эффективную среду для написания, редактирования, форматирования кода. Это универсальный инструмент, который значительно упрощает работу как над небольшими скриптами, так и над полноценными проектами любой сложности. Благодаря встроенным возможностям, поддержке расширений редактор помогает:</p>
<ul>
<li>
<p><strong>Создавать структуры проектов.</strong> VS Code позволяет формировать базовые папки, файлы и конфигурации, облегчая организацию кода, структуру будущего приложения.</p>
</li>
<li>
<p><strong>Подсвечивать синтаксис.</strong> Редактор автоматически определяет язык и выделяет ключевые элементы кода, обеспечивая удобное чтение, предотвращая визуальные ошибки.</p>
</li>
<li>
<p><strong>Автоматически исправлять мелкие ошибки.</strong> Благодаря линтерам и форматтерам VS Code сам предлагает корректировки для типичных опечаток, неправильных отступов, несоответствий стилю.</p>
</li>
<li>
<p><strong>Запускать, отлаживать проекты.</strong> Инструменты отладки позволяют пошагово выполнять код, анализировать переменные, моментально находить проблемные места.</p>
</li>
<li>
<p><strong>Работать с терминалом.</strong> Встроенный терминал избавляет от нужды переключаться между окнами, позволяет запускать команды прямо в редакторе.</p>
</li>
<li>
<p><strong>Контролировать версии через Git.</strong> VS Code предоставляет удобный визуальный интерфейс для коммитов, ветвления, слияния, просмотра изменений.</p>
</li>
<li>
<p><strong>Быстро перемещаться по проекту.</strong> Умный поиск, переход к определениям и глобальная навигация помогают легко ориентироваться даже в больших проектах.</p>
</li>
<li>
<p><strong>Конфигурировать рабочее пространство под разные цели.</strong> Редактор полностью настраивается — от тем оформления до поведения инструментов, что позволяет адаптировать VS Code под стиль, потребности конкретного разработчика.</p>
</li>
</ul>
<p>VS Code поддерживает полноценную отладку, интеллектуальное автодополнение (IntelliSense), навигацию по функциям, многое другое. Вместо того чтобы искать нужные инструменты по отдельности, разработчик получает всё в одном приложении.</p>
<h2 id="heading-2-4">Где скачать и как установить</h2>
<p><img style="--image-object-fit:contain;width:auto" class="m_9e117634 mantine-Image-root" src="https://cdn6.hexlet.io/4vz97nGaHftJ.jpg" alt="" loading="lazy"/></p>
<h3 id="heading-3-5">Скачивание программы</h3>
<p>Visual Studio Code доступен бесплатно. Скачать его можно напрямую с официального сайта Microsoft. На главной странице пользователь увидит большую кнопку быстрой загрузки — редактор автоматически определит операционную систему, предложит установочный файл. Это делает процесс простым, исключает ошибки при выборе версии.</p>
<p>Помимо стандартной версии, для удобства доступны варианты установки под разные платформы:</p>
<ul>
<li>
<p><strong>Windows</strong> — включая портативную сборку, которую можно запускать без установки;</p>
</li>
<li>
<p><strong>Linux</strong> — представлены пакеты в форматах <strong>.deb</strong>, <strong>.rpm</strong>, а также архив <strong>tar.gz</strong> для универсальной установки;</p>
</li>
<li>
<p><strong>macOS</strong> — доступны версии как для процессоров <strong>Intel</strong>, так и для <strong>Apple Silicon</strong>.</p>
</li>
</ul>
<p>Если хотите лишь ознакомиться с возможностями редактора, но не готовы устанавливать его на компьютер, можно воспользоваться онлайн-версией, работающей прямо в браузере. Она подходит для тестирования и небольших задач, хотя, конечно, не способна полностью заменить приложение.</p>
<h3 id="heading-3-6">Установка программы</h3>
<p>После загрузки файла остаётся только запустить инсталлятор и по очереди выполнить шаги мастера установки. Процесс простой — всего несколько кликов, и редактор будет установлен.</p>
<p>Новичкам лучше оставить настройки по умолчанию. В дальнейшем, когда появится опыт работы, можно подключить дополнительные параметры:</p>
<ul>
<li>
<p>интеграцию в контекстное меню;</p>
</li>
<li>
<p>добавление <strong>Visual Studio Code</strong> в <code style="margin-bottom:var(--mantine-spacing-lg)" class="m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight m_e597c321 mantine-CodeHighlight-codeHighlight m_dfe9c588 mantine-InlineCodeHighlight-inlineCodeHighlight">PATH</code>;</p>
</li>
<li>
<p>создание удобных ярлыков запуска.</p>
</li>
</ul>
<h3 id="heading-3-7">Запуск на слабых компьютерах</h3>
<p>Иногда на старых ПК или системах с недостаточными ресурсами VS Code может запускаться медленно, зависать или показывать чёрный экран. Это связано с тем, что редактор построен на Electron — платформе, напоминающей по работе браузер, и потому требовательной к графике, оперативной памяти.</p>
<p>Однако существует решение:</p>
<ol>
<li>
<p>Откройте свойства ярлыка VS Code.</p>
</li>
<li>
<p>В конце строки с путем к приложению добавьте флаг:</p>
</li>
</ol>
<div style="margin-bottom:var(--mantine-spacing-lg)" class="m_e597c321 mantine-CodeHighlight-codeHighlight" dir="ltr"><div class="m_be7e9c9c mantine-CodeHighlight-controls"><button style="--ai-bg:transparent;--ai-hover:transparent;--ai-color:inherit;--ai-bd:none" class="mantine-focus-auto mantine-active m_d498bab7 mantine-CodeHighlight-control m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root" data-variant="none" type="button" aria-label="Copy code"><span class="m_8d3afb97 mantine-ActionIcon-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M8 8m0 2a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2z"></path><path d="M16 8v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2"></path></svg></span></button></div><div style="--scrollarea-scrollbar-size:calc(0.25rem * var(--mantine-scale));--sa-corner-width:0px;--sa-corner-height:0px" class="m_f744fd40 mantine-CodeHighlight-scrollarea m_d57069b5 mantine-ScrollArea-root" dir="ltr"><div style="overflow-x:hidden;overflow-y:hidden;overscroll-behavior-inline:none" class="m_c0783ff9 mantine-ScrollArea-viewport" data-scrollbars="xy"><div class="m_b1336c6 mantine-ScrollArea-content"><pre class="m_2c47c4fd mantine-CodeHighlight-pre" style="padding:0"><code class="m_5caae6d3 mantine-CodeHighlight-code">--disable-gpu</code></pre></div></div></div><button class="mantine-focus-auto m_c9378bc2 mantine-CodeHighlight-showCodeButton m_87cf2631 mantine-UnstyledButton-root" data-hidden="true" type="button">Expand code</button></div>
<p>Этот параметр отключает аппаратное ускорение и позволяет запустить редактор даже на слабых устройствах, снижая нагрузку на видеокарту, процессор.</p>
<h2 id="heading-2-8">Как установить русский язык в Visual Studio Code</h2>
<p>Чтобы изменить язык интерфейса:</p>
<ol>
<li>
<p>Откройте панель расширений (<!-- -->Ctrl+Shift+X<!-- -->).</p>
</li>
<li>
<p>Введите в поиске <em>Russian Language Pack</em>.</p>
</li>
<li>
<p>Установите пакет, перезапустите VS Code.</p>
</li>
</ol>
<p>После перезапуска интерфейс станет русскоязычным. Однако опытные разработчики часто предпочитают английскую версию, поскольку большинство статей, документаций, обсуждений в сети — англоязычные.</p>
<h2 id="heading-2-9">Интерфейс</h2>
<p>Visual Studio Code основан на Electron, а значит интерфейс собирается с помощью веб-технологий. Это делает его гибким и функциональным, но одновременно легким для освоения.</p>
<h3 id="heading-3-10">Основные элементы интерфейса:</h3>
<ul>
<li>
<p><strong>Рабочая область</strong> — место, где открыт файл с кодом.</p>
</li>
<li>
<p><strong>Верхнее меню</strong> — доступ к базовым функциям.</p>
</li>
<li>
<p><strong>Боковая панель</strong> — структура проекта, Git, поиск, расширения, отладка.</p>
</li>
<li>
<p><strong>Терминал</strong> — встроенная командная строка, которую можно открыть горячей клавишей <!-- -->Ctrl+`<!-- --> (тильда).</p>
</li>
</ul>
<p>VS Code поддерживает работу с несколькими файлами в разных вкладках, а также позволяет разделить экран на две или три части, как в полноценных IDE.</p>
<h2 id="heading-2-11">Настройка Visual Studio Code</h2>
<p>Настройки открываются сочетанием <!-- -->Ctrl + ,<!-- --> или через меню <em>File → Preferences → Settings</em>.</p>
<p>Есть два пути настройки:</p>
<h3 id="heading-3-12">1. Графический интерфейс</h3>
<p>Подходит новичкам — все параметры разбиты по категориям.</p>
<h3 id="heading-3-13">2. Ручное редактирование settings.json</h3>
<p>Подходит опытным пользователям — позволяет глубоко изменить поведение редактора.</p>
<h3 id="heading-3-14">Полезные параметры:</h3>
<ul>
<li>
<p><strong>Auto Save</strong> — включает автоматическое сохранение.</p>
</li>
<li>
<p><strong>Font Size</strong> — изменение размера шрифта.</p>
</li>
<li>
<p><strong>Format On Paste</strong> — автоформатирование при вставке.</p>
</li>
<li>
<p><strong>Trim Trailing Whitespace</strong> — удаление пробелов в конце строк.</p>
</li>
</ul>
<p>Также можно быстро менять цветовую схему через командную палитру (<!-- -->Ctrl+Shift+P<!-- --> → Theme).</p>
<h2 id="heading-2-15">Возможности Visual Studio Code</h2>
<h3 id="heading-3-16">Редактирование и написание кода</h3>
<p><strong>Visual Studio Code</strong> предоставляет разработчику обширный набор инструментов, которые облегчают работу с кодом на любом языке. Редактор автоматически анализирует структуру файлов и предоставляет набор средств для комфортной разработки:</p>
<ul>
<li>
<p><strong>Подсветка синтаксиса.</strong> Цветовое выделение элементов кода делает его визуально понятным, позволяет быстрее замечать ошибки.</p>
</li>
<li>
<p><strong>Умное автодополнение.</strong> IntelliSense предлагает варианты продолжения кода на основе контекста, структуры проекта, подключенных библиотек.</p>
</li>
<li>
<p><strong>Автоформатирование.</strong> Редактор автоматически выравнивает отступы, расставляет пробелы, приводит код к единообразному стилю.</p>
</li>
<li>
<p><strong>Рефакторинг.</strong> Поддерживаются быстрые операции: переименование переменных, перенос кода в функции, исправление импорта.</p>
</li>
<li>
<p><strong>Подсказки IntelliSense.</strong> Всплывающие подсказки помогают быстрее ориентироваться в API, структуре проекта.</p>
</li>
<li>
<p><strong>Отображение ошибок в режиме реального времени. Visual Studio Code</strong> подсвечивает проблемные участки, предлагает варианты исправления еще до запуска программы.</p>
</li>
</ul>
<p>Благодаря такому набору возможностей редактор превращается в полноценную рабочую платформу, а не просто в инструмент для набора текста.</p>
<h2 id="heading-2-17">Автоматическое редактирование</h2>
<p><img style="--image-object-fit:contain;width:auto" class="m_9e117634 mantine-Image-root" src="https://cdn6.hexlet.io/md6FXAneaM9E.jpg" alt="" loading="lazy"/></p>
<p>VS Code позволяет автоматизировать большое количество рутинных задач при помощи расширений вроде Prettier, ESLint. Эти инструменты:</p>
<ul>
<li>
<p><strong>Исправляют отступы.</strong> Приводят структуру кода к единообразному оформлению.</p>
</li>
<li>
<p><strong>Убирают лишние пробелы.</strong> Автоматически очищают файл от ненужных символов при сохранении.</p>
</li>
<li>
<p><strong>Следят за стилем.</strong> Применяют выбранный командой стиль написания кода, что особенно важно в больших проектах.</p>
</li>
<li>
<p><strong>Предотвращают синтаксические ошибки.</strong> Линтеры сразу подсказывают, где нарушены правила или возможны логические проблемы.</p>
</li>
</ul>
<p>Автоматизация упрощает работу команды, помогает поддерживать чистоту, читаемость проекта.</p>
<h2 id="heading-2-18">Поиск и вставка</h2>
<p>Инструменты поиска в VS Code позволяют быстро ориентироваться даже в крупных проектах. Встроенная система поддерживает:</p>
<ul>
<li>
<p><strong>Обычный поиск по файлу.</strong> Подходит для точечного поиска переменных, функций или фрагментов текста.</p>
</li>
<li>
<p><strong>Расширенный поиск по проекту.</strong> Помогает находить нужные элементы во всех папках, файлах проекта одновременно.</p>
</li>
<li>
<p><strong>Регулярные выражения.</strong> Позволяют выполнять сложные запросы и находить паттерны, соответствующие определенным правилам.</p>
</li>
<li>
<p><strong>Массовую замену текста.</strong> Ускоряет редактирование, позволяя менять повторяющиеся конструкции всего за пару кликов.</p>
</li>
</ul>
<p>Эти инструменты существенно увеличивают скорость работы, минимизируют рутинные операции.</p>
<h2 id="heading-2-19">Контроль версий</h2>
<p><strong>Visual Studio Code</strong> содержит встроенную, очень удобную интеграцию с Git. Прямо из редактора можно выполнять все основные действия:</p>
<ul>
<li>
<p><strong>Просмотр изменений.</strong> Показывает, что было удалено, добавлено или изменено.</p>
</li>
<li>
<p><strong>Создание коммитов.</strong> Позволяет фиксировать изменения одним нажатием кнопки.</p>
</li>
<li>
<p><strong>Управление ветками.</strong> Создание, переключение, удаление веток доступно через визуальный интерфейс.</p>
</li>
<li>
<p><strong>Визуальный дифф.</strong> Открывает разницу между версиями файлов в удобном формате.</p>
</li>
<li>
<p><strong>Работа с удалёнными репозиториями.</strong> Поддерживает GitHub, GitLab, Bitbucket, другие платформы.</p>
</li>
<li>
<p><strong>Интеграция с GitHub, GitLab.</strong> Позволяет выполнять pull requests, другие операции прямо из редактора.</p>
</li>
</ul>
<p>Благодаря этому <strong>Visual Studio Code</strong> помогает экономить время и избегать ошибок, связанных с ручным вводом команд.</p>
<h2 id="heading-2-20">Запуск и отладка кода</h2>
<p>Вкладка <strong>«Запуск и отладка»</strong> делает VS Code полноценным инструментом для тестирования приложений:</p>
<ul>
<li>
<p><strong>Просматривать состояние переменных.</strong> Показывает текущие значения и помогает анализировать поведение программы.</p>
</li>
<li>
<p><strong>Выполнять код пошагово.</strong> Позволяет отслеживать каждый этап выполнения.</p>
</li>
<li>
<p><strong>Устанавливать точки останова.</strong> Останавливает программу в нужном месте для анализа.</p>
</li>
<li>
<p><strong>Отслеживать стеки вызовов.</strong> Показывает, как именно был достигнут конкретный участок кода.</p>
</li>
</ul>
<p>Большинству языков достаточно установить профильное расширение — VS Code становится комфортной средой для отладки.</p>
<h2 id="heading-2-21">Горячие клавиши в Visual Studio Code</h2>
<p>Редактор содержит десятки удобных сочетаний клавиш, которые значительно ускоряют работу. Многие опытные разработчики работают почти без мыши, переключаясь между файлами, функциями, вкладками с помощью клавиатуры.</p>
<p>Таблица горячих клавиш из исходного текста полностью корректна, может быть использована в готовом виде.</p>
<h2 id="heading-2-22">Установка расширений (плагинов)</h2>
<p>Расширения — особенность <strong>Visual Studio Code</strong>. Именно они превращают его из лёгкого редактора в мощную, гибкую платформу разработки.</p>
<p><img style="--image-object-fit:contain;width:auto" class="m_9e117634 mantine-Image-root" src="https://cdn6.hexlet.io/bnrL4GFLgz4c.jpg" alt="" loading="lazy"/></p>
<p>Чтобы установить расширение, достаточно:</p>
<ol>
<li>
<p>Открыть панель расширений (<!-- -->Ctrl+Shift+X<!-- -->).</p>
</li>
<li>
<p>Найти нужный плагин через поиск.</p>
</li>
<li>
<p>Нажать <strong>Install</strong>.</p>
</li>
<li>
<p>Управлять параметрами через меню <strong>Manage</strong>.</p>
</li>
</ol>
<p>На странице каждого расширения доступна подробная информация:</p>
<ul>
<li>
<p><strong>описание,</strong> область применения;</p>
</li>
<li>
<p><strong>количество установок</strong> — показатель доверия сообщества;</p>
</li>
<li>
<p><strong>рейтинг</strong> на основе отзывов;</p>
</li>
<li>
<p><strong>история изменений</strong>;</p>
</li>
<li>
<p><strong>зависимости от других плагинов</strong>;</p>
</li>
<li>
<p><strong>список возможностей, команд</strong>;</p>
</li>
<li>
<p><strong>поддерживаемые горячие клавиши</strong>.</p>
</li>
</ul>
<p>Каталог расширений содержит плагины для всех популярных языков, инструментов, фреймворков. Есть небольшие дополнения — например, панели, темизации, визуальные улучшения.</p>
<h2 id="heading-2-23">Преимущества Visual Studio Code</h2>
<p>VS Code стал популярным благодаря сочетанию преимуществ, которые сделали его универсальным инструментом для разработчиков разного уровня и специализации.</p>
<h3 id="heading-3-24">Простота освоения</h3>
<p>Редактор обладает интуитивно понятным интерфейсом и логичной навигацией, поэтому даже новичок может быстро начать работать в нём. Большое количество обучающих материалов, подсказок, встроенных функций облегчает первые шаги в программировании.</p>
<h3 id="heading-3-25">Малый вес</h3>
<p>По сравнению с IDE, <strong>Visual Studio Code</strong> потребляет значительно меньше ресурсов, запускается заметно быстрее. Он остается легким даже при установке нескольких расширений, из-за чего комфортно работает на большинстве устройств.</p>
<h3 id="heading-3-26">Кроссплатформенность</h3>
<p>Редактор доступен на Windows, Linux и macOS, что делает его удобным для разработчиков, работающих с разными операционными системами. Возможность синхронизации настроек между устройствами позволяет легко переносить рабочую среду.</p>
<h3 id="heading-3-27">Поддержка множества языков</h3>
<p>VS Code подходит тем, кто работает в мультистековой среде: редактор поддерживает десятки языков из коробки, а остальные подключаются через расширения. Это делает его особенно удобным для разработчиков, которые совмещают несколько технологий в рамках одного проекта.</p>
<h3 id="heading-3-28">Гибкость</h3>
<p>Благодаря огромной экосистеме расширений VS Code можно адаптировать практически под любую задачу — от простой верстки до работы с контейнерами, базами данных, облачными сервисами. Настройки, темы, плагины, профили дают возможность создать полностью персонализированную рабочую среду.</p>
<h2 id="heading-2-29">Недостатки Visual Studio Code</h2>
<p>Несмотря на впечатляющий набор возможностей и огромное количество преимуществ, важно понимать, что VS Code остаётся именно редактором кода, а не полноценной интегрированной средой разработки. Его философия — легкость, гибкость и минимализм, поэтому некоторые задачи, характерные для крупных IDE, здесь реализуются через расширения или требуют дополнительной настройки.</p>
<h3 id="heading-3-30">Ограниченная функциональность</h3>
<p>Существуют языки и технологии, для которых необходима глубокая интеграция с инструментами компиляции, профилирования или анализа производительности — например, Java, C++ или некоторые промышленные фреймворки. В таких случаях IDE предоставляют расширенные возможности, которые <strong>Visual Studio Code</strong> восполняет только частично. Для сложных корпоративных проектов редактор может оказаться недостаточно мощным.</p>
<h3 id="heading-3-31">Производительность на слабых ПК</h3>
<p>VS Code работает на движке Electron, который по сути представляет собой легкий браузер. Это дает кроссплатформенность, но требует ресурсов. На компьютерах с устаревшими процессорами, медленными HDD-дисками или небольшим количеством оперативной памяти редактор может запускаться дольше, иногда подвисать, работать менее плавно. Особенно заметны проблемы при открытии больших проектов.</p>
<h3 id="heading-3-32">Зависимость от расширений</h3>
<p>Базовая версия VS Code минималистична. Чтобы превратить редактор в рабочий инструмент, приходится устанавливать десятки расширений: для языков, форматирования, дебага, работы с контейнерами и так далее. Это гибко и удобно, но чрезмерное количество плагинов может повлиять на скорость работы, вызвать конфликты или потребовать регулярного обновления, контроля совместимости.</p>
<p>Visual Studio Code — это гибкий, мощный и бесплатный инструмент, который подходит для большинства разработчиков. Его простота сочетается с огромными возможностями, а установка дополнительных расширений превращает его в среду разработки для любого проекта. VS Code продолжает активно развиваться, поддерживается Microsoft и огромным комьюнити, что делает его одним из перспективных редакторов на рынке.</p></div><div class="m_3eebeb36 mantine-Divider-root" data-orientation="horizontal" role="separator"></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:flex-start;--group-wrap:wrap;font-size:var(--mantine-font-size-sm)" class="m_4081bf90 mantine-Group-root"><div style="--group-gap:var(--mantine-spacing-xs);--group-align:center;--group-justify:flex-start;--group-wrap:wrap;margin-inline-start:auto" class="m_4081bf90 mantine-Group-root"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar "><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M11 15h1"></path><path d="M12 15v3"></path></svg><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-inherit="true">2 месяца назад</p></div><div style="--group-gap:var(--mantine-spacing-xs);--group-align:center;--group-justify:flex-start;--group-wrap:wrap" class="m_4081bf90 mantine-Group-root"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-user "><path d="M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0"></path><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-inherit="true">Nikolai Gagarinov</p></div></div></div></div></div><div style="margin-bottom:var(--mantine-spacing-xl);padding:var(--mantine-spacing-lg)" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true" id="answer-3122"><div style="--group-gap:calc(1.125rem * var(--mantine-scale));--group-align:stretch;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><div style="--stack-gap:var(--mantine-spacing-md);--stack-align:stretch;--stack-justify:flex-start;font-size:var(--mantine-font-size-h1);font-weight:lighter;text-align:center" class="m_6d731127 mantine-Stack-root">0<a style="color:inherit" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-visual-studio-code/answers/3122/vote"><div style="--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-thumb-up "><path d="M7 11v8a1 1 0 0 1 -1 1h-2a1 1 0 0 1 -1 -1v-7a1 1 0 0 1 1 -1h3a4 4 0 0 0 4 -4v-1a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1 -2 2h-7a3 3 0 0 1 -3 -3"></path></svg></div></a></div><div style="--stack-gap:var(--mantine-spacing-md);--stack-align:stretch;--stack-justify:flex-start;width:100%;min-width:0rem" class="m_6d731127 mantine-Stack-root"><div style="margin-bottom:auto" class="m_d08caa0 mantine-Typography-root"><p>Visual Studio Code - это бесплатный редактор исходного кода, разработанный Microsoft для Windows, Linux и macOS. Он включает в себя множество функций, таких как поддержка различных языков программирования, отладка, рефакторинг и интеграция с системами контроля версий.</p></div><div class="m_3eebeb36 mantine-Divider-root" data-orientation="horizontal" role="separator"></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:center;--group-justify:flex-start;--group-wrap:wrap;font-size:var(--mantine-font-size-sm)" class="m_4081bf90 mantine-Group-root"><div style="--group-gap:var(--mantine-spacing-xs);--group-align:center;--group-justify:flex-start;--group-wrap:wrap;margin-inline-start:auto" class="m_4081bf90 mantine-Group-root"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-calendar "><path d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12"></path><path d="M16 3v4"></path><path d="M8 3v4"></path><path d="M4 11h16"></path><path d="M11 15h1"></path><path d="M12 15v3"></path></svg><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-inherit="true">2 года назад</p></div><div style="--group-gap:var(--mantine-spacing-xs);--group-align:center;--group-justify:flex-start;--group-wrap:wrap" class="m_4081bf90 mantine-Group-root"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-user "><path d="M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0"></path><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-inherit="true">Елена Редькина</p></div></div></div></div></div><style data-mantine-styles="inline">.__m__-_R_4bbdiub_{--carousel-slide-gap:var(--mantine-spacing-xs);--carousel-slide-size:70%;}@media(min-width: 36em){.__m__-_R_4bbdiub_{--carousel-slide-gap:var(--mantine-spacing-xl);--carousel-slide-size:50%;}}</style><div style="--carousel-control-size:calc(2.5rem * var(--mantine-scale));--carousel-controls-offset:var(--mantine-spacing-sm);margin-top:var(--mantine-spacing-xl);margin-bottom:var(--mantine-spacing-lg);padding-block:var(--mantine-spacing-sm);background:var(--app-color-surface)" class="m_17884d0f mantine-Carousel-root responsiveClassName" data-orientation="horizontal" data-include-gap-in-size="true"><div class="m_39bc3463 mantine-Carousel-controls" data-orientation="horizontal"><button class="mantine-focus-auto m_64f58e10 mantine-Carousel-control m_87cf2631 mantine-UnstyledButton-root" type="button" data-inactive="true" data-type="previous" tabindex="-1"><svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" style="transform:rotate(90deg);width:calc(1rem * var(--mantine-scale));height:calc(1rem * var(--mantine-scale));display:block"><path d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg></button><button class="mantine-focus-auto m_64f58e10 mantine-Carousel-control m_87cf2631 mantine-UnstyledButton-root" type="button" data-inactive="true" data-type="next" tabindex="-1"><svg viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" style="transform:rotate(-90deg);width:calc(1rem * var(--mantine-scale));height:calc(1rem * var(--mantine-scale));display:block"><path d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg></button></div><div class="m_a2dae653 mantine-Carousel-viewport" data-type="media"><div class="m_fcd81474 mantine-Carousel-container __m__-_R_4bbdiub_" data-orientation="horizontal"><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/local-environment-automation?promo_name=programs_list&promo_position=qna_question&promo_creative=catalog_card&promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">1 месяц</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Для продвинутых</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Автоматизация локального окружения</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Освоите настройку окружения с dev-инструментами</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6Mzk3MSwicHVyIjoiYmxvYl9pZCJ9fQ==--126b25f39a57b0fdbd31895236a8d1da05b80ac4/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Server-amico.png" alt="Автоматизация локального окружения" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 3 900 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/frontend?promo_name=programs_list&promo_position=qna_question&promo_creative=catalog_card&promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">10 месяцев</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Фронтенд-разработчик</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Изучите HTML, CSS, JavaScript и React</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzcyNywicHVyIjoiYmxvYl9pZCJ9fQ==--2d5cbbf5c3b4a73ae4b2c50632305d78f5872e4d/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Programmer-rafiki.png" alt="Фронтенд-разработчик" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 6 792 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/professional-layout?promo_name=programs_list&promo_position=qna_question&promo_creative=catalog_card&promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">5 месяцев</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Профессиональная верстка</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Адаптивная вёрстка для отображения на любых устройствах </p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6NDAzNCwicHVyIjoiYmxvYl9pZCJ9fQ==--ba516ea9573bdfcd1d21e2aa0fff8818561828f2/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Typing-bro.png" alt="Профессиональная верстка" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 3 900 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/flask?promo_name=programs_list&promo_position=qna_question&promo_creative=catalog_card&promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">1 месяц</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Веб-разработка на Python</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Навык создания веб-приложений на Flask</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY3NywicHVyIjoiYmxvYl9pZCJ9fQ==--745022c2f47ba4203dd11cd8922cd55d5bebfdca/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Code%20typing-rafiki.png" alt="Веб-разработка на Python" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">от 3 900 ₽</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/programs/web-development-free?promo_name=programs_list&promo_position=qna_question&promo_creative=catalog_card&promo_type=card" target="_blank"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><div style="--group-gap:calc(0.25rem * var(--mantine-scale));--group-align:center;--group-justify:flex-start;--group-wrap:nowrap" class="m_4081bf90 mantine-Group-root"><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">1 месяц</span><span class="mantine-focus-auto m_b6d8b162 mantine-Text-root">·</span><span style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">С нуля</span></div><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h5);font-weight:bold" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Основы веб-разработки</p><p class="mantine-focus-auto m_b6d8b162 mantine-Text-root"></p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="https://hexlet.io/rails/active_storage/representations/proxy/eyJfcmFpbHMiOnsiZGF0YSI6MzY4NywicHVyIjoiYmxvYl9pZCJ9fQ==--8b6c104f41f902085a7d6e50ea73457f84a3ac33/eyJfcmFpbHMiOnsiZGF0YSI6eyJmb3JtYXQiOiJ3ZWJwIiwicmVzaXplX3RvX2xpbWl0IjpbNDAwLDQwMF0sInNhdmVyIjp7InF1YWxpdHkiOjg1fX0sInB1ciI6InZhcmlhdGlvbiJ9fQ==--5b6f46dacd1af664f27558553a58076185091823/Coding-amico.png" alt="Основы веб-разработки" loading="eager"/></div><div style="--group-gap:var(--mantine-spacing-md);--group-align:end;--group-justify:space-between;--group-wrap:wrap;margin-top:var(--mantine-spacing-xs)" class="m_4081bf90 mantine-Group-root"><p style="font-size:var(--mantine-font-size-xl)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Бесплатно</p><p style="font-size:var(--mantine-font-size-sm)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></div></div></a></div></div><div class="m_d98df724 mantine-Carousel-slide" data-orientation="horizontal"><div tabindex="0" style="cursor:pointer;height:100%"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/courses?promo_name=programs_list&promo_position=qna_question&promo_creative=catalog_card&promo_type=card"><div style="height:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root" data-with-border="true"><h2 style="--title-fw:var(--mantine-h2-font-weight);--title-lh:var(--mantine-h2-line-height);--title-fz:var(--mantine-h2-font-size);margin-bottom:var(--mantine-spacing-md);font-size:var(--mantine-font-size-h3)" class="m_8a5d1357 mantine-Title-root" data-order="2" data-responsive="true">Каталог</h2><p style="margin-bottom:auto" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Полный список доступных курсов по разным направлениям</p><div style="margin-top:auto" class=""><div class="m_4451eb3a mantine-Center-root"><img style="opacity:0.8;width:70%" class="m_9e117634 mantine-Image-root mantine-visible-from-xs" src="/vite/assets/development-BVihs_d5.png" alt="Orientation"/></div></div></div></a></div></div></div></div></div></div><style data-mantine-styles="inline">.__m__-_R_5diub_{--col-flex-grow:auto;--col-flex-basis:100%;--col-max-width:100%;}@media(min-width: 48em){.__m__-_R_5diub_{--col-flex-grow:auto;--col-flex-basis:16.666666666666668%;--col-max-width:16.666666666666668%;}}@media(min-width: 62em){.__m__-_R_5diub_{--col-flex-grow:auto;--col-flex-basis:33.333333333333336%;--col-max-width:33.333333333333336%;}}</style><div class="m_96bdd299 mantine-Grid-col __m__-_R_5diub_ mantine-visible-from-md"><div style="margin-bottom:var(--mantine-spacing-xl);padding:var(--mantine-spacing-xl);background:var(--mantine-color-blue-0);width:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root"><p style="margin-bottom:var(--mantine-spacing-sm);font-size:var(--mantine-font-size-h4)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Похожие вопросы</p><ul class="m_abbac491 mantine-List-root"><li style="margin-bottom:var(--mantine-spacing-xs)" class="m_abb6bec2 mantine-List-item" data-with-icon="true"><div class="m_75cd9f71 mantine-List-itemWrapper"><span class="m_60f83e5b mantine-List-itemIcon"><div class="m_4451eb3a mantine-Center-root"><div style="--ti-size:var(--ti-size-xs);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-compact-right "><path d="M11 4l3 8l-3 8"></path></svg></div></div></span><span class="mantine-List-itemLabel"><a class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-pandas">Pandas</a></span></div></li><li style="margin-bottom:var(--mantine-spacing-xs)" class="m_abb6bec2 mantine-List-item" data-with-icon="true"><div class="m_75cd9f71 mantine-List-itemWrapper"><span class="m_60f83e5b mantine-List-itemIcon"><div class="m_4451eb3a mantine-Center-root"><div style="--ti-size:var(--ti-size-xs);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-compact-right "><path d="M11 4l3 8l-3 8"></path></svg></div></div></span><span class="mantine-List-itemLabel"><a class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-1c-buhgalteriya">1C:Бухгалтерия</a></span></div></li><li style="margin-bottom:var(--mantine-spacing-xs)" class="m_abb6bec2 mantine-List-item" data-with-icon="true"><div class="m_75cd9f71 mantine-List-itemWrapper"><span class="m_60f83e5b mantine-List-itemIcon"><div class="m_4451eb3a mantine-Center-root"><div style="--ti-size:var(--ti-size-xs);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-compact-right "><path d="M11 4l3 8l-3 8"></path></svg></div></div></span><span class="mantine-List-itemLabel"><a class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-1c-predpriyatie">1C:Предприятие</a></span></div></li><li style="margin-bottom:var(--mantine-spacing-xs)" class="m_abb6bec2 mantine-List-item" data-with-icon="true"><div class="m_75cd9f71 mantine-List-itemWrapper"><span class="m_60f83e5b mantine-List-itemIcon"><div class="m_4451eb3a mantine-Center-root"><div style="--ti-size:var(--ti-size-xs);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-compact-right "><path d="M11 4l3 8l-3 8"></path></svg></div></div></span><span class="mantine-List-itemLabel"><a class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-a-b-testirovanie">A/B-тестирование</a></span></div></li><li style="margin-bottom:var(--mantine-spacing-xs)" class="m_abb6bec2 mantine-List-item" data-with-icon="true"><div class="m_75cd9f71 mantine-List-itemWrapper"><span class="m_60f83e5b mantine-List-itemIcon"><div class="m_4451eb3a mantine-Center-root"><div style="--ti-size:var(--ti-size-xs);--ti-bg:transparent;--ti-color:var(--mantine-color-indigo-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:inherit" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-compact-right "><path d="M11 4l3 8l-3 8"></path></svg></div></div></span><span class="mantine-List-itemLabel"><a class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/qna/glossary/questions/chto-takoe-agile">Agile</a></span></div></li></ul></div><div style="justify-content:end;margin-top:0rem;position:sticky;top:calc(5rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_1bddiub_"><div tabindex="0" style="cursor:pointer"><a style="text-decoration:none" class="mantine-focus-auto m_849cf0da m_b6d8b162 mantine-Text-root mantine-Anchor-root" data-underline="hover" href="/courses_devops?promo_name=program_category&promo_position=qna_question&promo_creative=card&promo_type=card"><div style="background-color:var(--mantine-color-default);border:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-default-border);padding-inline:var(--mantine-spacing-xl);padding-top:var(--mantine-spacing-xl);padding-bottom:var(--mantine-spacing-xs);width:100%" class="m_e615b15f mantine-Card-root m_1b7284a3 mantine-Paper-root"><div class="m_4451eb3a mantine-Center-root" data-inline="true"><p style="font-size:var(--mantine-font-size-h4)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Курсы по DevOps</p></div><img class="m_9e117634 mantine-Image-root" src="/vite/assets/development-BVihs_d5.png"/><p style="margin-bottom:var(--mantine-spacing-xs);text-align:right" class="mantine-focus-auto m_b6d8b162 mantine-Text-root">Посмотреть →</p></div></a></div></div></div></div></div></div></div>
</main>
<footer class="bg-dark fw-light text-light px-3 py-5">
<div class="row small">
<div class="col-12 col-sm-6 col-md-3">
<div class="h5 mb-3">Хекслет</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/about">О нас</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/testimonials">Отзывы</a>
</li>
<li>
<span class="nav-link link-light py-1 ps-0 external-link" data-href="https://b2b.hexlet.io" role="button">Корпоративное обучение</span>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/blog">Блог</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/qna">Вопросы и ответы</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/glossary">Глоссарий</a>
</li>
<li>
<span class="nav-link link-light py-1 ps-0 external-link" data-href="https://help.hexlet.io" data-target="_blank" role="button">Справка</span>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" target="_blank" rel="noopener noreferrer" href="/map">Карта сайта</a>
</li>
</ul>
</div>
<div class="col-12 col-sm-6 col-md-3">
<div class="h5 fw-normal mb-3">Направления</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_devops">DevOps
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_data_analytics">Аналитика
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_backend_development">Бэкенд
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_programming">Программирование
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_testing">Тестирование
</a></li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/courses_front_end_dev">Фронтенд
</a></li>
</ul>
</div>
<div class="col-12 col-sm-6 col-md-3">
<div class="h5">Профессии</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/devops-engineer-from-scratch">DevOps-инженер с нуля</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/go">Go-разработчик</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/java">Java-разработчик</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/python">Python-разработчик </a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/data-analytics">Аналитик данных</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/qa-engineer">Инженер по ручному тестированию</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/php">РНР-разработчик</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/frontend">Фронтенд-разработчик</a>
</li>
</ul>
</div>
<div class="col-12 col-sm-6 col-md-3">
<div class="h5">Навыки</div>
<ul class="list-unstyled">
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/python-django-developer">Django</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/docker">Docker</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/php-laravel-developer">Laravel</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/postman">Postman</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/js-react-developer">React</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/js-rest-api">REST API в Node.js</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/spring-boot">Spring Boot</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/programs/typescript">Typescript</a>
</li>
</ul>
</div>
</div>
<hr>
<div class="row">
<div class="col-12 col-sm-4 col-md-2">
<div class="fs-4">
<ul class="list-unstyled d-flex">
<li class="me-3">
<a aria-label="Telegram" target="_blank" class="link-light" rel="noopener noreferrer nofollow" href="https://t.me/hexlet_ru"><span class="bi bi-telegram"></span>
</a></li>
<li>
<a aria-label="Youtube" target="_blank" class="link-light" rel="noopener noreferrer nofollow" href="https://www.youtube.com/user/HexletUniversity"><span class="bi bi-youtube"></span>
</a></li>
</ul>
</div>
<div class="mb-2 d-flex flex-column">
<a class="link-light text-decoration-none" rel="nofollow" href="mailto:support@hexlet.io">support@hexlet.io</a>
<a class="link-light text-decoration-none py-2" target="_blank" href="https://t.me/hexlet_help_bot">t.me/hexlet_help_bot</a>
</div>
<ul class="list-unstyled d-flex">
<li class="me-3">
<span class="link-light text-decoration-none opacity-50 x-font-size-18 external-link" rel="nofollow" data-href="https://hexlet.io/locale/switch?new_locale=en" data-target="_self" role="button"><span class="my-auto">EN</span>
</span></li>
<li class="me-3">
<span class="link-light text-decoration-none opacity-50 x-font-size-18 opacity-100 external-link" rel="nofollow" data-href="https://ru.hexlet.io/locale/switch?new_locale=ru" data-target="_self" role="button"><span class="my-auto">RU</span>
</span></li>
<li class="me-3">
<span class="link-light text-decoration-none opacity-50 x-font-size-18 external-link" rel="nofollow" data-href="https://kz.hexlet.io/locale/switch?new_locale=kz" data-target="_self" role="button"><span class="my-auto">KZ</span>
</span></li>
</ul>
</div>
<div class="col-12 col-sm-4 col-md-3">
<ul class="list-unstyled fs-4">
<li class="mb-3">
<a class="link-light text-decoration-none" href="tel:8%20800%20100%2022%2047">8 800 100 22 47</a>
<span class="d-block opacity-50 small">бесплатно по РФ</span>
</li>
<li>
<a class="link-light text-decoration-none" href="tel:%2B7%20495%20085%2021%2062">+7 495 085 21 62</a>
<span class="d-block opacity-50 small">бесплатно по Москве</span>
</li>
</ul>
</div>
<div class="col-12 col-sm-4 col-md-3">
<div class="small mb-3">Образовательные услуги оказываются на основании Л035-01298-77/01989008 от 14.03.2025</div>
<ul class="list-unstyled small">
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/legal">Правовая информация</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/offer">Оферта</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/license">Лицензия</a>
</li>
<li>
<a class="nav-link link-light py-1 ps-0" href="/pages/contacts">Контакты</a>
</li>
</ul>
</div>
<div class="col-12 col-sm-12 col-md-4 small">
<div class="mb-2">
<div>ООО «<a href="/" class="text-decoration-none link-light">Хекслет Рус</a>»</div>
<div>108813 г. Москва, вн.тер.г. поселение Московский,</div>
<div>г. Московский, ул. Солнечная, д. 3А, стр. 1, помещ. 20Б/3</div>
<div>ОГРН 1217300010476</div>
<div>ИНН 7325174845</div>
</div>
<hr>
<div>АНО ДПО «<a href="/" class="text-decoration-none link-light">Учебный центр «Хекслет</a>»</div>
<div>119331 г. Москва, вн. тер. г. муниципальный округ</div>
<div>Ломоносовский, пр-кт Вернадского, д. 29</div>
<div>ОГРН 1247700712390</div>
<div>ИНН 7736364948</div>
</div>
</div>
</footer>
<div id="root-assistant-offcanvas"></div>
<script src="/vite/assets/assistant-D8AK0-_C.js" crossorigin="anonymous" type="module"></script><link rel="modulepreload" href="/vite/assets/chunk-DsPFFUou.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/init-DOv3_-Z_.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/ErrorFallbackBlock-naDSYSy9.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/MarkdownBlock-DbyKWoR_.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/gon-D3e4yh1x.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/mantine-CGMYrt2Y.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/shiki-V011pkdv.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/utils-DRqSHbQE.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/routes-CCH8ilKF.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/lib-XR8Qr8kR.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/dist-GCHh59xr.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/Box-B5-OOzBf.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/notifications.store-C-3AFSMn.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/useIsomorphicEffect-HJ6VK0D3.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/lib-KSp6QbZ0.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/axios-BEvgo0ym.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/classnames-l6ipYlLR.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/dayjs.min-BkKovM-s.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/debounce-jMQ_Cf4f.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/i18next-BlSq9s7B.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/client-U9M77rxp.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-dom-DaLxUz_h.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/useTranslation-Bx1Cdrkz.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/compiler-runtime-6XxiPFnt.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/jsx-runtime-CwjcCKJi.js" as="script" crossorigin="anonymous">
<link rel="modulepreload" href="/vite/assets/react-CkL4ZRHB.js" as="script" crossorigin="anonymous">
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v67327c56f0bb4ef8b305cae61679db8f1769101564043" integrity="sha512-rdcWY47ByXd76cbCFzznIcEaCN71jqkWBBqlwhF1SY7KubdLKZiEGeP7AyieKZlGP9hbY/MhGrwXzJC/HulNyg==" data-cf-beacon='{"version":"2024.11.0","token":"d11015b65d11429ea6b4a2ef37dd7e0b","server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
</body>
</html>