ㅂㅏㄱㅅㅏㅇ

baxang

Setting up Sublime Text 2 for Wordpress theme development

by Sanghyun Park

돈이 조금 생겨서 PhpStorm을 사려다 $99라는 가격을 보니 마음이 약해져 결제 버튼을 못 누르겠더라. 코딩으로 먹고사는 사람이 개발도구 사는데 벌벌 떨어서야 되겠느냐마는... 암튼 alpha때 써보고 버려뒀던 Sublime Text 2를 꺼내 당장 하고있는 PHP/Wordpress에 맞게 설정해봤다.

Sublime Text 2(이하 ST2)는 Sydney에 사는 Jon Skinner가 만들었는데, 가볍고 세련된 UI가 매력적이다. 생김새 뿐 아니라 [cci]Alt + 숫자[/cci]로 탭 사이를 옮겨다닐 수 있어서 그런지 구글 크롬스러운 느낌이 물씬 난다. 기능 제한이 없는 버전을 무료로 다운로드해 사용할 수 있지만 계속 쓰려면 $59에 구입해야 한다.

Package Control로 쉽게 플러그인 관리

ST2는 플러그인으로 기능을 확장할 수 있다. 벌써 200개 넘는 플러그인이 공개됐다는데 대부분은 Package Control이라는, 일종의 플러그인 매니저를 이용하면 쉽게 플러그인을 찾고 설치하고 업데이트 할 수 있다. 우선 패키지 컨트롤을 설치하자.

참고로, Package Control만이 ST2에 플러그인을 설치하고 관리하는 유일한 방법은 아니다. ST2의 플러그인은 Python 스크립트인데, 대개 GitHub이나 BitBucket의 공개 저장소 형태로 배포되고 있다. Package Control은 공개된 ST2 플러그인 저장소의 목록, 즉 채널을 통해 관리하는 툴이라고 생각하면 된다. 각각의 플러그인은 ST2의 Packages 디렉토리에 직접 [cci]git clone[/cci]하거나 복사하는 것만으로 설치가 되는 것이다. 각 OS별 Packages 디렉토리 위치는 아래에.

  • OS X : ~/Library/Application Support/Sublime Text 2/Packages/
  • Linux : ~/.Sublime Text 2/Packages/
  • Windows : %APPDATA%/Sublime Text 2/Packages/

Command Palette를 이용해 Package/Plugin 설치

ST2에는 Command Palette라는 효자가 있는데 단축키 ⌘⇧P (Windows에서는 ^~P) 혹은 Tools 메뉴 아래의 Command Palette를 선택하면 뜨는 대화창이 바로 그것이다. ST2의 기본 기능이나 설치된 플러그인의 명령을 일부만 대화창에 입력하면 마치 검색엔진의 자동완성처럼 찾아준다. 커맨드 파레트를 열고 [cci]install[/cci]이라고 입력해 보면 [cci]Package Control: Install Package[/cci]이 선택될거다. (Package Control의 다른 기능을 확인하고 싶으면 [cci]package control[/cci]이라고 입력해보자.) 엔터⏎를 치면 창이 닫히며 잠시 플러그인 저장소를 읽어온 다음 이번에는 플러그인 검색창이 뜬다. 원하는 것을 검색하고 ⏎로 설치.

일단 깔아두면 좋은 것들

  1. DetectSyntax : 기본적으로 파일의 확장자를 통해 언어를 판단하지만, 이 플러그인은 .rb 파일이 일반 루비 파일인지 아니면 RSpec 파일인지를 구분해 준다.
  2. Git & SideBarGit : 기본적인 Git 지원을 위해 Git 플러그인을 설치하자. SideBarGit은 이름처럼 사이드바의 컨텍스트 메뉴(a.k.a 마우스 오른쪽버튼 메뉴)에 Git 메뉴를 추가해 준다.
  3. SublimeLinter : IDE처럼 실시간 코드 오류 검사를 해준다. 속도를 느리게 한다고 하니 참고. 나는 아직 괜찮던데.
  4. Alignment : 여러 라인이 걸쳐 변수 할당할 때 = 를 세로 정렬해준다. 이거 진짜 귀찮은데!

Theme

ST2에서는 플러그인이랑 테마를 모두 Package라는 개념으로 관리한다.

  1. Soda theme : 많은 개발자들이 이 테마를 추천하더라. Package Control을 통해 설치한 다음에 [cci]Preferences - Settings - User (⌘,)[/cci]에 JSON 포멧으로 설정을 써주면 된다.

Wordpress, PHP관련

  1. Wordpress : 함수 자동완성, 함수정의, Code snippets 등 깨알같은 편의 기능을 제공한다.

ST2만의 편집 기능들

얼추 설정했으면 이제 일 해야지? ST2는 예쁘고 빠르고 플러그인도 많지만 다중선택 등 독창적인 편집기능이 또한 매력적이다.

Vintage

ST2는 Vi 호환 모드를 내장하고 있는데, 다만 기본값으로 disable되어있다. :w와 hjkl가 그립다면 Vintage Mode[1. http://www.sublimetext.com/docs/2/vintage.html]를 활성화하자.

Multiple Selection

ST2에서는 커서가 하나가 아니다. 커서 여러개로 동시에 여러군데를 편집할 수 있다. 말로는 설명이 어렵다. 우선 마우스로 하는 방법:

  • ⌘를 누르고 소스코드의 여러 부분을 클릭하면, 클릭한 위치마다 커서가 생긴다. 이제 아무거나 입력해 보라.
  • 코드의 일부분을 드래그해서 선택한다. ⌘키를 누른 채 다른 부분을 선택해 보자.
  • ⌃⇧와 함께 위/아래 방향키로 움직여 여러 라인을 선택한 다음 컨트롤 키를 떼고 좌/우로 움직여 단어를 선택한다.
  • 단어를 선택한 다음 ⌘D를 누르면 다음번의 같은 단어가 선택된다. ⌘U로 마지막 선택한 것 취소.
그리고 한 줄을 선택하는 단축키 ⌘L도 유용하다.

File Group

화면을 가로 혹은 세로로 나누면 각각이 그룹이 됨. 그룹 안에서 알트탭으로 이동 가능. 다른 그룹으로 파일을 보내거나 포커스 옮길 수 있음.

Go To Anywhere, C+G, R, P

http://docs.sublimetext.info/en/latest/file_management/file_management.html#goto-anything
(To be continue)

참고한 자료

  1. http://clintberry.com/2012/sublime-text-2-php-symfony-development/
  2. http://wbond.net/sublime_packages/package_control
  3. http://net.tutsplus.com/tutorials/tools-and-tips/sublime-text-2-tips-and-tricks/
  4. http://urbangiraffe.com/2011/08/15/sublime-text-2-for-php/
  5. http://blog.stuartherbert.com/php/2012/02/28/setting-up-sublime-text-2-for-php-development/

http://tarantsov.com/blog/2012/02/sublime-text-workflow-that-beats-coda-and-espresso/

http://kingori.egloos.com/m/4702877

About Sanghyun Park

a.k.a Baxang. Software engineer lives in Sydney, Australia born in Seoul, South Korea.

Sydney, Australia http://blog.baxang.com