Вы можете подумать, что магия – это просто детские сказки или шоу Дэвида Копперфильда в Лас-Вегасе. Однако, как разработчики, мы знаем, что настоящая магия заключается в написании аккуратной строки кода, решении сложной проблемы или просто в ускорении загрузки веб-страницы. Но что, если я скажу вам, что настоящее волшебство, настоящая «абракадабра» заключается в инструментах, которые мы используем каждый день?

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

1. ЕСЛинт

ESLint — это подключаемый и настраиваемый инструмент линтера для выявления шаблонов, обнаруженных в коде ECMAScript/JavaScript, и составления отчетов о них. Поддерживая согласованность кода и обнаруживая ошибки еще до выполнения, ESLint может избавить вас от бесчисленных головных болей.

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

2. Красивее

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

Вот пример фрагмента кода до и после Prettier:

До:

function HelloWorld({greeting="hello", greeted="World", silent=false, onMouseOver,}){

}

После «Prettier»:

function HelloWorld({ greeting = "hello", greeted = "World", silent = false, onMouseOver }) {}

3. ГитЛенс

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

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

4. Анализатор пакетов веб-пакетов

Webpack Bundle Analyser — это плагин для Webpack, который визуализирует размер ваших пакетов с помощью интерактивного…