BLOG main image
분류 전체보기 (313)
교육 (13)
NEIS (6)
Edufine (0)
Programmer (5)
Android Programming (1)
Internet W3 (18)
JAVA Programming (9)
JSP/Servlet (1)
Framework (7)
Spring For Beginner (4)
eGovFrame (10)
MEAN Stack (2)
NodeJS (5)
SublimeText (30)
SublimeText_Tips (18)
Eclipse (16)
JavaScript (8)
jQuery (12)
jQuery_tips (1)
Ajax (3)
DWR(Direct Web Remote) (4)
JSON(JS Object Notation) (4)
Oracle (2)
MySQL (28)
OS (16)
Download (3)
Life (10)
Favorit Site (1)
Books (2)
Healthy (1)
Stocks (1)
HTML5/CSS (1)
Python (4)
Security (7)
CISSP (0)
Ruby On Rails (5)
일기장 (0)
영어 교과서(중2) (3)
알고리즘 (0)
Go Lang (3)
VB 2010 (12)
C# (1)
정보보안기사(네트워크보안) (0)
업무 활용 엑셀 (11)
틈틈이 활용팁 (14)
하루 하루 살아가며 ……. (2)
기술 (1)
파이썬 & 데이터분석 (1)
Visitors up to today!
Today hit, Yesterday hit
daisy rss
tistory 티스토리 가입하기!
2015. 7. 14. 13:37

Sublimerge 사용법은 무척 간단합니다. 단축키 한두개 정도만 알면 사용하는데 어려움이 없을정도로 무척 간단합니다.


서브라임 텍스트의 라인 바로가기 단축키는 바로 [Ctrl + G]랍니다.




출처 : http://zzznara2.tistory.com/270


파일을 보는 방법과 코드를 비교해서 보는 방법에 대한 단축키가 있습니다.

아래 단축키를 누르기전에 먼저 비교해볼 수 있는 파일 두개를 여세요.
제가 예제로 아래처럼 1.css 와 2.css 두개를 만들어놨습니다.

메뉴에서 View - Layout 에서 Columns 2 를 클릭해서 두개다 볼 수 있도록 했습니다.
그럼 어떻게 사용하는지 볼까요.


파일 보기

파일보기는 Ctrl + Alt + D 를 클릭하면 됩니다.

위와 같이 두개의 파일을 연 상태에서 Ctrl + Alt + D 를 클릭합니다.

그럼 아래처럼 Compare to View 가 나옵니다. Enter.



그럼 열러있는 파일중에서 동기화, 또는 비교하고자 하는 파일을 선택할 수 있습니다.

저는 포커스가 2.css 에 있을때 단축키를 눌러기때문에 1.css 와 비교할거냐고 아래처럼 물어옵니다. Enter.



그럼 아래처럼 비교해서 다른부분이 있는곳에 포커스가 자동으로 위치하며 보여줍니다.



이제 왼쪽으로 코드를 옮길건지? 오른쪽으로 옮길건지 선택만 하면 됩니다.


비교해서 보기

예제를 보여드리기 위해 위보다는 좀더 복잡한 코드를 넣었습니다.




  • [ctrl]+[alt]+[+] - 다음에 위치한 비교할 곳으로 이동합니다.(눌러보면 압니다. 동기화할 곳의 다음순번으로 갑니다.)
  • [ctrl]+[alt]+[-] - 이전에 위치한 비교할 곳으로 이동합니다.

Ctrl + Alt + D 를 눌러서 진행한 상태입니다.



여기서 Ctrl + Alt + [+] 를 누릅니다.

그럼 바로 첫번째 비교대상을 찾아갑니다



여기서 다시 Ctrl + Alt + [-] 를 클릭하면 이전비교대상인 맨 아래로 갑니다.



  • [ctrl]+[alt]+[,] - 오른쪽에 있는 코드를 왼쪽으로 병합합니다.(여기서 병합은 복사 붙여넣기와 같습니다. 다른코드가 잇을경우 그 코드는 나두고 추가하는것이 아닙니다. 그대로 붙여넣기때문에 기존의 코드는 없어집니다.)
  • [ctrl]+[alt]+[.] - 왼쪽에 있는 코드를 오른쪽으로 병합합니다.
  • [ctrl]+[alt]+[/] + [,] - 오른쪽에 있는 코드를 전부 왼쪽으로 병합합니다.
  • [ctrl]+[alt]+[/] + [.] - 왼쪽에 있는 코드를 전부 오른쪽으로 병합니다.


