Sublime Text 3 설치 & 추천 플러그인들

다운로드 페이지로가기

위 페이지에서 자신의 OS에 맞는 것들을 받으면 된다.

 

Package Control 설치

SublimeText를 설치하고 플러인을 설치해야 더 많은 기능을 사용할 수 있는데, 이런 Package들을 사용하려면 먼저 Package Control를 설치해야한다. 설치하는 방법은 콘솔을 이용해서 간단하게 하는 방법이 있고, Proxy등 문제가 있어서 어려울때 메뉴얼로 설치하는 방법이 있다. Sublime Text3에 필요한 코드를 먼저 복사한다.  => 참조페이지

import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

위 코드를 복사한 다음에 Sublime Text3를 실행하고서 단축키 Ctrl + ` 를 누르면


위와 같이 콘솔이 나타나고 복사한 코드를 넣고, Enter를 누르면 Package Control이 설치된다. 안되면 메뉴얼로 해야하는데. 위 설명 페이지에 가서 Menual 설치방법을 참고하면 된다. 영어지만 그렇게 어렵지 않아요~~~ ^^

 

기본세팅 설정
– 차로여행이 사용하는 세팅입니다. 한번에 붙어 넣기 하면 조금 더 편합니다. 

  • 우선 나눔코딩 폰트를 찾아서 설치를 하세요. (옵션입니다.   나눔코딩폰트)
  •  테마를 설치하세요.
    • Sumlime Text3에서 Shift + Ctrl + P 이렇게 단축키를 누르면 아래와 같이 패키지 설치 패널이 나타나는데요.
    • install 이란 키워드를 눌러서  아래와 같이 Package Control: Install Package를 선택합니다.
    • 여기에서 테마의 이름을 입력하면 추천 패키지 중에 금방 나타납니다.
  • 이렇게 하고 난다음에. Sublime Text의 메뉴에서 Preference > Settings를 누르면 새창이 나타나는데.
  • 오른쪽 User Settings에 차로여행이 사용하는 세팅을 복사해서 넣고 저장을 하면 자동 반영된다
  • 자신만의 세팅을 만들고 난다음에 어디에 보관해두면 나중에 다시 세팅할때 편리하다.
  • 차로여행 세팅바로가기 Sublime Text 3 사용자 세팅

패키지 설치

실제 제가 사용하고 있는 패키지들입니다. Test해봤어요. ^^:

    • Bracket Highlighter{},[],””,”,() 와 같이 열리고 닫히는 기호가 쌍으로 존재해야 하는 코드를 하이라이트처리해주는 확장기능
    • Emmet일명 Zen Coding이라 불리는 html코드 작성의 생산성을 높여주는 기술로 div*5 처럼 특정 문법에 맞게 작성하고 탭키를 누르면 div가 5개 자동생성 된다든지 하는 경우입니다.
    • Side Bar => SideBarEnhancement로 나오는데 이걸 받으면 됩니다.서브라임텍스트 작업창 좌측에 작업 파일 폴더구조를 나타내는 화면을 띄울 때(View > Side Bar > Show Open Files 메뉴), 폴더구조를 보다 더 명확히 구분돼 보여주는 기능
    • TortoiseSVN일명 거북이로 불리는 TortoiseSVN을 설치하여 서브라임텍스트 툴에서 바로 형상관리 가능
    • SFTP
      FTP세팅을 할 수 있고, 저장할때마다 서버에 자동으로 등록되어 편리하다.
    • Diffy
      두개의 파일을 비교해주는 편리함. ^^;
    • Alignment
      코드를 = 를 기준으로 이쁘게 정렬해줌.  기본 단축키는 Ctrl + Alt + A 인데… 인스톨하고 바로 하니 안되는데.. Sublime Text3 나갔다 다시 오면 됨. -_-;
    • Sublime CodeIntel
      변수등이 있을때 마우스를 가져다 놓으면 해당 변수, Function이 있는 곳의 파일들을 나열해준다. 개인적으로 편리함.
    • Color Picker
      어디에든지 칼러를 선택해서 #234567 처럼 코드를 붙어넣고 싶을때 … 단축키는 Ctrl + Shift + C
    • Color Highlighter
      CSS에 바로 칼러를 보여주고, 칼러를 선택한 다음에.. 마우스 오른쪽의 메뉴에서나, Ctrl + Shift + C를 눌러 칼러는 선택할 수있다.
      위 Color Picker와 충돌이있을 수있으니… 이것을 선호하면 위에것은 설치하지 말것.. 인스톨 이후에는 Sublime의 메뉴에서 Tools 안에 보면 Color Highlighter의 메뉴가 있는데.. 옵션 조정을 잘해서 사용하시도록…
      플러인의 주소: https://packagecontrol.io/packages/Color%20Highlighter

도움이 되는 키바인딩

{ “keys”: [“ctrl+shift+'”], “command”: “reindent” , “args”: { “single_line”: false } }

위 코드는 Alignment가 = 를 기준으로 정렬해준다면.. 이 단춘키는 들여쓰기로 정렬해준다.

 

 

사용자 Theme으로 조금 더 편리하게 사용하는 방법

-Darker-Material 테마를 사용하게 되면 상단 Tab의 글자가 작거나, 연하게 보여서 가독성이 떨어지는 경우가 있다. 이럴때 package폴더>user에 설치한 Theme 이름을 따서 사용자 테마파일을 만든다.

예) Darker-Material.sublime-theme

이렇게 하고 아래와 같이 코드를 넣는다.

[
    {
        "class": "sidebar_label",
        "font.bold": false,
        "font_face": "나눔고딕코딩",
        "font.size": 14,

    },

    {
        "class": "tab_label",
        "font.size": 13,
        "font_face": "나눔고딕코딩",
        "color": "#ffffff",

    },
    {
        "class": "sidebar_container",
        "content_margin": [-12, 0, 0, 0]
    },
    {
        "class": "sidebar_tree",
        "row_padding": [16, 1, 16, 1],
        "indent_offset": 10
    }

]

 

위와 같이 왼쪽 폴더의 간격도 좁아지고, margin도 좁아져서 편하다.

 

 

마지막으로…

열심히 정리한 내용이 도움이 되셨으면 SSN에 공유 부탁드리구요… 좋은 툴은 유료로 사용하시면 더 좋습니다.