10 инструментов, которые упростят жизнь веб-разработчика

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

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

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

1. ColorZilla  —  2 000 000+ пользователей

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

2. CSS Peeper  —  100 000+ пользователей

С этим расширением найти элемент и его стили на странице стало намного проще, чем с помощью встроенного инструмента Inspect Element. Единственное, чего не хватает CSS Peeper,  —  функция редактирования страницы, которая есть у его стандартного аналога. Это позволило бы увидеть, какие изменения необходимо внести в серверную часть сайта.

3. Windor Resizer  —  600 000+ пользователей

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

4. Clear Cache  —  800 000+ пользователей

Clear Cache  —  мое любимое расширение для браузера Chrome. Я даже уже не использую кнопку перезагрузки по умолчанию или ее параметры: «принудительная перезагрузка» или «очистка кеша и принудительная перезагрузка». Плагин удаляет историю, куки, пароли и т. д. Он бесплатный и работает отлично. Мне больше не нужно копаться в настройках в поисках кнопки удаления истории или файлов cookie. Я могу сделать это в один клик.

5. Wappalyzer  —  1,000,000+ пользователей

Wappalyzer  —  это один из лучших инструментов в моем повседневном наборе. С его помощью можно узнать о веб-технологиях, используемых на сайте. Я легко могу сказать, когда приложение написано на AngularJS, React, Meteor, Backbone, FireBase и Django.

6. User Javascript and CSS  —  70 000+ пользователей

Этот плагин позволяет запускать пользовательские JavaScript и CSS на любых сайтах. Он также отлично подходит для создания прототипа собственного расширения или виджета для веб-сайтов. А еще с помощью него я легко могу отладить JavaScript на сайтах клиентов.

7. ScreenShot Capture & Editor Tool  —  200 000+ пользователей

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

8. Whatfont  —  1 000 000+ пользователей

Если вы веб-дизайнер или программист, для вас этот инструмент станет бесценной находкой. Прошли те дни, когда надо было щелкать правой кнопкой мыши, чтобы просмотреть исходный код, а потом скроллить до нужной строчки. WhatFont показывает точную информацию о любом шрифте, на который вы наводите курсор: название, размер, цвет и т. д.

9. Toggl Track  —  300 000+ пользователей

Раньше я сходил с ума, пытаясь подсчитать все свои рабочие часы. Теперь Toggl Track помогает мне отслеживать время, потраченное на различные задачи из Freshdesk, Todoist, Jira и Confluence, которые я использую каждый день.

10. AdBlock  —  10 000 000+ пользователей

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

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

Читайте также:

Читайте нас в Telegram, VK и Яндекс.Дзен


Перевод статьи Josef Cruz: I Wish I Had Known These Tools When I Started Coding

Предыдущая статьяString и string в С#: больше, чем просто стиль?
Следующая статьяGo. Прорабатываем 25 основных вопросов собеседования