Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Sublime Text
Webdesign

Простые визуальные изменения для лучшего программирования в Sublime Text

by
Length:ShortLanguages:

Russian (Pусский) translation by Alexander Sergeyevich (you can also view the original English article)

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

Настройки

Sublime Text "из коробки" предлагает огромное количество настроек, визуально меняющих редактор, но большинство по умолчанию отключены. Вот несколько, без которых я не представляю свой редактор.

Важно: Для того, чтобы редактировать настройки Sublime Text найдите в меню Sublime Text 2 > Preferences > Settings - Default и выберите нужные.

sublime-settings

Найдите настройки, которые вы хотите изменить и добавьте их в User Settings чтобы они не удалились при обновлении редактора.

sublime-settings-2

Более подробно об основах работы с Sublime Text вы можете прочитать в статье Installation and Base Settings.

Шрифты и отступы

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

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

“font_face”: “Inconsolata";
"font_size": 18;
"line_padding_bottom": 1,
"line_padding_top": 1,

highlight_line

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

"highlight_line": true,

highlight_modified_tabs

Эта настройка подсветит вкладки с измененными файлами, чтобы привлечь к ним дополнительное внимание.

"highlight_modified_tabs": true,

fade_fold_buttons

А вы знали, что Sublime Text позволяет сворачивать фрагменты кода? Я знал, но все время забывал об этом, из-за этой настройки. Выключите ее и стрелочки никогда больше не будут исчезать.

"fade_fold_buttons": false,

word_wrap

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

"word_wrap": true,

bold_folder_labels

В саблайме есть несколько отличных настроек, чтобы расставить акценты в боковой панели. Начнем с bold_folder_labels, которая выделит все директории жирным.

"bold_folder_labels": true,

Показывать открытые файлы в боковой панели

Странно, но это нельзя установить в конфигурационном файле. Вместо этого нужно выбрать такую настройку в меню:

View → Side Bar → Show Open Files

Выровнять боковую панель

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

sublime-visual-sidebar

Плагины

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

BracketHighlighter

Bracket highlighter это плагин, который подсвечивает парные теги и скобки (да ладно!) Но и тем не менее, это очень полезный инструмент, который показывает вам начало и конец той части кода, в которой находится курсор. Тип скобки отображается сбоку в виде разных иконок.

sublime-visual-brackethighlighter-2

Git Gutter

Один из моих любимых плагинов. Git gutter это простой плагин, который отображает иконки около номеров строк, которые показывают было ли что-то добавлено, изменено или удалено по сравнению с вашим git-проектом.

sublime-visual-gitgutter-2

SublimeLinter

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

sublime-visual-sublimelinter-2

Темы и цветовые схемы

Самая гибкая персонализация в Sublime Text возможна с помощью тем и цветовых схем. На данный момент существуют сотни различных вариантов и каждую неделю появляются новые. Вот несколько стоящих.

Тема: Soda

Soda стала самой популярной темой и самым лучшим примером кастомизации среди любителей Sublime Text. Существует огромное количество форков этого проекта. Soda предлагает несколько дополнительных настроек, вся графика оптимизирована под retina-экраны, также существуют темный и светлый варианты.

sublime-visual-soda-2

Тема: Flatland

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

Тема: Spacegray

Моя любимая тема, в том числе набирающая популярность на GitHub – Spacegray. Эта тема может похвастаться уникальными цветами и невероятно минималистичным интерфейсом.

sublime-visual-spacegray

Цветовая схема: Solarized

Довольно-таки известный проект Solarized доступен и для Sublime Text. Этот проект позиционируется как "аккуратные и точные цвета для машин и людей" и использует большое количество положений из теории цвета.

Цветовая схема: Base16

Base16 – это еще одна популярная цветовая схема с большим количеством настроек (я в данный момент использую именно ее).

Вывод

Как же много всего еще стоит рассмотреть! Не забудьте, что имеет смысл переработать очень много разных элементов Sublime Text в процессе кастомизации. Не верьте мне на слово, поизучайте GitHub и Package Control, попробуйте какие-нибудь другие настройки и вы поймете, что вам больше подходит. Не забывайте периодически "подкручивать" что-нибудь, чтобы ваш навык программирования не стоял на месте.

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

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.