Всем привет! На самом деле каждому своё и выбрать какой-то один редактор кода из нескольких самых популярных довольно сложно. У каждого свои предпочтения и потребности. Кому-то достаточно и стандартного блокнота (да, я лично знаю таких людей🙄). А кому-то подавай редактор с плагинами "из коробки".
Есть 4 самых популярных редакторов кода:
- Sublime Text
- VS Code
- Atom
- WebStorm
Далее мы разберём какие расширения и дополнения доступны в каждом редакторе из коробки, в каких редакторах необходимо самостоятельно усстановить нужные плагины и тд.
1. Sublime Text
На момент написания статьи уже выпущена 4 версию редактора. Скачать его можно с официального сайта здесь.
Для Sublime Text 3 написано множество пакетов, которые делают работу в редакторе более комфортной.
Для того чтобы добавить пакет, нужно открыть интерфейс для ввода команд. Сделать это можно через пункт меню Tools → Command Palette или вводом горячих клавиш command (control) + shift + p. После этого в интерфейсе для ввода команд нужно выбрать пункт Package Control: Install Package
После этого программа покажет список пакетов. Здесь можно выбрать и установить нужный пакет. Посмотреть подробное описание каждого расширения для Sublime Text 3 можно на сайте Package Control.
Пакеты бывают нескольких типов.
Ускоряющие разработку:
- Emmet. Плагин, ускоряющий написание разметки и стилей.
- BracketHighlighter. Дополнительно добавляет подсветку границ скобок, элементов и прочего. Помогает лучше ориентироваться в коде.
Добавляющие функциональность:
- SideBarEnchacements. Увеличивает количество действий, которое можно сделать в боковой панели при работе с файлами и папками.
- SublimeCodeIntel. Делает редактор «умнее». Добавляет автодополнение для разных языков и другие полезные возможности.
- EditorConfig. Полезный пакет для настройки параметров редактора.
Проверяющие синтаксис:
Сперва для редактора следует установить пакет SublimeLinter. Также на компьютере должен быть установлен Node.js. После этого нужно установить интересующие плагины для проверки. В большинстве они называются SublimeLinter-нужный пакет. Например:
- SublimeLinter-eslint. Проверяет JavaScript-код. Для работы нужно глобально установить npm-пакет eslint. Подробнее в инструкции по ссылке.
- SublimeLinter-stylelint. Проверяет CSS. Для работы нужно глобально установить npm-пакеты: postcss и stylelint.
Изменяющие внешний вид:
Если недостаточно стандартных встроенных тем, то можно установить дополнительные. Примеры тем можно посмотреть на официальном сайте.
2. VS Code
Абсолютно бесплатный редактор кода от Microsoft. Скачать можно с официального сайта здесь.
VS Code в базовой версии содержит большое количество плагинов. К примеру, консоль, emmet и мини-карта в нём присутствуют с самого начала. Добавить новые пакеты можно через интерфейс программы. Для этого во вкладке активного меню нужно выбрать пункт extensions и в поле ввода ввести интересующий плагин. После этого его можно установить.
Посмотреть список популярных плагинов можно через интерфейс редактора, либо на официальном сайте. Рассмотрим ряд полезных плагинов, которые могут помочь при разработке. Условно их можно разделить на несколько типов.
Добавляющие функциональность:
- Project Manager — добавляет редактору возможность работать с несколькими проектами.
- Settings Sync — синхронизирует настройки и установленные плагины между программами на разных компьютерах.
- Beautify — форматирует текст по заданным настройкам и приводит его к единообразию.
Проверяющие синтаксис:
- ESLint — проверяет JavaScript код по заданным параметрам.
Изменяющие внешний вид:
- Vscode-icons — заменяет стандартные иконки файлов.
3. Atom
Приятный на вид, кроссплатформенный бесплатный редактор. Имеет встроенную интеграцию с Git и GitHub. Скачать с официального сайта можно здесь.
Для того чтобы установить пакет в Atom, нужно перейти в настройки редактора и выбрать пункт Install. После этого в поле ввода нужно ввести название интересующего расширения.
Список популярных расширений можно посмотреть на официальном сайте.
Условно плагины можно разделить на несколько типов.
Ускоряющие разработку:
- Emmet. Плагин, ускоряющий написание разметки и стилей.
Добавляющие функциональность:
- Minimap. Добавляет поддержку миникарты в Atom.
- PlatformIO IDE Terminal. Встраивает терминал в редактор.
- Atom-Beautify. Форматирует текст по заданным настройкам и приводит его к единообразию.
- Editorconfig. Полезный пакет для настройки параметров редактора.
Проверяющие синтаксис:
Для того чтобы редактор мог подсвечивать найденные ошибки, нужно установить плагин Linter. После этого нужно выбрать плагин, который добавляет проверку для конкретного языка. Например:
- linter-eslint. Проверяет JavaScript-код.
- linter-stylelint. Проверяет CSS.
Изменяющие внешний вид:
- File Icons — заменяет стандартные иконки файлов.
4. WebStorm
Продукты JetBrains являются полноценными интегрированными средами для разработки. При минимальной настройке редакторы обладают большим количеством возможностей, на изучение которых нужно время. Базово имеет интеграцию с системами контроля версий, есть отладчик кода, статически анализирует содержимое проекта и в случае ошибок указывает на них.
Продукт платный и доступен к использованию по подписке, установить и оформить подписку можно здесь. Каждый из продуктов отвечает за определённую сферу. WebStorm, к примеру, больше подходит для фронтенд-разработки, а PHPStorm — для написания серверного кода на языке PHP.
Из коробки редактор поддерживает большинство возможностей, которые рассматривались в этой статье. Однако, при необходимости можно обогатить функциональность программы через добавление расширений.
Это можно сделать через Настройки → Plugins. В этом меню отобразятся все плагины, которые установлены в программе.
Установить новые можно через пункт Install Jetbrains plugin. Из интересных можно выделить:
Так какой же редактор выбрать?
У каждого из рассмотреных редакторов кода есть свои особенности и преимущества. И все же, при выборе редактора, стоит основываться на поставленных задачах, для которых он нужен.
Если необходима скорость работы, то лучшим выбором я бы назвал Sublime Text. Тем более, что он потребляет меньше всех ресурсы компьютера.
Если вы больше цените удобство и совсем новичек в разработке, то я бы посоветовал Atom. У него довольно приятный интерфейс и хорошо работает интеграция с Git и GitHub.
Для опытных же разработчиков отличным выбором будет WebStorm. Он требует минимальных настроек и обладает огромной функиональностью.
Есть ещё VS Code. С ним всё проще. Он является некой серединой среди всех остальных редакторов кода. Обладает множеством возможность "из коробки", а также довольно прост, интуитивен и понятен. И работает быстро.
Делитесь в комментариях какой редактор всё же выбираете именно Вы. За подписку благодарочка😎
Не забудьте посмотреть эту статью:
