Представьте: вы погружены в код, но каждые пять минут вам приходится переключаться между вкладками — то проверить JSON, то отформатировать CSS, то найти ошибку в консоли. Знакомо? Браузер для программиста — это как мастерская: если в ней нет подходящих инструментов, даже простая задача превращается в квест. Хорошая новость: Google Chrome может стать вашим верным помощником, а не источником головной боли. Нужно только добавить пару расширений.
В этой подборке — не просто «ещё один список плагинов». Здесь только те инструменты, которые реально экономят время, спасают от рутины и даже помогают с CEO оптимизацией. Например, расширение, которое за секунды покажет какой шрифт, или какие CEO теги использованы на странице. А ещё — штуки, о которых вы, возможно, не слышали, но они уже покорили GitHub.
1. Vimium
Vimium придуман для управления браузером с клавиатуры и используют некоторые идеи vim (но без мучений «как отсюда выйти»). Нажимаешь сочетание клавиш - и рядом с каждым кликабельным элементом появляется буквенное сочетание для перехода по нему.
Vimium поддерживает повторение команд, поэтому, например, нажатие "5t" откроет 5 вкладок в быстрой последовательности. ESC (или <c-[>) очистит все неполные команды в очереди, а также завершит режимы insert и find.
2. daily.dev | The homepage developers deserve
Получите единый персонализированный канал для получения всех знаний, необходимых вам как разработчику. Вы когда-нибудь мечтали о вкладке, которая поможет вам оставаться впереди в постоянно меняющемся мире технологий? В этом вам поможет расширение daily.dev, которое заменяет вашу домашнюю страницу браузера на новостной блок, с новостями, которые вам интересны.
daily.dev - это платформа с открытым исходным кодом, которая держит вас в курсе событий без необходимости рыскать по Интернету в поисках последних обновлений для разработчиков.
3. Talend API Tester - Free Edition
Способы, которыми он облегчает жизнь:
1. Отправляйте запросы и проверяйте ответы Talend API Tester - бесплатная версия обрабатывает все HTTP-запросы, независимо от их сложности. Запросы можно сделать динамическими, вставив переменные. Полностью поддерживаются безопасность и аутентификация, а также гипермедиа и HTML-формы. Вы можете визуализировать, улучшать и проверять HTTP-ответы.
2. Проверить поведение API. Независимо от того, хотите ли вы проверить, что ваш API работает так, как указано, или вам нужно подтвердить, насколько хорошо реагируют сторонние API, Talend API Tester позволяет выполнять множество видов тестов ответа API. Используйте утверждения для проверки значений заголовков, частей тела или времени отклика, среди прочего. Переменные среды также могут быть созданы для повышения возможности повторного использования ваших тестов.
4. Google Переводчик
Это расширение добавляет кнопку на панель инструментов вашего браузера. Нажмите значок перевода, когда вы хотите перевести посещаемую вами страницу. Расширение также автоматически определяет, отличается ли язык страницы, на которой вы находитесь, от языка, который вы используете для своего интерфейса Google Chrome. Если это так, в верхней части страницы появляется баннер. Нажмите кнопку «Перевести» на баннере, чтобы весь текст на странице отображался на новом языке.
Так как наибольшее количество информации написано на английском языке, программистом приходится непросто при поиске решения проблемы или при чтении документации на английском, если не знаешь этот язык. Тут на помощь приходит это расширение, котором помогает с переводом важных страниц и нужной информации.
5. Octotree - GitHub code tree
Называет себя «GitHub на стероидах», то есть смысл в том, чтобы дать сервису дополнительные возможности. Самая заметная из них — слева появляется дерево файлов и каталогов:
Особенности:
- Быстрое дерево кода в стиле IDE;
- Быстрый поиск в формате дерева;
- Закладки для репозиториев, проблем, PR, файлов;
- Поддержка тем GitHub;
- Поддержка частных репозиториев;
- Высокая производительность, работа с репозиториями любого размера.
6. Web Developer
Целый набор полезных инструментов для управления элементами сайта — например, для анализа веб-ресурсов и макетов, тестирования кода и мгновенного изменения параметров и внешнего вида страницы.
7. PerfectPixel by WellDoneCode (pixel perfect)
PerfectPixel — расширение для Google Chrome. Оно позволяет «наложить» на веб-страницу полупрозрачную сетку и сверять по ней заданные расстояния.
Можно накладывать и другие изображения — например, первоначальный макет — чтобы убедиться, что получившаяся страница в точности ему соответствует.
Ключевые особенности:
- Интуитивное понятное управление;
- Адаптация и кроссплатформенность под любой браузер.
8. Wappalyzer - Technology profiler
Wappalyzer — это кроссплатформенное расширение для браузера с открытым исходным кодом, которое раскрывает технологии, используемые на конкретном веб-сайте. Это расширение автоматически идентифицирует приложения для веб-служб, фреймворков JavaScript, управления контентом, виджетов, платформ электронной коммерции, генераторов, серверного программного обеспечения, баз данных, инструментов аналитики и многое другое.
Призван показывать, какие технологии используются сайтом (от языков до систем аналитики).
9. WhatFont
WhatFont — простое, но элегантное расширение для Google Chrome. Данное расширение позволяет разработчикам быстро определить шрифты, используемые на определенном веб-сайте. Всё, что нужно, это навести курсором мыши на контент и вы увидите всплывающие окно с информацией о шрифтах.
10. META SEO inspector
Как видно из названия, ориентировано на сеошников, но думаю, может пригодиться не только им.
Это расширение в основном предназначено для веб-разработчиков, которым необходимо проверить HTML-код своего сайта на соответствие рекомендациям Google для веб-мастеров, но также и для тех, кому интересно содержимое страницы, которое обычно не видно, но может раскрыть интересные свойства сайта.
Заключение
На этом всё, спасибо, что уделили время. Надеюсь вы нашли для себя что-то полезное и что-то, что давно искали. Конечно, тут я собрал не все самые "крутые" и популярные расширения, я лишь поделился расширениями, которые пробовал сам, но если вы считаете, что я упустил какой-то инструмент, можете оставить комментарии. Заодно поделитесь своим опытом использования расширений: пробовали ли что-то из этого или есть что-то другое? Будет круто, если расскажете подробно об их использовании — обсудим в комментариях.