Sublime Text(서브라임 텍스트)


지금까지 에디터는 에디터플러스 이후 잠깐 사용하다가 포기해버린 울트라에디트 그리고 최근에 사용하고 있는 Sublime Text(서브라임 텍스트)이다.


에디터플러스는 익숙해지면서 라이센스를 구매하면서 오래 섰고 울트라에디트는 중간중간 버그들로 인해서 아주 잠깐 사용하다가


현재는Sublime Text를 사용한다.


Sublime Text의 강점은 에디터 툴중에 가벼운 편에 속한다. 또한 여러 프로그래밍 언어의 포멧을 지원한다는 것이다.


추가로 다양한 확장 플러그인들이 존재하고 설치 및 적용을 쉽게 할수 있기 때문에 편의성이 극대화되어있다.


버전은 Sublime Text2Sublime Text3 두 가지 버전이 제공 되고 있고 Sublime Text3는 현재 (2015.10.01 기준) 베타 버전이지만 Sublime Text2버전보다 향상된 성능으로 사용하는데 있어서 큰 문제가 없다.


또한 Sublime Text는 모든 OS에서 사용이 가능하도록 OS별 다운로드를 지원을 하고 있다.


Sublime Text의 라이센스 정책은 개인에게는 무료(사용중 중간중간에 라이센스 구입 알람이 뜨지만 그냥 닫아도 계속 사용가능)로 사용하도록 하고 기업에는 라이센스를 사도록 하게 한다.


이미 손에 Sublime Text가 익숙해져서 회사에서 사용하기 위해서 구매를 해야 할지 고민을 하게 된...(하지만 $70의 금액 때문에 아직 결정을 못하였다. ㅠㅠ)


어째든 Sublime Text가 편리한 에디터임에는 분명하다.


Sublime Text의 기능과 Plug-In에 대해서는 다음에 설명하도록 한다.

1. UI Component 의 중앙정렬


최근 모니터의 해상도가 높아져 해상도에 맞추기 위해서


Component 들을 Resizing 하거나 최소 해상도에 width를 고정하여 가운데로 정렬하는 방법을 사용한다.


예를 들면 네이버 사이트 처럼 가운데 위치하도록 구성하여 양 옆의 사이드를 여백으로 두는 UI 구조를 만들고 싶을 경우가 생긴다.


CSS에 다음과 같은 클래스를 추가하고 가운데 정렬한 Component Class를 적용한다.


.div-center {margin: 0 auto;}

또는

.div-center {

margin-left: auto;

margin-right: auto;

width: 800px;;

background-color: #33ccff;

}


2. Text의 중앙정렬


CSS에 다음과 같은 클래스를 추가하여 클래스를 적용한다.


.txt-left  {text-align: left;}          // 글 왼쪽정렬

.txt-center {text-align: center;}     // 글 가운데정렬

.txt-right {text-align: right;}         // 글 오른쪽정렬



PHP에는 numner_format() 가 있어 숫자 타입의 데이터에 콤마(,) 또는 소숫점(.)을 표현 하는데 큰 어려움이 없지만


Javascript 에는 위의 함수가 없기 때문에 숫자 타입의 데이터에 3자리마다 콤마를 찍어 출력하고 싶은 경우 다음 함수를 만들어 사용한다.



<실행결과>

1) 결과와 같이 숫자타입의 문자열이 들어가면 3자리 마다 콤마(,)를 삽입하여 리턴해준다.

var res = gfnNumberFormat("10000")

"10,000"


2) 소수점 숫자타입의 문자열도 문제없이 콤마(,)를 삽입하여 리턴해준다.

var res = gfnNumberFormat("1000000.00")

"1,000,000.00"


3) 한글문자열이 입력되면 한글 그대로 출력해준다.

var res = gfnNumberFormat("한글테스트")

"한글테스트"


4) 영문문자열이 입력되면 영문 그대로 출력해준다.

var res = gfnNumberFormat("abcdefg")

"abcdefg"


함수는 구현 방법에 따라 다르게 구현 할 수 있는데, 위의 함수는 정규식을 이용하여 구현하였기 때문에 한글, 영문, 숫자타입, 소수점에 대해서 예외처리 없이 구현할 수 있다.

'프로그래밍 > Javascript' 카테고리의 다른 글

Form에서 데이터 전송시 주의할 점  (0) 2015.10.12

+ Recent posts