코드랩 레퍼런스

Sublime Text3 설치 및 셋팅하기 본문

ETC

Sublime Text3 설치 및 셋팅하기

webstoryboy 2017. 6. 15. 09:52
Sublime Text는 코딩, 마크업을 하기 위한 에디터입니다. 인터페이스 및 사용 호환성이 좋아 요즘 많이 사용하고 있는 에디터 중에 하나입니다. 윈도우 및 맥에서 사용이 가능하며, 사용하기 전에 몇 가지 셋팅이 필요합니다.

Setting


  • 기본 서브라임만 설치된 상태이기 때문에 필요한 기능을 설치하려면 Package Control를 설치해야 합니다. Package Control
    1. View > Show Console를 클릭합니다.
    2. Package Control 소스를 복사하여 Console 붙여넣기 합니다.
    3. Preference에 Package Control이 있다면 설치가 완료된 것입니다.


Sidebar Enhancements

  • Sidebar Enhancements는 사이드바의 기능을 향상시키는 기능입니다.
  • 사이드바가 없다면 View > Side Bar에서 설정합니다.
    1. Preference > Package Control를 클릭하고 Package Control : Install Package를 클릭합니다.
    2. 검색란에 sidebar라고 하면 목록이 나타납니다.
    3. Sidebar Enhancements를 클릭하면 설치가 되고 사이드 바에서 오른쪽으로 클릭하면 다양한 기능들이 추가된 것을 확인 할 수 있습니다.


FTP 설치하기

  • Sublime SFTP는 FTP, SFTP를 사용할 수 있도록 확장해주는 플러그입니다.
    1. Preference > Package Control를 클릭하고 Package Control : Install Package를 클릭합니다.
    2. 검색란에 SFTP라고 쓰면 SFTP 목록이 나타납니다.
    3. SFTP를 클릭하면 설치가 되고 File > SFTP/FTP를 확인할 수 있습니다.

  • Sidebar에 폴더를 만들고 오른쪽을 클릭하면 FTP Setting이 나오고 Map to Remote...를 클릭합니다.


  • 서버 정보를 적습니다.
    1. "type": "ftp"로 수정합니다.
    2. "host": "webstoryboy8.dothome.co.kr" : 호스팅에 가입한 주소를 적습니다.
    3. "user": "webstoryboy8", : 아이디를 설정합니다.
    4. "password": "password" : 패스워드를 설정합니다.
    5. "port": "21" : 특별한 사항이 없다면 기본 포트로 설정합니다.
    6. "remote_path": "/html/" 서버 기본 루트 주소를 얘기합니다. dothome의 경우는 /html/로 되어 있고, 카페24 같은 경우는 /www/로 적으면 됩니다.
    7. "file_permissions": "777",: 특별한 사항이 없다면 파일 권한은 777로 설정합니다.
    8. "dir_permissions": "777", : 특별한 사항이 없다면 폴더 권한을 777로 설정합니다.


  • 폴더의 오른쪽을 클릭하고 SFTP/FTP를 클릭하고 Download Folder를 클릭하면 파일을 다운로드 화면을 볼 수 있습니다.


Emmet 설치하기

  • Emmet는 코딩을 좀 더 쉽고, 수월하게 작업할 수 있도록 도와주는 플러그입니다.
    1. Preference > Package Control를 클릭하고 Package Control : Install Package를 클릭합니다.
    2. 검색란에 emmet라고 쓰면 emmet 목록이 나타납니다.
    3. emmet를 클릭하면 설치가 되고 Preference > Package Setting > Emmet을 확인할 수 있습니다.


Sublime 기본 설정하기

  • Preference > key Bindings는 단축키를 변경합니다.


  • Preference > Setting는 기본 기능을 설정합니다.
  • 왼쪽에 있는 기본 기능을 오른쪽에 넣어주면 설정됩니다.

  • 글꼴 설정 : "font_face": "",
  • 폰트 사이트 설정 : "font_size": 14,
  • 폰트 옵션 설정(굵기, 이탤릭체) : "font_options": ["no_bold"],
  • 라인 넘버 표시 여부 : "line_numbers": true,
  • 간격 : "margin": 4,
  • 라인 위쪽 간격 : "line_padding_top": 2,
  • 라인 아래쪽 간격 : "line_padding_top": 2,
  • 탭 사이즈 설정 : "tab_size": 2,
  • 줄바꿈 설정 : "word_wrap": "true",
  • 미니맵 보더 설정 : "draw_minimap_border": true,
  • 미니맵 표시 여부 : "always_show_minimap_viewport": true,
  • 포커스 된 선을 강조 : "highlight_line": true,


코드 자동 정렬 기능 설정하기

  1. Preference > Package Control를 클릭하고 Package Control : Install Package를 클릭합니다.
  2. 검색란에 command Palette를 클릭하고 설치합니다.
  3. Indentation: Reindent Lines / Indentation: Reindent Lines / Indentation: Reindent Lines
Related Articles more
공유하기 링크

Ad

Comments