Изучение нового навыка может быть невероятно сложным. Наличие этих инструментов очень помогло мне, но я не знал о большинстве из них до середины моего буткемпа по программированию. Вот некоторые расширения, которые я использую в своей настройке, которые могут оказаться полезными для вас.

Проверка правописания кода

Хотя это кажется простым, это расширение обнаружило больше ошибок, чем любой другой инструмент, который я использую! Ваш код не сможет скомпилироваться, если вы введете calss вместо class — Code Spell Checker обнаружит эти небольшие опечатки, подчеркнув их в VS Code.

Автоматическое переименование тега

Если вам нужно переименовать тег HTML-элемента, это расширение позволяет одновременно редактировать как открывающий, так и закрывающий теги. Оно также работает с JSX, так что это расширение пригодится и с React!

Prettier — средство форматирования кода

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

Живой сервер

Live Server позволяет щелкнуть правой кнопкой мыши html-файл и открыть локальное окно браузера. Самое приятное то, что соединение активно — каждый раз, когда вы сохраняете файл, эти изменения видны в окне браузера без необходимости обновления.

Поддержка HTML CSS

Это расширение предлагает завершение кода и другие функции поддержки для написания HTML/CSS в VS Code — очень полезно!

Фрагменты кода JavaScript (ES6)

Это расширение невероятно полезно при изучении основ JavaScript. Он предоставит фрагменты кода, которые улучшат ваш рабочий процесс.

vscode-значки

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

Простые фрагменты реакции

Это расширение пригодится при изучении React. Я использую это расширение каждый день своей профессиональной жизни разработчика! Он предоставляет команды и фрагменты для быстрой настройки компонентов React.

GitLens

Это мощный инструмент, особенно для совместной работы — он покажет вам информацию об изменениях кода внутри вашего редактора. Очень удобно отслеживать коммиты.

Путь Intellisense

Предложения автозаполнения для путей к файлам. Вы будете много связывать и импортировать файлы в своих проектах — это расширение уменьшает количество ошибок в ваших путях.

Уценка все в одном

Большой процент вашей оценки зависит от наличия качественного README.md — это расширение помогает с подсветкой синтаксиса mardown, сочетаниями клавиш и автозавершением.

Где добавить расширения:

Нажав на значок расширений (пятый сверху), вы можете искать расширения в Marketplace.