5배 속도 내는 코딩 비법, zen coding을 아시나요?

HTML 코드를 작성할때 5배 속도 내는 코딩 비법, zen coding을 아시나요?

zen coding은 여러분들이 흔히 쓰고 계신 에디터 프로그램의 플러그인으로서 동작하며

CSS선택자 같은 입력방식으로 HTML코딩을 산출해냅니다.

백문이 불여일견!

일단 코드를 살펴보실까요?


div#page>div.logo+ul#navigation>li*5>a



마치 CSS선택자 같은 이 친숙한 코드 한줄이 zen coding을 만나면


<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 v0.5 from Sergey Chikuyonok on Vimeo.

또 다른 동영상 보기



zen coding은 공식지원되는 에디터와 third party 개발자들에 의해 만들어진 플러그인까지 포함하여

• Aptana/Eclipse
• TextMate
• Coda
• Espresso
• Komodo Edit/IDE
• Notepad++
• PSPad
• Dreamweaver
• Sublime Text
• UltraEdit
• TopStyle
• GEdit
• BBEdit/TextWrangler
• Visual Studio
• EmEditor
• Sakura Editor

이만큼이나 되는 에디터 들을 지원합니다.

저는 주로 windows 환경에서 editplus를 사용하는데 아쉽게 editplus용은 없네요.


아무튼 너무나도 멋진 플러그인임에는 틀림이 없네요!!