바로 위의 이미지에서 Ctrl + Alt + , 를 누릅니다.



오른쪽에 코드가 왼족으로 이동된것을 볼 수 있습니다.

  • [ctrl]+[alt]+[enter] - 토글 편집모드(연속해서 눌러보세요. 그럼 압니다.)
  • [ctrl]+[alt]+[left click] - 블록을 선택 및 해제합니다.(복수 선택 가능)
  • [ctrl]+[shift]+[left click] - 왼쪽에서 오른쪽으로 코드를 병합합니다. 그리고 다음 포커스로 이동.
  • [ctrl]+[shift]+[right click] - 오른쪽에서 왼쪽으로 코드를 병합합니다. 그리고 다음 포커스로 이동.



원하는대로 수정한뒤 Ctrl + S 를 클릭하면 저장이 되며 Sublimerge 동기화모드는 사라집니다.

수정한 뒤에는 뒤로 가기나 되돌리기는 안됩니다.

단 저장을 하지않고 취소를 클릭하면 다시 처음 상태로 돌아갑니다.


Sublimerge 는 동기화 플러그인입니다.

편집모드로 해서 진행할때 주의해서 진행해야 합니다.


출처 : http://demun.tistory.com/2379




반응형
2015. 7. 14. 11:49

Soda Theme

Soda Theme 는 매우 유명한 테마입니다.

그만큼 좋다는거겠지요. 서브라임텍스트는 기본 테마만으로 저는 좋아합니다.

좀더 좋은 테마를 찾는분은 sode theme 를 추천합니다.

sode theme는 현재 서브라임텍스트 2,3 모두 지원합니다.

https://github.com/buymeasoda/soda-theme


Install

sode theme 는 서브라임텍스트에서 바로 설치할 수 있습니다.

Ctrl+Shift+P 를 눌러 sode theme 를 선택합니다.



이걸로 설치는 끝입니다. 간단하죠.

좀더 맘껏 사용하기위해 설정을 해봅니다.


설정

Preferences-Settings-User 를 클릭해서 설정파일을 엽니다.

2,3 이 약간 다르니 해당 버젼에따른 설정을 넣어주세요.

  • 테마 활성화

// Sublime Text 2 테마활성화

"theme": "Soda Light.sublime-theme"

// Sublime Text 3 테마활성화

"theme": "Soda Light 3.sublime-theme"


  • 탭설정

서브라임텍스트는 기본이 사각형태의 탭입니다. 이걸 모서리가 약간 둥근형태로 만들어줍니다.


 "soda_classic_tabs" : true


  • 사이드바 폴더 아이콘표시

사이드바에 폴더 아이콘을 표시해줍니다.


"soda_folder_icons" : true 

  • Retina Resolution UI

높은 DPI 디스플레이로 보여줍니다.

  • 고급설정

테마에 대한 고급사용자 설정은 위키 페이지에 설명이 되어 있으니 참고하세요.

위키


  • 구문강조

위 이미지에 보여지는 구문강조색은 흰색버젼은 에스프레스의 컬러셋이고, 어두운버젼은 Monokai 의 수정된 버젼입니다.

이걸 사용하려면 colour-schemes.zip 을 다운로드하시고 압축을 푸세요.

압축을 풀면 2개의 파일이 나옵니다. 그걸 Packages 폴더안에 User 폴더안에 넣어주세요.

Packages 폴더는 Preferences - Browse Packages.. 를 클릭하면 됩니다.

그리고 설정파일에서 아래처럼 입력해줍니다. 아래는 


 "color_scheme": "Packages/User/Monokai Soda.tmTheme"


또는 아래 이미지처럼 선택을 해도 됩니다. 그러면 자동으로 입력이 되어집니다.


출처 : http://demun.tistory.com/2436

반응형
2015. 7. 14. 11:30

SublimeText Theme

서브라임텍스트도 다양한 테마를 지원합니다.

미리볼수 있는 서브라임텍스트 테마 사이트 입니다.

http://devthemez.com/themes/sublime-text-2



이미지를 클릭하면 다운로드 버튼이 생성됩니다.



다운로드를 클릭하면 github 저장소로 이동하며 설치방법이 나옵니다.

하지만 왠만한것은 테마 이름만 알면 구지 이동하지 않아도 서브라임텍스트에서 설치가 가능합니다.

테마에 따른 설정을 해야하는것은 해당 저장소로가서 설정을 추가로 해줘야 합니다.

그래야 완전하 테마를 사용할 수 있습니다.




출처 : http://demun.tistory.com/2435

반응형
2015. 7. 14. 11:28

