텍스트 편집기 Sublime Text 2의 기초 설정부터 FTP 연결까지

Sublime Text 2

Sublime Text 2의 간단 사용법

  나에게는 Notepad++가 동반자였다. Sublime Text라는 강력한 툴을 만나기 전까지는 말이다. 물론 Notepad++도 훌륭한 프로그램임에는 이견이 없으나, Sublime Text라는 툴을 간단한 설정만 해줘도 참 편하게 사용이 가능하단걸 깨닫았다. 그런데 검색을 해보면, 은근히 이 툴을 처음 사용하는 사람들이 참고할 만한 글은 없었다. 나 역시 그런 경우중 하나라서 고생아닌 고생을 하다가 이거 그냥 쓰지 말까라는 생각까지 했었는데, 이런 훌륭한 툴을 나와 같은 경우로 인해서 포기하게 되는 사람들이 생길까봐 A to Z로 간단한 설치 및 사용법을 올려본다.

1. Sublime Text 설치 및 글꼴 설정

  Sublime Text는 2버전과 3버전이 있는데, 3버전은 아직 플러그인이라던지 그런 면들에 있어서 많이 나오지 않은 듯 싶다. 기능도 2버전이면 나는 충분한 듯 하다. 아래 링크로 들어가서 적절한 버전을 다운받는다.

http://www.sublimetext.com/2

 뒤에 2가 붙은건 2버전을 받겠다는 뜻이고 3버전을 받고 싶으면 3을 치고 들어가면 된다..

  설치하고 나서 프로그램을 켠 후 한글을 쳐보면 한글이 안나옴을 알 수 있다! 이 부분이 첫번째로 막히던 부분인데, 해결책은 간단했다. 한글폰트가 적용이 안된 것이다. 해결을 위해선 글꼴 설정을 해 주어야 한다. 영어로는 Preference라고 하는데, Sublime Text의 경우에는 이런 Preference가 json형식으로 되어있다. 이런 형식에 익숙치 않은 사람에게는 어려울 수도 있겠지만, 두줄이면 되니까 따라해보자.

  Preference -> Settings - User로 들어가서,

  위와 같은 형식으로 치면 된다. 복사 할 수 있게 아래에 코드를 다시 써보면

	
{
	"font_face": "NanumGothic",
	"font_size": 12
} 
	

  여기서 font_face는 글꼴인데, 시스템에 나눔고딕이 없다면 Dotum으로 설정하면 된다. 돋움체가 Dotum이고 원하는 글꼴이 있다면 그것을 쓰면 된다. font_size는 글꼴 크기를 조정하기 위함인데 어차피 Ctrl 키와 -키 +키의 조합으로 확대 축소가 가능하니 크게 의미가 있지는 않다. NanumGothic 뒤에 ,가 있음에 주의하자. json은 A:B와 C:D가 있으면 그 사이에 ,가 필요하다.

