Расширения Chrome и VS Code для бэкенд-разработчиков

0
1196
views
Photo by Christina Morillo from Pexels

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

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

В этой статье мы рассмотрим расширения, которые вы можете установить в браузер Chrome или Firefox или в редактор VS Code.

Расширения Chrome для бэкенд-разработчиков

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

1. JSON Formatter — визуализация JSON

Пользователей: 1,000,000+

Рейтинг: 4.6/5

JSON Formatter помогает программистам визуально.

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

Поэтому JSON Formatter форматирует сырые данные JSON, придавая им древовидную форму и делая их человекочитаемыми.

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

Можете попробовать это расширение сами на следующем запросе к Facebook API.

Альтернативные расширения

  • JSON Viewer: инструмент для просмотра JSON и JSONP с большим количеством настроек
  • JSONView: браузерный инструмент для просмотра и валидации JSON. Использует реализацию фронтенда JSONLint.

2. Daily.dev — агрегатор новостей мира технологий

Пользователей: 100,000+

Рейтинг: 4.8/5

Расширение Daily.dev не улучшит вашу рабочую рутину. Но все равно это отличное расширение, помогающие следить за новостями, касающимися разработки.

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

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

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

Альтернативные расширения

30 Seconds of Knowledge: при каждом открытии новой вкладки расширение выдает советы по программированию с маленькими сниппетами кода.

3. Octotree — GitHub на стероидах

Пользователей: 400,000+

Рейтинг: 4.9/5

Многие описывают Octotree как «GitHub на стероидах». Бесплатная версия этого расширения позволит вам быстро обозревать содержимое проектов в режиме, схожем с просмотром проекта в IDE. Кроме того, вы сможете кликать на import или require, чтобы просматривать зависимости.

Обратите внимание, что это расширение можно использовать и для приватных репозиториев. Для этого нужно ввести ваш токен аутентификации на GitHub.

Платная версия имеет куда больше функций. Например, просмотр в нескольких вкладках, поиск по всему проекту, режим для более удобного код-ревью. Больше информации о платной версии можно найти на сайте Octotree.

Альтернативные расширения

  • Sourcegraph: добавляет функцию «умного кода» для GitHub, GitLab и др. хостов. Поддерживает больше 20 языков.
  • Enhanced GitHub: показывает размер репозитория и файлов, ссылку на скачивание и возможность копировать содержимое файла.

Расширения VS Code для бэкенд-разработчиков

А вот три расширения для редактора.

4. VS Code Remote Containers

Пользователей: 5,395,555

Рейтинг: 4.8/5

Расширение Remote Containers позволяет использовать контейнер Docker в качестве полнофункциональной среды разработки. Таким образом, можно заниматься разработкой, не беспокоясь о том, как это повлияет на вашу локальную систему.

Хотите поэкспериментировать с настройками? Можно безопасно сделать это в контейнере.

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

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

Внутри контейнера устанавливаются и запускаются расширения, дающие полноценный доступ к инструментам, платформе и файловой системе. Мы сможете работать в VS Code, как если бы все было запущено локально на вашей машине — хотя на самом деле все будет надежно изолировано в контейнере.

5. Code Spell Checker — проверка грамматики для кода

Пользователей: 3,193,039

Рейтинг: 4.5/5

Code Spell Checker помечает любые грамматические ошибки в коде. Лучше всего это расширение работает с кодом в camelCase. Возможно, вам любопытно, зачем вообще нужно проверять ошибки?

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

Несколько вещей, которые стоит учесть при использовании этого расширения:

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

6. Path Intellisense — автодополнение имен файлов

Пользователей: 5,395,555

Рейтинг: 4.8/5

Path Intellisense автоматически дополняет имена файлов при их импорте. Расширение работает с большинством языков программирования, а также с HTML. Для маппинга используется ts.config.compilerOptions.baseUrl в конфигурации вашего редактора.

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

{
    "path-intellisense.mappings": {
        "/": "${workspaceFolder}",
        "lib": "${workspaceFolder}/lib",
        "global": "/Users/dummy/globalLibs"
    },
}

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

Бонус: отслеживаем технический долг прямо в редакторе

Попробуйте расширение Stepsize VS Code, разработанное нашей командой! Stepsize — это issue-трекер в редакторе. С его помощью можно:

  • создавать issue в редакторе
  • расставлять приоритеты в техническом долге (совместно с командой)
  • добавлять ключевые issue в спринты (при интеграции с Jira).

Надеемся, наше расширение вам понравится!

Перевод статьи «6 Chrome & VS Code Extensions For Backend Developers».

ОСТАВЬТЕ ОТВЕТ

Please enter your comment!
Please enter your name here