html에서 태그 감싸는 방법

html에서 텍스트나 태그를 감싸는 태그를 만들때 사용하는 방법입니다.
실무에서 많이 사용하고, 무척이나 유용한 방법이여서 소개합니다.

이 방법은 emmet 플러그인이 설치되어 있어야 합니다.

emmet 설치방법은 이전 블로그 글을 참고하세요.

emmet 설치 및 사용방법

아래 이미지를 보시면 이해가 될겁니다.

텍스트나 태그가 있고, 해당 텍스트를 블럭을 지정하고 Ctrl+Shift+G 를 누릅니다.
여기서 텍스트가 줄이 안맞아도 상관없습니다. 줄까지 잘 맞쳐줍니다.
그럼 서브라임텍스트 하단에 창이 나타납니다.
이제 젠코딩처럼 입력하면 됩니다.

여기서 한가지 팁을 더 드리자면 $ 입니다.
이것은 숫자를 나타냅니다.
그런데 $# 을 누르면 해당 텍스트가 링크에 포함됩니다. 또한 텍스트가 들어가야 할곳에도 들어갑니다.

말로는 힘드니 이미지를 보세요.

단축키의 순서는 아래와 같습니다.


CTRL + Shift + G

ul>li*>a[href="$#"]{$#}


[] 속성을 넣어줍니다.

{} 텍스트를 넣어줍니다.

$# 해당 텍스트를 지정합니다.



출처 : http://demun.tistory.com/2435

반응형
2015. 7. 14. 11:17

Auto Complete 자동완성이란 한개의 문자 또는 몇개의 문자를 입력했을때 팝업으로 입력한 문자의 완성된 글자 또는 단어, 코드를 나타내는 것을 말합니다.

이것은 기본으로 활성화되어 있습니다.

Disabling Auto Complete (자동완성 비활성)

자동완성을 사용하고 싶지 않을때 따로 설정을 통해서 비활성화 시킬수 있습니다.

Sublime Text(서브라임 텍스트)에서 메뉴에서 Prefernces - Settings - Default 를 클릭합니다.




그러면 아래와 같은 화면이 나옵니다.



Ctrl + F 를 눌러서 auto_complete 로 검색을 하면 아래처럼 기본값이 true 로 나온것을 알 수 있습니다.



"auto_complete": false 로 변경하기만 하면 자동완성기능은 끌수가 있습니다.

여기서 한가지 팁을 드리자면 사용자 설정(사용자가 임의로 수정한 설정)은 Preferences - Settings - User 에서 지정하기를 권장합니다.



Manually Showing Completions (수동으로 자동완성 표시)

코드를 작성하다가 수동으로 자동완성을 표시하게 할 수도 있습니다.

예를들어 div 을 입력할려고 할때(html 문서에서) d 만 입력을 한 상태에서 Ctrl + Space 를 누르면 자동완성이 표시됩니다.


역시 이미지를 보면서 설정을 해야 이해가 빨리 갈겁니다.

d 입력후 Ctrl + Space 를 눌렀습니다.


그럼 아래처럼 d 로 시작되는 모든 태그가 팝업으로 보여집니다.



여기서 div 를 선택하려면 그냥 엔터 또는 Tab 를 누르면 됩니다.

또는 아래에 있는 dd 나 del 을 누르고 싶다면 화살표시로 위.아래 이동이 가능합니다.



Commit on Tab(탭키로 자동완성하기)

By default, the selected item in the completion popup will be committed when enter is pressed. This can create ambiguity between committing the completion, and inserting a newline. By setting the auto_complete_commit_on_tab setting to true, enter will insert a newline, and tab will commit the current completion. There are other benefits, too: because Sublime Text knows there is no ambiguity, it will show a more curated list of completions, with the one you want more likely to be in first place.


기본값으로는 자동완성기능이 탭키와 엔터키 둘 다로 동작합니다. 그런데 자동완성을 하면서 엔터키로 새로운 줄을 띄우고 싶을 때가 있습니다. 이 때 auto_complete_commit_on_tab옵션을 사용합니다. 이 옵션은 탭키로만 자동완성이 되게 해서 새 줄을 띄우고 싶을 때 자동완성 팝업이 뜸으로써 꼬이는 일 없이 작동하게 해줍니다.

Enabling Commit on Tab is recommended, but it will take a short time to get used to.

탭키로 자동완성하기 옵션은 추천하는 옵션이지만 익숙해지는데는 약간 시간이 걸릴겁니다.

출처 : http://demun.tistory.com/2377

반응형