2. SFTP 설정

  위 설정만 하여도 당장에 사용은 가능한데, 나는 웹개발을 요즘 하고 있어서 FTP에 바로 올릴 수 있는 플러그인이 있으면 좋겠다고 생각을 했고, Sublime Text는 방대한 플러그인을 가지고 있기 때문에 나의 이런 욕구를 바로 충족시켜 주었다. 어렵지 않으니 따라해보자.

  우선 Ctrl + `를 누르면 콘솔창이 뜬다. 여기서 아래 코드를 복사해서 붙여넣기 한다.

	

import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else None; urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler())); open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read()); print 'Please restart Sublime Text to finish installation' 
	

  그런다음 Sublime Text를 다시 켠다. 그 후 Preference에 들어가보면, Package Control이라는 메뉴가 맨 하단에 생성되어 있다. 이를 누른 후, Install Package를 아래 그림과 같이 선택한다.

  나는 이미 깔려 있어서 목록에 뜨지는 않는데, SFTP를 선택한 후 엔터키 치면 바로 설치가 시작된다. 그 후엔 폴더를 연동해야 한다. 우선 폴더를 하나 만든 후, 위에서 폰트를 연동한 것과 같은 방법으로 json형식의 설정파일을 수정해야 한다. 폴더를 Open한 뒤에 (File에 들어가면 있다) 그 폴더 위에서 우클릭을 하면,

  위 사진 처럼 Map to Remote라는 메뉴가 있다. 이를 누르자. 그러면,

  설정 파일이 뜬다. 여기서 코드를 수정해야 하는데, 일단 본인 계정의 ftp계정의 포트와 아이디 비밀번호, 접속 방식은 기본적으로 알고 있을것이라는 가정 하에서 설명한다.

	

{
    // The tab key will cycle through the settings when first created
    // Visit http://wbond.net/sublime_packages/sftp/settings for help
    
    // sftp, ftp or ftps
    "type": "ftp",

    "save_before_upload": true,
    "upload_on_save": true,
    "sync_down_on_open": false,
    "sync_skip_deletes": false,
    "sync_same_age": true,
    "confirm_downloads": false,
    "confirm_sync": true,
    "confirm_overwrite_newer": false,
    
    "host": "readiz.com",
    "user": "readiz",
    "password": "abcd",
    //"port": "22",
    
    "remote_path": "/",
    "ignore_regexes": [
        "\\.sublime-(project|workspace)", "sftp-config(-alt\\d?)?\\.json",
        "sftp-settings\\\\.json", "/venv/", "\\.svn", "\\.hg", "\\.git",
        "\\.bzr", "_darcs", "CVS", "\\.DS_Store", "Thumbs\\.db", "desktop\\.ini"
    ],
    //"file_permissions": "664",
    //"dir_permissions": "775",
    
    //"extra_list_connections": 0,

    "connect_timeout": 30,
    //"keepalive": 120,
    //"ftp_passive_mode": true,
    //"ssh_key_file": "~/.ssh/id_rsa",
    //"sftp_flags": ["-F", "/path/to/ssh_config"],
    
    //"preserve_modification_times": false,
    //"remote_time_offset_in_hours": 0,
    //"remote_encoding": "utf-8",
    //"remote_locale": "C",
}
 
	

  type 부분은 sftp와 ftp가 있는데, sftp면 sftp를, ftp면 ftp를 써주면 되고, upload_on_save는 로컬에서 파일을 수정해 저장을 하면 동시에 바로 서버에 업로드함을 듯한다. sync_down_on_open은 로컬에서 파일을 열면 서버에서 그 파일을 받아와 열어준다는 것이고, 중요한건 이것까지인 듯 싶다.

  host는 접속 도메인, user는 user name, password는 비밀번호다. port도 기본포트가 아니라면 주석표시인 //를 지우고 입력해주면 된다.

  로컬 폴더 전체를 서버와 동기화시키고 싶지 않다면 remote_path는 /가 아닐 것이다. 일단 잘 모르겠으면 /로 두어도 된다. /로 두면 ftp의 폴더 구조 전체가 pc로 들어오는 것이다. 나같은 경우에는 /로 둔 다음에, ignore_regexes를 수정하여 원하지 않는 폴더는 동기화에서 빼버렸다. 만약 /abc/라는 폴더의 동기화를 하고 싶지 않다면 /abc/를 추가하면 된다. 간단하다. 이렇게 설정이 잘 된후에 저장을 하면 아래 그림처럼 저장과 동시에 업로드가 된다. (위 설정 중 upload_on_save를 켜 두어야 한다. 그렇지 않으면 파일 저장 후 그 파일 이름을 우클릭해서 Sync Local->Remote를 눌러야 한다)

  사용해보면 정말 편한 플로그인이 아닐 수 없다. 이렇게 Sublime Text의 설치부터 FTP 연결까지 A to Z의 강좌를 마친다. 궁금한 점 있으시면 댓글로 남겨주시길..

저작자표시비영리변경금지

'Creation > Design' 카테고리의 다른 글

[CSS] CSS로만 만든 배경 / 그레디언트 들어간 배경 쓰기  (5)	2014.02.24
[폰트] 구글 Fonts이용, 영문 웹폰트 적용시키기  (9)	2014.02.22
[CSS] 원형 이미지 마스크 & transform 속성으로 회전시키기  (2)	2014.02.19
[CSS] 웹폰트 로딩중에도 본문 나오게 하기  (4)	2014.01.13
플랫 디자인 색상 예제 / 색상코드(색상표)  (3)	2013.12.23
텍스트 편집기 Sublime Text 2의 기초 설정부터 FTP 연결까지  (16)	2013.12.19
[CSS] 브라우저 캐시 때문에 CSS 수정이 반영이 안될 때  (2)	2013.12.18
[CSS] CSS의 핵심 2편 - 속성(Attribute)값 알아보기  (0)	2013.12.01
[CSS] 웹디자인, 페이지 구성, CSS 처음 배워도 할 수 있다. CSS의 핵심 1편  (0)	2013.11.21
[JQueryMobile] Grid 사용방법 / Grid 개념  (0)	2013.11.11
[JQuery] JQueryMobile을 이용한 Simple Index Page 초기화면  (0)	2013.11.06