Cloud Computing On Demand

세상에는 굉장히 다양한 이미지 포맷이 존재합니다. 압축 포맷의 대명사인 JPG 부터 비트맵으로 이미지를 표현하는 BMP, 투명한 이미지가 필요할 때 많이 찾게되는 PNG 와 간단한 애니메이션 용도로 널리 사용되는 GIF 등이 대표적입니다. 사람들은 각자의 목적에 따라 이런 이미지들을 활용하게 되는데요, 서로 다른 여러가지 포맷을 바꾸어 가면서 사용해야 하는 경우가 간혹 생기곤 합니다. 

예를 들어 프론트엔드 디자이너라고 하면 PNG 포맷을 많이 사용하겠지만 책을 한권 같이 쓰고 있다면 TIFF 포맷이 필요할 수도 있습니다. 다양한 이미지 관련 프로그램이나 플러그인으로 포맷을 변경하는 것도 가능하지만 왠지 상황에 맞게 이미지를 캡쳐 할 때부터 PNG, TIFF 등을 정할 수 있으면 좋을 것 같습니다. OS X 운영체제에는 간단한 터미널 명령으로 기본 내장 캡쳐 옵션으로 이미지를 만들때 사용하는 포맷을 변경할 수 있습니다.

위의 명령을 이용하면 지정된 이미지 포맷으로 쉽게 캡쳐 파일의 형식을 지정할 수 있습니다. && 로 연결된 또 다른 명령은 해당 변경사항이 운영체제를 재부팅 하지 않고 적용될 수 있도록 하기 위한 명령입니다. 간단한 명령이지만 이걸 매번 외워서 치거나 어디에 저장해 두었다가 입력하는 것은 왠지 불합리해 보입니다. 개인적으로는 블로그와 회사 공식 블로그에 글을 올릴때 PNG 를 사용하고 있고 저술 작업을 위해 TIFF 를 쓰고 있어서 아래와 같이 쉘 프로파일을 지정해 보았습니다.

이렇게 지정해두면 터미널이 실행 될때 alias 가 지정되고 간단히 커맨드 프롬프트에서 png, tiff 를 입력하는 것 만으로 쉽게 캡쳐 이미지 포맷을 변경할 수 있습니다. 캡쳐 이미지 포맷을 자주 변경해야 하는 분들이 계시다면 유용하게 활용하실 수 있겠네요!

Sublime Text 에디터는 패키지(Package)를 이용하여 기능을 지속적으로 확장, 보완할 수 있습니다.

워낙 다양한 패키지들이 공개되어 있어 어떤 것을 사용하는게 좋다는 이야기를 드리기 조심스럽지만

자주 행하게 되는 반복 작업에 지친 분들이 있을까봐 좋은 패키지 하나를 소개합니다.

업무 특성상 HTML, CSS, Javascript 그리고 JSON 파일을 많이 다루고 있습니다.

여느 웹 개발자나 서버단의 개발자 분들 역시 그런 경우가 많을 것 같습니다.

그동안은 웹 기반으로 만들어져 있는 들여쓰기 정렬툴, 소위 Pretty Print 도구를 사용했습니다만

오프라인 환경에서 작업할 때는 인터넷 엑세스가 제한되어 불편함이 있었습니다.

오늘 발견한 HTMLPrettyfy 패키치는 node.js 가 설치되어 있는 환경에서 사용 가능한 패키지로

서브라임 텍스트2와 3에서 모두 활용할 수 있는 코드 포맷터입니다.

node.js 가 설치되어 있지 않다면 당연히 사용이 어렵다는 정도가 제약사항이라 하겠습니다.

소스코드가 깃헙에 공개되어 있기 때문에 필요에 따라 SQL 이나 다른 구조화된 포맷이 필요한 텍스트에 대해서

기능을 개발하고 제안하여 참여 가능하다는 것도 기억해 두시기 바랍니다. (누가 SQL 좀... 굽신...)

설치를 위해서는 먼저 서브라임 텍스트의 패키지 매니저를 실행해야 합니다.

맥 환경인 경우 Command + Shift + P 를 누르면 되고 윈도인 경우 Ctrl + Shift + P 를 누르면 됩니다.

까만 에디터 위로 조그만 팝업이 뜨면 "Package Control Install Package"를 입력하여 패키지 설치를 시작하겠습니다.

팝업 창이 리프레시되면 위 이미지처럼 "HTML-CSS-JS Prettify"를 검색하시어 선택합니다.

이미 설치되어 있는 경우 결과창이 나오지 않습니다만 설치가 되어 있지 않은 경우

검색 결과 화면이 나오고 엔터를 누르면 서브라임 텍스트 에디터 하단에 설치 진행 현황이 업데이트 됩니다. 

Before

After

이제 정렬하고자 하는 문서가 활성화된 상태에서 Command + Shift + H (윈도에서는 Ctrl + Shift + H) 를 누르면

예쁘게 들여쓰기와 줄바꿈이 된 문서로 탈바꿈 하게 됩니다. 

node.js 를 사용하면서 가장 애를 먹는 것중 하나가 설치한 모듈을 찾지 못한다는 메세지를 만날때 입니다. 환경에 따라 모듈의 설치 경로가 달라질 수 있고, node.js 가 설치된 모듈을 찾아가는 순서에 영향을 받기 때문입니다. 간단한 몇 가지 명령을 통해 node.js 가 어떤 순서로 모듈을 탐색하는지 확인하고 글로벌 모듈로 설치된 경우 이를 명시적으로 node.js 가 이용할 수 있도록 알려줌으로써 어느정도 문제를 해결할 수 있습니다.

아래와 같이 npm 에서 -g 옵션을 이용하여 모듈을 설치하면 글로벌 모듈로 설치가 됩니다. 프로젝트에 관계 없이 설치된 모듈을 이용할 수 있어야 하는 것이지요. 일부 환경에서는 sudo 명령을 이용하여 관리자 권한으로 설치를 해야 할 수도 있습니다.

이렇게 -g 옵션을 이용하여 글로벌 모듈로 설치하는 경우, 그 경로는 어떻게 될까요? 아래와 같은 명령을 이용하여 글로벌 모듈로 설치하는 경우의 Path 를 확인할 수 있습니다.

간혹 글로벌 옵션을 이용하여 설치한 모듈을 찾을 수 없다고 나오는 문제를 겪고 있다면, 위의 명령으로 확인한 경로를 NODE_PATH 라는 환경 변수에 저장하여 node.js 가 글로벌 모듈을 찾을 때 참조할 수 있도록 명시적인 지정을 할 수 있습니다. 반복적으로 사용해야 하는 값이기 때문에 홈 디렉토리의 .bash_profile 파일에 포함하여 터미널 실행시 셋업되도록 하면 되겠습니다. 윈도 환경에서는 시스템 환경 변수에 넣어주면 됩니다.

글로벌 모듈 이외에 현재 프로젝트에서 모듈을 찾아가는 탐색 순서를 확인하려면 아래와 같이 간단한 자바스크립트 구문을 node.js 를 이용하여 실행해보면 됩니다. 아래의 경로로 모듈을 찾아본 뒤, NODE_PATH 에 지정한 경로까지 탐색하여 현재 환경에서 모듈을 찾고 이용하게 됩니다. 

- NoPD -