Sublime text 3. Подробное введение

Редактор неимоверно быстрый, что делает работу приятнее и легче.  У редактора огромное количество преимуществ:

1. Автоотступы.
2. Подсветка синтаксиса.
3. Настраиваемый интерфейс.
4. Работает шустро.
5. Бесконечное множество плагинов.
6. Макросы.
7. Распознает типы файлов.
8. Легко связать с системой git и не только

Теперь приступим к установке редактора

Установка редактора

Установить этот редактор можно с официального сайта по ссылке — http://www.sublimetext.com/

Sublime Text 3 спокойно поддерживается на:

• linux
• MacOs
• Windows

Windows. Установка

Установка самая обычная и простая. На главном экране нажимаем на кнопку download, но если у вас не windows, то переходите по ссылке changelog и выбираете свою операционную систему и смотрите инструкцию ниже.

После выбираете путь, куда собираетесь скачать установщик. После заходите к установщику, и выбираете уже то место, куда будет установлена программа. Весь процесс займет минут 5-10.

Linux. Установка

Установить редактор на дистрибутивы linux будет уже не так просто, поэтому просто повторяйте за инструкцией ниже.

1. Необходимо использовать командную строку, чтобы установить пакеты редактора sublime text 3. Для установки необходимо ввести следующую команду: sudo add-apt-repository ppa:webupd8team/Sublime-Text-3
2. После необходимо обновить уже установленные пакеты. Делается это тоже с помощью команды: sudo apt-get update
3. Ну и последний шаг, сейчас нужно установить хранилище Sublime Text 3. Команда: sudo apt-get install Sublime-Text

Готово, если все шаги выполнены правильно, то вы сможете увидеть в списке программ Sublime-Text.

OS X. Установка

Теперь, что касается установки на Мак.

1. Загружаете файл с расширением .dmg.
2. Открываете его и переносите в папку «приложения».
3. Запускаете программу.

Как видите, ничего сложного в установке нет. Ну а теперь, когда Sublime установлен, нужно его настроить.

Настройка редактора

При открытии sublime у разных людей будут разные эмоции, ведь как говорится «на вкус и цвет товарища нет», тоже самое и здесь. Но редактор можно идеально подстроить под себя, этим и займемся.

Для начала можно выбрать более комфортную для вас тему. Делается это через Preferences — Color Scheme. Но на этом весь процесс настройки не заканчивается.

Более подробно настроить Sublime Text 3 можно перейдя в раздел настройки Preferences — Settings. Теперь возможностей куда больше. И так, левое окно с тонной текста трогать не нужно, это настройки по умолчанию, а вот правое окно нужно для кастомизации.

Кастомизацию можно провести методом добавления своих собственных настроек. Вот настройки, которые можно применить:

• color_scheme — тема sublime text 3. Кстати, можно выбрать дефолтные, а можно загрузить собственные, делается это путем занесения темы в папку Packages/Color Scheme — Default/.
• font_face — шрифт текста. Можно установить любой шрифт, который есть у вас в операционной системе. Имеющиеся шрифты можно посмотреть в папке fonts, найти её можно через поиск в меню “пуск”, либо посмотрите их через любой текстовый редактор.
• font_size — размер шрифта. Размер можно задать целым числом или дробным.
• font_options — Это настройки начертания текста. Можно поставить «no_light», либо «no_bold».
• word_separators — Помогает разделять слова.
• line_numbers — Самая обычная нумерация строк кода. Можно настроить.
• gutter — С помощью этой настройки выбираете, скрывать ли панель с номерами строк и закладками.
• margin — От панели с нумерациями можно отодвинуться с помощью этой команды.
• fold_buttons — Можно навести курсор на канавку и увидеть треугольные стрелки, с помощью которых можно скрывать или показывать код между фигурными скобками. Так вот, здесь их можно включить или выключить.
• fade_fold_buttons — Все треугольные стрелки не будут скрываться, если через эту команду поставить значение false.

Вот такие настройки, с ними можно долго экспериментировать, но теперь перейдём к пункту настройки клавиш.

Настройка клавиш

В Sublime Text 3 есть отличная возможность настроить сочетания клавиш. Это ещё раз доказывает, что Sublime — это полностью настраиваемый редактор кода.

