Статьи

Как программировать как мастер дзен

Февраль 8, 2019

Моя программистская жизнь изменилась навсегда. Я достиг просветления … и вы тоже .

HTML и CSS, возможно, произвели революцию в Интернете и нашей карьере, но написание тегов каждый день может стать рутиной. Многие IDE и текстовые редакторы предлагают такие функции, как автозаполнение и сочетания клавиш, но они не значительно уменьшат нагрузку на печать.

Дзен-кодирование может быть ответом. Это мощный механизм сокращений, который расширяет CSS-селекторные выражения в HTML-код.

Давайте попробуем простой пример. Предположим, вам нужен divp Вы бы напечатали эту строку в вашем редакторе: 

 
div#content>p*3

затем нажмите пункт меню «Развернуть аббревиатуру» Zen Coding или сочетание клавиш. Код волшебным образом превращается в действительный HTML: 

 
<div id="content">
  <p></p>
  <p></p>
  <p></p>
</div>

Хотите быть немного более предприимчивым? Следующая аббревиатура: 

 
div#page>p.top+ul#nav>li*5>a

расширяется до: 

 
<div id="page">
  <p class="top"></p>
  <ul id="nav">
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
  </ul>
</div>

Не достаточно хардкорный? Введите это: 

 
html:5>(div#header>h1)+(div#content>p*3)+(ul#nav>li.item$*6>a[href="#"])+div#footer

создать полный шаблон HTML5: 

 
<!DOCTYPE HTML>
<html lang="en-US">
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
  <div id="header">
    <h1></h1>
  </div>
  <div id="content">
    <p></p>
    <p></p>
    <p></p>
  </div>
  <ul id="nav">
    <li class="item1"><a href="#"></a></li>
    <li class="item2"><a href="#"></a></li>
    <li class="item3"><a href="#"></a></li>
    <li class="item4"><a href="#"></a></li>
    <li class="item5"><a href="#"></a></li>
    <li class="item6"><a href="#"></a></li>
  </ul>
  <div id="footer"></div>
</body>
</html>

Сколько времени и усилий это спасет тебя? Есть также ряд сокращений CSS для ваших таблиц стилей .

Искусство скачивания дзен

Zen доступен как плагин для широкого спектра популярных IDE и редакторов, включая:

  • Aptana
  • BBEdit
  • кода
  • Dreamweaver
  • Затмение
  • Emacs
  • Эспрессо
  • GEdit
  • Komodo
  • Notepad ++
  • PSPad
  • TextMate
  • Высший стиль
  • UltraEdit
  • напор
  • Visual Studio

Многие из сокращений очевидны, но чит-лист Zen доступен, если вам потребуется дополнительная помощь.

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

35
Share: