2012年5月6日

Aptana, Eclipse Zen-Coding 讓你寫html比打MSN還快


最近朋友去了一間對於寫code要求很變態的公司,多變態呢?基本上你的coding速度要比聊天打字還快才有機會過試用期。



雖然寫程式速度加快不代表產品週期就可以減短,但是為了讓碼農能夠在無良資方當道的世代生存下去,我開始尋找增加寫程式速度的方法,我認為主要可以分成兩種:

一個是語言的提升,讓碼農能夠直接寫一個語言的核心

另一種是工具的提升,讓碼農能夠用更好的工具來所減少非決策性或重複性的工作

今天要介紹Zen Coding真的是一個很屌的東西,基本上他同時有兩種特性

他是一個編輯器外掛,目前許多編輯器都有支援,如果你是用Aptana or Eclipse

可以到help > install software 從 http://zen-coding.ru/eclipse/updates/ 更新

使用方式非常簡單

當你寫html的時候打上 div#myid.myclass 然後tab或command+E

Zen Coding會自動幫你轉換成
<div class="myclass" id="myid"> </div>

完全是css selector的方式

再來使用
div#page>div.logo+ul#navigation>li*5>a

可以自動轉換成 <div id="page">
<div class="logo"></div>
<ul id="navigation">
<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>


發明Zen coding的人真的是天才呀!

Zen coding還可以用$字號帶入數字序列,還可以有擴展功能來支援各種template的語法

比如說打入
djb#body>div#header
可以自訂格式讓他成為
{% block body %} <div id='header'> </div> {% endblock %} 

此外還有圖片大小自動輸出command+i

對選取的html做修改command+shift+a等等

Zen coding讓你寫程式比打MSN還快不再是夢想

趕快裝起來玩玩吧!!