Zen Conding

10 авг. 2012 г. | | |

Про то, что SublimeText 2 - мега крутая вещь, знает, наверно, каждый. Да, я тоже в восторге от этого редактора, незамедлительно включила его в свой арсенал разработчика и стала всячески обустраивать плагинами. И наткнулась на хвалебные песни о ZenCoding. Хм, что же это плагин? Сходим к проекту на github, почитаем реадми, проясним ситуацию:
This plugin will evetually replace current plugin: https://github.com/sublimator/ZenCoding
Как-то понятнее не стало. Один Zen Coding заменяется другим. И хабр как-то не сильно прояснил ситуацию: смесь невалидного html и css. Что ж это за.... магия?


Ага, именно! Вместо того, чтобы выстукивать на клавиатуре
<table>
    <tr>
       <td>
       </td>
    </tr>
</table>
достаточно набрать table+ и нажать Ctrl+
Cовсем впечатляющий пример: Из html:xt>div#header>div#logo+ul#nav>li.item-$*5>a получаем
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<div id="header">
<div id="logo"></div>
<ul id="nav">
<li class="item-1"><a href=""></a></li>
<li class="item-2"><a href=""></a></li>
<li class="item-3"><a href=""></a></li>
<li class="item-4"><a href=""></a></li>
<li class="item-5"><a href=""></a></li>
</ul>
</div>
</body>
</html>

Список поддерживаемых редакторов, а так же описание вариаций сокращалок и справочник по ним на странице проекта в гуглкоде. Есть даже плагин для VS2010 от сторонних разработчиков.
Однозначно must have.
UPD : Zen Coding cheat sheet (PDF)

0 коммент.:

Отправить комментарий