Разработчик Марио Хойос составил подборку инструментов для разработчиков всех уровней подготовки. Каждая из представленных программ или надстроек (например, для Chrome или VS Code) призвана облегчить работу по написанию и отладке кода.

Читать далее

Расширения для Chrome

• WhatFont — простой способ определить, какие шрифты использованы на понравившемся сайте, чтобы применить в собственных проектах;
• Pesticide  — расширение для работы с тегом <div> и модификации CSS. Очень полезно при освоении блочной вёрстки;
• Colorzilla  — точно определяет и копирует прямо в буфер обмена цвета с веб-сайтов, избавляя от необходимости подбирать соответствующий rgba-формат;
• CSS Peeper  — инструмент для просмотра используемых на сайте цветов и цифровых объектов;
• Wappalyzer — позволяет узнать, какие фреймворки, системы управления контентом, инструменты аналитики и технологии использует сайт;
• React Dev Tools  — полезное расширение для отладки приложений на React.js;
• Redux Dev Tools  — средство отладки приложений, разрабатываемых с помощью Redux;
• JSON Formatter  — упрощает чтение JSON с помощью сворачиваемых блоков, направляющих линий, подсветки синтаксиса, кликабельных ссылок;
• Vimeo Repeat and Speed  — позволяет ускорить просмотр видео через сервис Vimeo для экономии времени. Полезен при просмотре видеоуроков.

Расширения для VS Code

• Auto Rename Tag — расширение для автоматического переименования HTML-контейнеров. При изменении открывающего тега автоматически изменяется и закрывающий;
• HTML CSS Support — поддержка CSS для HTML-документов с подсветкой синтаксиса и автодополнением кода;
• HTML Snippets — готовые фрагменты кода. В тандеме с набором плагинов Emmet способен значительно повысить продуктивность;
• Babel ES6/ES7 — добавляет подсветку синтаксиса в JavaScript Babel, упрощая ориентацию в коде;
• Bracket Pair Colorizer — подсвечивает открывающие и закрывающие скобки, что помогает легче находить границы блоков кода;
• ESLint — интегрирует ESLint в Visual Studio Code, проверяет и стиль кода, и потенциальные баги в процессе написания кода;
• Guides — добавляет вертикальные линии, которые помогают лучше ориентироваться во вложенности кода и не упускать скобки;
• JavaScript Console Utils — облегчает вывод отладочной информации в консоль;
• Code Spell Checker — простой инструмент проверки орфографии кода в стиле CamelCase;
• Git Lens — инструмент позволяет отслеживать, кто и когда внёс изменения в код;
• Path Intellisense — автоматически дополняет имя файла по мере его ввода в строку. Облегчает импорт из других файлов и навигацию по дереву файлов;
• Prettier — популярный плагин для автоматического форматирования кода и моментального приведения его к единообразному виду;
• VSCode-Icons — добавляет иконки в файловое дерево, что облегчает восприятие и поиск нужных файлов.

Программы для всех ОС

• Postman — мощный набор инструментов, который упрощает и ускоряет разработку, тестирование и отладку API.
• Insomnia — более доступная open-source альтернатива Postman, во многом повторяющая его функционал;
• Restlet — клиент для тестирования API, доступный в виде расширения для Chrome. Позволяет импортировать тесты Postman и некоторых других форматов;
• Charles — веб-прокси для мониторинга HTTP/HTTPS-трафика с возможностью качественной и быстрой отладки кода;
• Fiddler — аналог Charles. Существенно ускоряет и упрощает диагностику и устранение ошибок;
• Flux — автоматически переключает яркость монитора в зависимости от времени суток, чтобы беречь зрение.

Программы для Mac

• Paw — конкурент Postman и Insomnia, дизайн которого повторяет интерфейс нативных Mac-приложений;
• Dash — более 200 комплектов документации, доступных в автономном режиме;
• Bear — не связанное напрямую с программированием красивое и удобное приложение для создания заметок и записей;
• Magnet — практичный в использовании менеджер окон, который можно приобрести за 99 центов. Незаменим при отсутствии второг монитора, если нужно работать с несколькими окнами одновременно.

Программы для Windows

• ConEmu — удобный и бесплатный эмулятор терминала для Windows, позволяющий работать с несколькими вкладками;
• Ditto — расширяет возможности стандартного буфера обмена и даёт возможность сохранять несколько объектов сразу;
• TouchCursor — программа для управления курсором и выполнения других действий с помощью горячих клавиш. Позволит как можно реже задействовать мышь;
• Cmder — по словам создателей, «Cmder — это программный пакет, созданный из чистого разочарования из-за отсутствия хороших эмуляторов консоли в Windows»;
• Directory Opus — альтернативный файловый менеджер, гораздо более комфортный и функциональный, чем стандартный инструмент Windows;
• Zeal — приложение, включающее браузер API-документации и примеров фрагментов кода с возможностью поиска (аналог Dash для Mac).

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

Новый рекламный формат в наших телеграм-каналах.

Купить 500 символов за $150