Есть на свете замечательный редактор, который очень хорошо подходит для работы веб-девелоперов. Называется он «Komodo Edit». И есть не менее замечательная концепция создания кода под названием «Zen Coding», которая позволяет на порядки ускорить работу с HTML и CSS кодом. О том, как установить Komodo Edit в Ubuntu и настроить его для работы в режиме Zen Coding, я и расскажу в этой статье.

Перед тем, как начать, скажу пару хвалебных слов про Komodo Edit. Это первый редактор под Linux, в котором я увидел полноценное автодополнение HTML-тегов и их атрибутов. И это первый редактор, который можно назвать достойным аналогом Adobe Dreamweaver в Linux.
К сожалению, в репозиториях Ubuntu редактор Komodo Edit отсутствует. Отсутствует и PPA на Launchpad, с которого его можно было бы установить. Также не получится скачать на оф. сайте deb-пакет, здесь предлагают к скачиванию только tar.gz-архив. И тем не менее, есть способ установить Komodo Edit в Ubuntu стандартным способом, а недавно даже появился неофициальный репозиторий, из которого это можно сделать.
Нижеописанные (скрытые под спойлер) инструкции давно не актуальны, но зато доступен (правда, уже не обновляется) PPA:
sudo add-apt-repository ppa:mystic-mirage/komodo-edit sudo apt-get update sudo apt-get install komodo-edit
Началось все с того, один хороший человек на официальном форуме компании ActiveState выложил скрипт, при помощи которого можно конвертировать tar.gz-архив с официального сайта в deb-пакет для установки в Debian или Ubuntu. А немного позже еще один хороший человек (зовут его Андрей Аносов) не только собрал и выложил deb-пакет для 32- и 64-битных архитектур, но и создал deb-репозиторий, благодаря которому установка Komodo Edit в Ubuntu упростилась до предела.
Итак, первым делом перед прописыванием нового репозитория пропишите для него публичный ключ:
sudo apt-key adv --recv-keys --keyserver keyserver.ubuntu.com 8B9E0439
После этого пропишите сам репозиторий, добавив в «/etc/apt/sources.list» одну из следующих строк (в зависимости от версии вашего дистрибутива Ubuntu):
deb http://deb.anosov.org.ru natty non-free deb http://deb.anosov.org.ru maverick non-free deb http://deb.anosov.org.ru lucid non-free
Теперь осталось только обновить список источников и установить Komodo Edit:
sudo apt-get update sudo apt-get install komodo-edit
Вот и все, Komodo Edit установлен, причем самым корректным способом.
Теперь добавим в него возможность работы по принципам Zen Coding. Для этого достаточно перейти на пункт меню «Tools → Add-ons», после чего найти и установить расширение «Zen Coding». Как видите, здесь тоже все просто.
Со времени написания этой статьи много воды утекло. «Zen Coding» теперь называется «Emmet», а расширение для «Komodo IDE» сейчас находится по другому адресу. Остаток статьи оставил без изменений, поскольку я давно отказался от использования Komodo в пользу «Sublime Text».
Только вот по умолчанию для работы с Zen Coding не назначены горячие клавиши. Исправим это недоразумение. Для этого нужно открыть диалог «Edit → Preferences…», выбрать в нем раздел «Editor → Key Bindings» и отфильтровать нужные нам пункты, введя в поле «Commands» фразу «Zen Coding». Теперь для каждого из отображенных пунктов можно назначить горячие клавиши. Чтобы не выдумывать ничего нового, я использовал готовые хоткеи, которые назначены в расширении для Dreamweaver:
Expand Abbreviation Tab or Ctrl+, (on selection only Ctrl+,) Wrap with Abbreviation Ctrl+H Re_flect CSS Value Ctrl+R Balance Tag Outward Alt+[ Balance Tag Inward Alt+] Next Edit Point Ctrl+Alt+Right Previous Edit Point Ctrl+Alt+Left Go to Matching Pair Alt+/ Select Next Item Alt+Right Select Previous Item Alt+Left Insert Formatted Newline Ctrl+Enter Select Line Ctrl+K Merge Lines Ctrl+\ Toggle Comment Ctrl+/ Split/Join Tag Ctrl+Shift+\ Rename Tag Ctrl+Shift+B Remove Tag Alt+- Evaluate Math Expression Alt+= Increment number by 1 Ctrl+Up Decrement number by 1 Ctrl+Down Increment number by 10 Ctrl+Alt+Up Decrement number by 10 Ctrl+Alt+Down Increment number by 0.1 Alt+Up Decrement number by 0.1 Alt+Down
Часть из этих хоткеев оказалась уже занятой, но я этим пренебрег, поскольку они были закреплены за не самыми ходовыми операциями. Правда некоторые хоткеи я все же изменил, например, назначил для действия «Expand Abbreviation» комбинацию Alt+Enter, для действия «Reflect CSS Value» комбинацию Ctrl+Shift+R, а для действия «Wrap with Abbreviation» комбинацию Ctrl+Alt+Enter. Но это уже детали.
Самое главное, что после всех вышеперечисленных действий я получил замечательный рабочий инструмент для верстки сайтов. Чего и вам желаю 😉
Есть вопросы или дополнения по теме? Пишите в комментарии.
Большое спасибо за репозитарий! 🙂
А то ручками лень всё время ставить/обновлять.
За репозиторий спасибо не мне, а Андрею Аносову 🙂
Кстати говоря, Komodo Edit недавно обновился, и Андрей практически сразу обновил версию в репозитории, за что ему еще раз спасибо.
Ну, что он обновися, я видел 🙂 И видел так же, что в репе уже обновлён 🙂 И это радует! 🙂
А какие плагины пользуете для Комодо? Меня больше интересует вёрстка и что-то работа с цсс меня не впечатлила ((
Жаль, что он не показывает цвета в css, при наведении на коде #. Очень удобно, когда лезешь в чужой шаблон или в свой старый 🙂
Да и саму палитру цветов я в нём пока не нашёл. Не очень удобно для таких простых вещей ещё что-то стороннее использовать. Вы что используете?
По остальному пока не могу сказать, толком ещё не тестил. Но в целом, вроде бы, ничего. С некоторыми недостатками можно мириться.
Извиняюсь, посмешил про цвета )) Гугл рулит )) Хотя, я и до вопроса искал, но тут попалось. Ctrl )) Всё, я доволен Комодой более чем полностью! Уже можно работать 🙂 А к остальному привыкну быстро.
Пожалуйста, vovans!
Кстати, в связи с выходом Ubuntu 11.10 можно добавлять репозиторий строчкой
deb deb.anosov.org.ru oneiric non-free
. Хотя особой разницы нет. Пакеты для разных версий Ubuntu все равно одинаковые.Очень жаль, что не наткнулся на Ваш ресурс раньше! Пришлось ручками ставить, помучился немного, но вот… Я счастливый пользователь достойной замены notepad++. Единственно… проблемка с английским… никто еще не перевел этот редактор на русский?
А для чего там русский? Что именно там может быть не понятно?
И как Komodo может заменить notepad++ в убунте? о_0
Для тех, кто с английским на ты — конечно понятно все, а вот у меня с ним проблемка… учил всю свою жизнь немецкий… так что волей-неволей а трудности встречаются… хотя бы с настройкой.
А notepada в ubunte вроде вообще нет, просто я пользовался им для написания и редактирования html страниц через ftp. Komodo такое позволяет, подсветка есть и все такое, вот я и сказал, что это ДОСТОЙНАЯ замена. Чего не понятно то?
То непоятно, что вы благодарите за руководство по установке Комодо в Убунте, а потом говорите, что Комодо стал достойной заменой блокнота. Но как такое могло произойти, если этого notepad++ вообще нет в Убунте? Какая же это замена?
И английский я сам неважно знаю, но с использованием Komodo Edit проблем нет. Всё так же как и у всех.
Для непонятливых… Я всю жизнь проработал на windows и лучшего редактора чем notepad++ я там не встретил. Сейчас я работаю в Ubuntu, но поскольку такого редактора я до этого времени не встречал, то пользовался notepad++ под wine. Теперь понятно? А сейчас наткнулся на komodo и очень рад этому! По своему функционалу он нисколько не уступает блокноту. А про английский… я тоже пользуюсь и им без проблем, просто не могу его настроить так как мне бы хотелось. Например в нотепаде есть такая фишка-как подсветка не только парных скобок, но и парных тэгов в html. В komodo такая функция тоже реализована, но не так… она динамическая, т.е. при нажатии на открывающий тэг, закрывающий подсвечивается кратковременно, а хотелось бы постоянно. Настроек очень много и разобраться в них без знания английского очень трудно. Задавать множество вопросов не хочется… это всегда раздражает, поэтому и задал вопрос по русификации… потому, что уж в русском сам бы разобрался )))
Вынужден вас разочаровать, но не найдёте вы этого в настройках. Это, типа, фишка такая у Комодо. Я сделал так.
Открыл файл prefs.xml, вбил в поиске
showMatchingTags_clearInterval
и добавил к значению по умолчанию (1000) несколько цифр. Думаю, что если все эти три строки:внести в конфиг, что в домашней директории, то эффект будет тем же. Но не проверял.
Неудобно, конечно. Но можно сделать раз и забыть надолго 🙂
ч0рт, обрезался весь код, что я приводил. Ну да ладно, в файле настроек и так всё предельно понятно, что да куда.
Благодарю! Отчасти помогло)))
Почему отчасти: я увеличил значение времени подсветки, все вроде стало в норму, первые две строки отвечают за включение этой функции, поэтому менять их не нужно)))
Теперь осталось еще десятка 2 привычных для меня настроек…. Поэтому отчасти… В любом случае огромное спасибо. Жаль что из двух парных тэгов подсвечивается только один (( не удобно, если эти парные тэги не вмещаются на один экран….
Вообще, чувствую, что надо уже заметку у себя делать со всеми тонкостями, которые были обнаружены при работе с Комодо ))
А то через пол года уже и не вспомнишь, что куда.
Русификатора или чего-то подобного не видел, хотя я его и не искал (использую англоязычный интерфейс во всех приложениях).
Установил, буду пробовать. Интересно, в чём отличия от NetBeans?
Отличий много, так сразу и не скажешь. Пробуйте, сами увидите.
Спасибо, уже пользуюсь почти 3 месяца, очень нравится.
Да, вот кстати, интересны впечатления 🙂
У меня процесс протекал наоборот — сначала Komodo, потом Netbeans, и последний меня очень порадовал.
А вообще кто-нибудь пробовал Vim пользовать как IDE? 🙂
Сурово 🙂
В том же Sublime есть Vintage mode, который позволит пользователям Vim быстрее к нему привыкнуть.
Да я собственно так просто спросил. В Vim возможно больше шума чем удобства. Но скорость работы в консоли пугает 🙂
Вы Sublime пробовали?
Если нет, попробуйте — скорость работы приятно удивит 😉
Блин… Я захлебываюсь от удовольствия… Очень хочется, чтобы Sublime удовлетворил все мои требования… Скорость работы… Супер…
У меня было такое же первое впечатление. И дальнейшие ожидания тоже оправдались 🙂
Я с некоторых пор перешел на Sublime Text 2. Он очень легкий в плане нагрузки на систему, при этом на мой взгляд более функциональный и приятный в использовании, чем большинство «тяжелых» редакторов (типа тех же Komodo и Netbeans).
У меня компьютер хороший середнячек, поэтому вопрос ресурсов не стоит очень остро, поэтому между скоростью и удобством я выберу последнее.
В Netbeans мне очень понравилась организация проектов, а также возможность выгрузки изменений сразу на хост прямо IDE, т.е. минус Filezilla. Это конечно не всегда нужно, но конкретно сейчас это свойство мне очень пригодилось.
Немного огорчает отрисовка Netbeans в Unity, тот же Komodo выглядит приятнее, но в то же время Netbeans вполне няшно выглядит в KDE.
Собственно я к чему 🙂 Если Sublime Text 2 не уступает по удобству Netbeans, тогда можно пробовать 🙂
Дело не только в ресурсах. Тяжелые Java-приложения работают с определенной задержкой даже на самых современных и мощных компьютерах. А вот с Sublime я понял наконец-то, что такое моментальный отклик, и возвращаться на другие редакторы желания нет. И организация проектов в Sublime — прекрасна 🙂
И насчет удобства и няшности — Sublime — очень удобная няшка… 🙂
Попробовать очень советую.
Подскажите пожалуйста, вы не сталкивались с такой проблемой:
Работаю в KUbuntu, после обновления дистрибутива до 11.10 и, соответственно, переустановки Komodo Edit (6.1.3) обнаружился трабл — не видно текста во всплывающих подсказках по коду.
Сам текст присутствует, так как если в середине набора нажать Enter, то дополняется нормально, но его не видно. Гугл вывел только на одно похожее упоминание проблемы, но там у товарищей, судя по всему, Gnome, так как у меня в Kubuntu таких файлов и близко нету…
Вы не в курсе, как это исправить? Похоже проблема банально в совпадающих цветах фона и текста, но где это поменять — не могу найти…
У меня Ubuntu 11.10, Komodo Edit 6.1.3 — такой проблемы нет. Возможно, это что-то специфичное для KDE.
Попробуйте поиграться с цветовыми схемами — если проблема действительно в совпадающих цветах, то это может помочь.
Благодарю за ответ, проблему уже нашёл. Действительно, специфична только для KDE, причём я описал только половину проблемы — оказывается тут ещё и диалог открытия файлов такой же «пустой».
Причина — в какой-то несовместимости Komodo с темой оформления Oxygen-GTK под «кедами». Вылечилось установкой для GTK темы QtCurve.
В ActiveState об этом баге знают, но пока побороть его не могут.
Нигде не могу найти ярлык для запуска, запуск через терминал выдаёт такую ошибку:
(komodo-bin:3017): Gtk-WARNING **: Загружаемый модуль тем не найден в module_path: «pixmap»
У меня ubuntu 11.10, как можно решить эту проблему?
Виталя, попробуйте установить пакет gtk2-engines-pi xbuf (в терминале —
apt-get install gtk2-engines-pi xbuf
).А ярлыки в меню у меня тоже не создавались, я делал вручную. Если работаете в KDE — не забывайте ставить галочку «показывать только в KDE» у пункта меню, иначе он совсем из меню пропадёт (глюк такой есть…)
Ввёл, выдал такое:
~$ apt-get install gtk2-engines-pixbuf
E: Не удалось открыть файл блокировки /var/lib/dpkg/lock — open (13: Отказано в доступе)
E: Не удалось выполнить блокировку управляющего каталога (/var/lib/dpkg/); у вас есть права суперпользователя?
Установку пакетов необходимо производить от имени суперпользователя (root). То есть:
Спасибо, помогло
Как это сделать??? Ввожу в терминале, результат:
command not found
Если у меня ubuntu 11.10, то какую строку добавить в
/etc/apt/sources.list
?Третий день на ubuntu, до этого виндой пользовался. Flash нормально не работает, дров на ati mobility radeon hd 5650 нормальных не найти, второй монитор в режиме не клона не подключить. Это все решается, но если ты в глаза не видел ubuntu до этого, то это целый головняк.
Пока писал это, скачал deb пакет и установил Komodo Edit.
Хотелось бы понять и этот способ!!!
Наберите
apt-get
вместоaptitude
. Поправил в статье.Спасибо, статья нереально полезной для меня оказалась.
Добрый вечер. Я не так давно занимаюсь версткой. Немного не понятно с последним пунктом. Подскажите, какие именно действия сделать, чтобы назначить эти горячие клавиши.
С удовольствием вам помог бы, но не знаю — чем.
Вроде как действия по назначению клавиш итак разжеваны в статье максимально подробно.
Что именно непонятно?
Все вышеперечисленное понятно. Не ясно какие действия необходимо сделать далее. Выделяю
Commands: Zen Coding
. Выбираю из списка например.Balance: Tag Inward
. Ввожу в полеNev Key Sequence : Alt+]
, в итоге раскладка не назначается.Сказать по правде — сейчас я Komodo Edit не использую (соответственно он у меня не установлен), потому в деталях ответить на этот вопрос не могу.
Очень жаль, в гугле сплошные гс, только в вашем блоге есть подробное описание этой темы. Пишите еще, читать ваш блог интересно.
Отличный редактор, спасибо.
А где у него шрифт редактора устанавливается?
Собственно проблема в чём…
Сейчас у меня KomodoEdit установлен, но не из рэпов. Хочу снести и поставить из рэпов. Но, в текущей версии установил классный шрифт, и забыл как ставил. Хотел бы узнать название, снести редактор, установить из рэпов и поставить этот же шрифт.
Вопрос 1. Как узнать шрифт?
Вопрос 2. Как снести редактор, который ставился как
sh ./binfile
?Откровенно говоря, я уже давно перешел на Sublime Text 2, Komodo Edit у меня сейчас не установлен, а по памяти я таких подробностей не помню к сожалению.