Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.
RetroTech 팟캐스트 44BITS 팟캐스트

Vim에서 Zen-coding 사용하기

Zen-coding은 HTML을 작성하는 새로운 방법으로 CSS셀렉터처럼 작성하고 단축키를 누르면 HTML코드가 완성되는 방식을 사용합니다. 작년에 firejune님이 소개해줘서 처음 알게 되었고 CSS 셀렉터에 대한 학습도 할 수 있고 여러가지로 상당히 편리한 방법이라고 느껴져서 연습해 봐야지하면서 미루고 미루다가 Vim에서 사용해 보려고 설치했습니다.

다운로드 페이지를 보면 알 수 있듯이 TextMate, Notepad++, Coda, Dreamweaver, Sublime, UltraEdit등의 에디터를 지원하고 있으며 Eclipse에서도 사용가능하고 거의 왠만한 개발환경에서는 다 지원하고 있는 듯 합니다.

Vim플러그인으로 matth가 만든 zencoding-vim을 사용했습니다.설치는 매우 간단합니다.

git clone https://github.com/mattn/zencoding-vim.git

명령어를 통해서 파일을 받은 다음에 아래의 2개의 파일을 ~/.vim/폴더 아래에 각각 복사해 주면 됩니다.

autoload/zencoding.vim
plugin/zencoding.vim

matth가 만든 튜토리얼을 보면 기본적인 사용방법을 이해하실 수 있으실 겁니다. zencoding을 한 뒤에 Ctrl + y를 누른뒤에 콤마(,)를 누르면 HTML코드가 생성이 됩니다.(Ctrl+y라 그다지 편한 단축키로 느껴지진 않더군요.) 그외 많은 많은 단축키와 기능들이 있고 그부분은 Cheatsheet를 참고하면 될 것 같습니다. 이 많은 기능들을 다 익히기는 어렵지만 간단한 것들만 익혀도 HTML코드를 작성하는 생산성은 많이 올라갈 것으로 보입니다. vim 플러그인에 대한 자세한 기능은 프로젝트에 포함되어 있는 doc파일을 보면 더 자세한 기능을 알 수 있습니다.(저도 좀 연습해봐야 해서...)
2011/03/24 02:28 2011/03/24 02:28