Знали про такую интересую фичу Vs Code?

У каждого было такое, что хочется просто сосредоточатся на код, но разные фигни тебя отвлекают 🙄

Попробуй включить Zen Mode, а точнее режим Дзен. Он оставляет для вас исключительно область кода, чтобы вы могли сконцентрироваться на коде.

Чтобы включить — нажмите Ctrl+Shift+P и введите zen. Пробуйте 🤩

📣 Code Ready | #vscode

👩‍💻 Фишка для корпоративных разработок

Если вы уже владеете системой управления версиями, то вам будет полезно знать🙄

Режим отслеживания изменений между версиями позволяет удобно посмотреть как изменялся код

Включить можно в меню в верхней панели, также есть режим, который показывает блоки измененного кода 🤩

📣 Code Ready | #vscode

Удобная фукнция от VS Code 👨‍💻

VS Code позаботился об управлении контролями версий и содержит себе много фишек, связанных с git

Здесь показано, как можно удобно отменить последний коммит, всего лишь одной кнопкой

📣 Code Ready | #vscode

👩‍💻 Попробуйте построить свою диаграмму прямо в VS Code

Это можно сделать с помощью классного плагина Draw.io Integration, который позволяет строить множество различных диаграмм, связанных с вашим кодом рядом с проектом.

Для его работы необходимо установить плагин, после создать в нужной папке файл с расширением .drawio

📣 Code Ready | #vscode

👩‍💻 Знал ли ты, что можно открыть браузер прямо в VS Code?

Даже скачивать ничего не нужно, ведь всё уже встроено в редактор. Как и что можно настроить показано на видео выше от Miguel Ángel Durán

📣 Code Ready | #vscode

👩‍💻 Знаете как можно перенести html элементы в javascript всего одной командой?

Для этого есть плагин Selector Js, который предоставляет функционал из нескольких команд, позволяющих переносить html элементы по именам классов, id или имени тега.

Для его работы необходимо установить плагин, выделить нужный фрагмент html и выбрать подходящую команду.

📣 Code Ready | #vscode

👩‍💻 Знаете, как просматривать SVG, когда редактировать их не слишком удобно?

Для этого есть плагин SVG Previewer, который упрощает задачу и предоставляет удобный функционал при работе с svg файлами.

Он может помочь в изменении масштаба, фона, а так же размер самого файла.

📣 Code Ready | #vscode

👩‍💻 Если у вас проблемы с грамматикой, то плагин Code Spell Checker точно поможет)

Это расширение для VS Code, цель которого проверка орфографии, помощь выявить распространенные орфографические ошибки и поможет исправить их.

📣 Code Ready | #vscode

👩‍💻 Вот как быстро можно создать структуру кода с Html для Css

eCSStractor — это плагин для VS Code, который помогает разработчикам извлекать CSS-стили из HTML-файлов.

Он предоставляет инструменты для автоматического извлечения стилей из HTML-кода и создания соответствующих CSS-правил.

📣 Code Ready | #vscode

👩‍💻 А вы знали, что в VS Code можно делать свои заметки в коде?

Bookmarks — плагин, который позволяет создавать заметки прямо в коде, выделяя ключевые строки каждого файла вашего проекта.

Вы можете быстро перемещаться между помеченными местами и оставлять комментарии, чтобы не забыть важные детали.

Добавлять ярлыки можно с помощью команды Bookmarks: Toggle

📣 Code Ready | #vscode

😎 Если у вас проблемы с регулярными выражениями, а это достаточно сложная тема, то советую Explain RegExp.

Это плагин для VS Code, с помощью которого генерируются уникальные схемы для каждого регулярного выражения.

📣 Code Ready | #vscode

👩‍💻 Знаете, что в VS Code можно быстро генерировать фейковые данные для тестов с помощью плагина?

Faker — позволяет легко вставлять случайные имена, адреса, номера телефонов, даты и другие данные прямо в ваш код.

Очень удобно при разработке и тестировании, особенно если нужно наполнить макеты реалистичными значениями.

📣 Code Ready | #vscode

👩‍💻 Знаете, что в VS Code можно автоматически наводить порядок в коде по заданным правилам?

Prettier — плагин для VS Code, который форматирует ваш код по единым стандартам: ставит отступы, пробелы, переносы строк и даже следит за запятыми.

Работает с JavaScript, HTML, CSS и множеством других языков. Особенно полезен в командной разработке — один стиль на всех, меньше споров.

Без лишней суеты — сохраняете файл, и Prettier сам всё приводит в порядок.

📣 Code Ready | #vscode

👩‍💻 Знаете, что можно визуализировать историю Git прямо внутри VS Code?

Git Graph — мощный плагин, который показывает древовидную структуру коммитов в виде наглядной граф-схемы: ветки, слияния, история — всё как на ладони.

Особенно удобен, если работаете в нескольких ветках или сопровождаете чужой проект — сразу видно, что где происходило.

📣 Code Ready | #vscode

👩‍💻 Работаете с SQL и устали прыгать между рабочими пространствами?

SQLite3 Editor — минималистичный, но мощный плагин для VS Code, который позволяет прямо внутри редактора создавать, просматривать и редактировать SQL-базы.

Идеален для быстрой отладки, прототипов и локальной аналитики.

📣 Code Ready | #vscode

👩‍💻 Знаете, что в VS Code можно рисовать схемы и проектировать архитектуру прямо в редакторе?

Excalidraw — плагин, с которым можно создать чистое полотно, рисовать фигуры, стрелки, писать текст и визуализировать логику приложения без сторонних инструментов.

Идеально, если нужно накидать структуру БД, связи между модулями или продумать архитектуру на лету — прямо в процессе работы.

📣 Code Ready | #vscode

👩‍💻 Знаете, что в VS Code можно сразу увидеть, насколько «тяжёлый» каждый импорт?

Import Cost — показывает, сколько килобайт добавит та или иная библиотека. Особенно полезно новичкам: помогает следить за производительностью, избегать тяжёлых зависимостей.

Можно наглядно понять, где стоит использовать точечный импорт и как не раздуть приложение лишним весом.

📣 Code Ready | #vscode

👩‍💻 Слышали, что в VS Code ваши Markdown-таблицы могут выглядеть аккуратными и понятными прямо в исходном коде?

Markdown Table Prettifier — плагин, который автоматически форматирует таблицы в тексте. Очень удобно: сразу видно, как выглядит таблица, без постоянного переключения на превью.

Особенно помогает при написании документации и любых текстов с таблицами — комфортно и быстро.

📣 Code Ready | #vscode