Теперь к настройке клавиш. Для настроек клавиш необходимо перейти в Preferences — Key Bindings.
После открывается снова два файла, но, как и в предыдущем примере, левое для настроек по умолчанию, вы также можете их поменять, а правое для ваших собственных.

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

Установка Package control

Ранее в преимуществах было упомянуто, что у редактора очень много различных плагинов. Они все разнообразные и могут облегчить местами написание кода, например, подсвечивать синтаксис, делать из сокращений полноценные фрагменты кода, позволять работать с системами типа git и так далее.

Но для установки всей этой прелести потребуется компонент, который называется Package control.
Вообще, различные модификации можно ставить и вручную, через код, но куда проще это делать через поисковую строку в Package control.

Теперь к установке:

1. И так, устанавливаем компонент через официальный сайт. Кстати, с самого сайта никакого файла загружать не надо. Нужно скопировать текст из поля с актуальной версией Sublime Text.
2. Теперь необходимо перейти в Sublime Text, а после нажать сочетание клавиш «Ctrl» + «~». Этим сочетанием открывается командная строка редактора.
3. Вставляете ту строку, которую скопировали с официального сайта. Начнется установка компонента.
4. После успешной установки перезагрузите Sublime.

Готово, теперь можно легко и просто устанавливать любые плагины.

Установка плагинов. Практика

Установщик плагинов есть, а значит можно приступить к установке расширений, но каких? Дальше будет список 13 неплохих плагинов, но для начала нужно научиться пользоваться package control.

Для практики установим модификацию Material Theme, а после настроем её:

1. Запустите Package control сочетанием клавиш «Ctrl» + «Shift» + «P», далее из списка результатов выберите пункт Package Control: Install Package.
2. После вводите в поиск название расширения, в данном случае Material Theme.
3. Нажимаем Enter и ищем в результатах поиска плагин. После нажатия на плагин разрешаем установку ещё одного плагина.

Расширение установлено, теперь тему нужно применить. Для этого нужно перейти в настройки Preferences — Color Scheme — Material Theme — Schemes. А дальше выбираете тему, которая понравилась. Вот и вся установка.

Список полезных плагинов

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

Emmet

Очень полезный плагин для верстальщиков, так как делает из сокращенных выражений на html/css полные фрагменты кода. Например, если написать html и нажать tab, то он создаст полноценную разметку для html документа.  Кстати, в прошлом плагин назывался Zen coding.

JavaScript & NodeJS Snippets

Тот же emmet, только для JavaScript и NodeJS. Также повышает скорость работы. Пример работы, document.querySelector(‘selector’); можно не вводить, а вести всего лишь два символа qs, после нажать кнопку табуляции и всё.

Git

Наверно уже поняли из названия, о чем плагин. Верно, он позволяет работать с системой git. Этот плагин сэкономит немалое количество времени, хотя бы потому, что вам не нужно бегать от sublime до git и наоборот, так как всё это можно делать в редакторе. В плагине есть отличные автокомплит, который вызывается методом вписания -add. Так же нельзя не упомянуть про команду quick, которая добавляет изменения и коммитит их.

GitGutter

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

Sidebar Enhancements

Благодаря этому плагину можно сделать свой левый сайдбар более многофункциональным и полезным. Есть очень много полезных фишек, и одна из них, это «открыть в браузере»‎.

BracketHighlighter

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

ColorPicker

Небольшое отдельное окно для выбора цвета. Мелочь, но пригодится. Кстати, цвет можно выбрать прямо на экране с помощью инструмента «пипетка». Цвета можно выбирать из палитры в hex-формате.

EditorConfig

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

Placeholders

В sublime text 3 можно добавлять текст lorem-ipsum. Плагин Placeholders пошёл дальше, теперь можно вставлять не только текст, но и макетные изображения, а также таблицы, списки, формы.

DocBlockr

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

Floobits

Позволяет работать сразу нескольким разработчикам в одном коде. И это можно делать в разных редакторах, таких как Vim, Emacs, SublimeText IntelliJ IDEA.

SublimeCodeIntel

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

Colorcoder

Подсветка переменных и прочих элементов в коде для более легкой ориентации.

Итог

Любой редактор кода, это всего лишь прокачанный блокнот. Где есть много функций предназначенных для кодера. И sublime является одним из таких блокнотов. Он полностью настраиваемый и быстрый. То, что нужно для эффективной работы.