블로그 이미지
윤영식
Frontend Application Architecter, Full Stacker, KnowHow Dispenser and Bike Rider

Publication

Statistics Graph

Category

Recent Comment

2013.08.22 17:52 Dev Environment/Sublime Text

Sublime Text 2 에서 3 으로 업그레이드를 해보자.


1. 설치 

  - 다운로드 받아서 설치한다



2. Package Control 설정 

  - 수작업으로 해야 한다 (Mac 기준)

  - Git이 필요하다 

  - 우선 Packages로 이동하고 git clone을 통하여 "Package Control"을 다운로드 받는다

// 하기 디렉토리로 이동 

/Library/Application Support/Sublime Text 3/Packages


$ git clone https://github.com/wbond/sublime_package_control.git "Package Control"

Cloning into 'Package Control'...

remote: Counting objects: 2524, done.

remote: Compressing objects: 100% (1005/1005), done.

remote: Total 2524 (delta 1654), reused 2369 (delta 1506)

Receiving objects: 100% (2524/2524), 823.53 KiB | 56.00 KiB/s, done.

Resolving deltas: 100% (1654/1654), done.

  - 터미널에서 sublime text 3 바로 수행할 수 있도록 심볼릭 링크 설정 

// 하기 디렉토리로 이동

/bin


$ sudo ln -s /Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl subl

$ ls 

lrwxr-xr-x   1 root  wheel       62  8 22 17:42 subl -> /Applications/Sublime Text.app/Contents/SharedSupport/bin/subl



3. 인기 패키지 설치 

  - 많이 사용하는 것들을 Package Control Installer를 이용하여 설치한다 : 인기 10 Top Package

  - 단축키 : command + shift + p  => install 타입핑하면 "Package Control : install package" 문구를 선택함 



<참조>

  - Package Control 설치하기 

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

가상머신 관리도구인 Vagrant를 통하여 Node.js + MongoDB 개발환경을 구축해 본다.



1. 설치 

  - VirtualBox 다운로드 및 설치

  - Vagrant 다운로드 및 설치

  - Vagrant 환경 설정

    + 프로젝트 디렉토리를 하나 만든다. 또는 기존 Project가 있으면 디렉토리로 이동한다. VirtualBox에 원하는 이미지를 다운로드하여 설치한다. 이미지는 Vagrant에서 패키징한 Box를 다운로드할 수 있는 별도 사이트 제공한다 

    + Box는 기본설정과 OS가 설치된 VM 템플릿 이미지이다 

// 형식 : vagrant box add [title] [download-url] 

$ vagrant box add centos64 http://developer.nrel.gov/downloads/vagrant-boxes/CentOS-6.4-x86_64-v20130427.box

Downloading or copying the box...

    + 프로젝트를 초기화 한다

vagrant init centos64


// 결과 : 환경설정 파일 1개 생성됨 

Vagrantfile 



2. 가상머신 기동

  - Vagrant 통해 가상머신 기동하기 

// 기동

$ vagrant up

Bringing machine 'default' up with 'virtualbox' provider...

[default] Importing base box 'centos64'...

[default] Matching MAC address for NAT networking...

[default] Setting the name of the VM...

[default] Clearing any previously set forwarded ports...

[default] Creating shared folders metadata...

[default] Clearing any previously set network interfaces...

[default] Preparing network interfaces based on configuration...

[default] Forwarding ports...

[default] -- 22 => 2222 (adapter 1)

[default] Booting VM...

[default] Waiting for VM to boot. This can take a few minutes.

[default] VM booted and ready for use!

[default] Mounting shared folders...

[default] -- /vagrant


// VirtualBox VM이 자동으로 수행된 것을 볼 수 있다 

// VM 들어가기 : 같은 디렉토리면 ssh를 n개까지 open 가능 

// ssh를 통하여 별도의 VM 으로 들어갈 수가 있는 것이다. 

// 단, vagrant init [title] 된 Vagrantfile 파일이 같은 디렉토리에 있어야 함

$ vagrant ssh

Welcome to your Vagrant-built virtual machine.

[vagrant@localhost ~]$ 


// 정지

$ vagrant halt



3. Node.js & MongoDB, etc 개발환경 구축하기 

  - 제일 먼저 yum update 수행, 프로젝트 파일과 관계없는 운영 미들웨어 및 데이터베이스 설정이다. 

  - CentOS 64bit Node.js 설치하기 

    + 컴파일해서 설치함

  - CentOS 64bit MongoDB 설치하기 

  - CentOS 64bit Git 설치하기

  - Yeoman work flow 환경도 설치

    + yeoman, grunt, bower 설치 : sudo npm install -g yo grunt-cli bower

    + yeoman generator 설치 : sudo npm install -g generator-webapp

  - Sails.js Framework 기반 개발을 위하여 설치

    + sudo npm install -g sails@0.8.9

    + 버전 지정안하면 최신 버전인 0.9.5 설치됨



4. 애플리케이션 활용하기 

  - 개발환경을 구축하고 자신의 로컬머신에 있는 프로젝트 파일을 VM에도 설치해야 하는가?

    재배포 필요없이 로컬에 있는 파일을 VM에 sync folder 기능을 이용하여 Share 할 수 있다 

  - 프로젝트 파일 공유 : Vagrantfile 내역 (참조)

// 형식 

config.vm.synced_folder "[내 로컬머신의 디렉토리 절대경로]", "[VM에 로딩할 절대경로와 가상디렉토리명 지정]"


// 설정 예

config.vm.synced_folder "/Users/development/smart-solutions/SmartStatistics", "/home/vagrant/SmartStatistics"


// VM reloading 및 결과 

/Users/development/smart-solutions/SmartStatistics> vagrant reload

[default] Attempting graceful shutdown of VM...

[default] Setting the name of the VM...

.. 중략 ..

[default] Mounting shared folders...

[default] -- /vagrant

[default] -- /home/vagrant/SmartStatistics


/Users/development/smart-solutions/SmartStatistics> vagrant ssh

Last login: Mon Aug 12 08:09:35 2013 from 10.0.2.2

Welcome to your Vagrant-built virtual machine.

[vagrant@localhost ~]$ sudo iptables -F

[vagrant@localhost ~]$ cd SmartStatistics/

[vagrant@localhost SmartStatistics]$ pwd

/home/vagrant/SmartStatistics

  - 로컬과 VM의 파일을 서로 Share하였고 서버를 뛰우면 VM에서도 동일 Port로 뜰 것이다. 예) Sails는 default 1337 port를 사용한다 

     VM은 1337 port 를 사용하고 로컬 머신은 1338 port를 사용해서 port forwarding을 한다. 

     즉, 로컬 머신의 브라우져에서 http://localhost:1338 호출하면 VM의 1337 port를 통하여 서비스가 이루어진다(Port Forwarding)

  - 포트 충돌 해결 : Vagrantfile 내역 (참조)

// 형식 

config.vm.network :forwarded_port, guest: [VM에서 사용할 port번호], host: [내 로컬머신에서 사용할 port 번호]


// 설정 예 

config.vm.network :forwarded_port, guest: 1337, host: 1338


// VM reloading 및 결과

/Users/development/smart-solutions/SmartStatistics> vagrant reload

[default] Attempting graceful shutdown of VM...

[default] Setting the name of the VM...

[default] Forwarding ports...

.. 중략 ..

[default] -- 22 => 2222 (adapter 1)

[default] -- 1337 => 1338 (adapter 1)

[default] Booting VM...

[default] Mounting shared folders...

[default] -- /vagrant

[default] -- /home/vagrant/SmartStatistics

 

- vagrant VM

[vagrant@localhost SmartStatistics]$ netstat -na | grep 1337

tcp        0      0 0.0.0.0:1337                0.0.0.0:*                   LISTEN


- local my machine

/Users/development/smart-solutions/SmartStatistics> netstat -na|grep 1338

tcp4       0      0  *.1338                 *.*                    LISTEN

  - 테스트 수행 : port forwarding이 안될 경우 "sudo iptables -F" 를 통하여 강제 재설정을 해준다. 그리고 다시 curl 수행하여 체크 

// curl 이용하여 호출을 했는데 결과값이 나오지 않으면 iptables 에 대한 설정을 해준다 

/Users/development/smart-solutions/SmartStatistics> curl -v http://localhost:1338/

* About to connect() to localhost port 1338 (#0)

*   Trying ::1...

* Connection refused

*   Trying 127.0.0.1...

* connected

* Connected to localhost (127.0.0.1) port 1338 (#0)


// vagrant ssh (port forwarding이 안될 경우)

// 하기 명령을 .bash_profile 에 넣어서 자동화 한다 

/Users/development/smart-solutions/SmartStatistics> vagrant ssh

Last login: Mon Aug 12 08:09:35 2013 from 10.0.2.2

Welcome to your Vagrant-built virtual machine.

[vagrant@localhost ~]$ sudo iptables -F

  - 로컬 머신의 브라우져에서 호출 : "http://localhost:1338"



5. Package 만들기 

  - 기존에 쓰던 VM 이미지를 Vagrant의 Box로 만들어서 개발환경을 미리 패키징할 수 있다  

// 형식 : vagrant package --base <target> --output <output>.box



6. Provisioning 하기

   

  - Vagrant up 수행시 최초 실행되는 매크로 관리 도구인 Chef를 사용한다

  - Chef Solo Provisioning 을 하면 Chef Server가 필요없이 사용할 수 있다 

  - Opscode Cookbooks 에서 원하는 receipe 를 내려받아서 설정해 놓으면 자동 실행된다 



<참조>

  - Vagrant 설치 및 기동

  - SKPlanet의 Vagrant 설치 및 자료

  - Vagrant, Chef 살펴보기 

  - Chef Server 설치하기 튜토리얼

  - KTH의 Chef 블로깅

    


저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

맥북에서 한글/영문 전화하기 위해서 왼쪽 Command + Space를 사용한다. 윈도우에 익숙한 분이라면 Space오른쪽의 한글/영문 Key가 익숙할 것이고 맥북에서 오른쪽 Command를 통해 한글/영문 바꾸는 기능을 설정해 보자


1. keymap 프로그램 설치

   - https://pqrs.org/macosx/keyremap4macbook/ 여기가서 다운로드 설치 -> 자동 OS rebooting 된다

    


 

2. 환경 설정하기

  - 설치를 하고 나면 상단에 사각형의 아이콘이 생깁니다. 해당 아이콘의 ContextMenu에서 Preferences... 를 선택함

   


  - 하기 부분 Check하면 끝! : Command_R to Command_R ( + When you type Comman_R only, toggle IM) When you type Command_R only, send Command+Space (except virtual machine, RDC)


드디어 "오른쪽 Command" Key 하나만 눌러도 한/영 문자가 전환됩니다. 물론 기존의 왼쪽 Command+Space도 동작합니다.


<참조>

  - 맥 키를 내맘대로

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
TAG Mac

JetBrains의 WebStorm v6 을 설치하고, Sublime Text 2와 같은 검은색 바탕의 스킨을 사용하고 싶다면 다음과 같이 조정을 한다 



1. 이미 만들어진 커스텀 스킨사용

  - Darcula 스킨사용 : 최신버전에 포함되어 있으나 editor 부분이 회색으로 가시성이 약간 떨어진다

  

  코드 에디터 상의 스킨 색감 : Warning 표기 (점선)이 너무 많이 나온다. 알거덩 없어져라...^^;

  



2. 에디터를 Sublime Text 2 와 같은 스킨으로 변경하기 

  - 검정색 바탕으로 변경하여 가시성을 주고, 색감도 원색으로 변경한다

  - Warning 점선등의 보고 싶지않은 선들을 없앤다

  


  - 첨부파일을 Import 한다 (참조에 첨부파일)

    + WebStorm -> File -> Import Settings... 

    + 첨부파일을 선택하고 Color와 관련된 것만 선택하여 설정한다

    



<참조>

  - Sublime Text 2 형태로 수정된 환경파일 (단, WebStorm v6 최신버전만 가능) 

Webstorm-Dracular-Dowon-Setting_Full.jar

  - WebStorm Import/Export Setting 메뉴얼


저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
TAG WebStorm
2013.06.07 14:16 Dev Environment/Sublime Text

1. 맥

General

⌘Tgo to file
⌘⌃Pgo to project
⌘Rgo to methods
⌃Ggo to line
⌘KBtoggle side bar
⌘⇧Pcommand prompt
⌃ `python console
⌘⇧Nnew window (useful for new project)

Editing

⌘Lselect line (repeat select next lines)
⌘Dselect word (repeat select others occurrences in context for multiple editing)
⌃⇧Mselect content into brackets
⌘⇧↩insert line before
⌘↩inter line after
⌃⇧Kdelete line
⌘KKdelete from cursor to end of line
⌘K⌫delete from cursor to start of line
⌘⇧Dduplicate line(s)
⌘Jjoin lines
⌘KUupper case
⌘KLlower case
⌘ /comment
⌘⌥ /block comment
⌘Yredo or repeat
⌘⇧Vpast and ident
⌃ spaceautocomplete (repeat to select next suggestion)
⌃Mjump to matching brackets
⌘Usoft undo (movement undo)
⌘⇧Usoft redo (movement redo)

XML/HTML

⌘⇧Aselect content into tag
⌘⌥ .close tag

Find/Replace

⌘Ffind
⌘⌥Freplace
⌘⌥Gfind next occurrence of current word
⌘⌃Gselect all occurrences of current word for multiple editing
⌘⇧Ffind in files

Splits/Tabs

⌘⌥1single column
⌘⌥2two columns
⌘⌥5grid (4 groups)
⌃[1,2,3,4]focus group
⌃⇧[1,2,3,4]move file to group
⌘[1,2,3…]select tab

Bookmarks

⌘F2toggle bookmark
F2next bookmark
⇧F2previous bookmark
⌘⇧F2clear bookmarks

Marks

⌘K spaceset mark // ⌘K; for me
⌘KWdelete from cursor to mark
⌘KAselect from cursor to mark
⌘KGclear mark




2. 윈도우

Sublime Text 2 shortcut
영어한글단축키설명
New File새파일Ctrl+N새문서나 새파일을 만듬.
Open File열기Ctrl+O새문서나 새파일을 열기
Open Folder폴더열기폴더열기
Open Recent최근문서열기최근문서열기
Reopen with Encoding인코딩해서 다시열기인코딩해서 다시열기
New View into File새로보기현재의 문서를 새탭에 열러서 새로보기
Save저장Ctrl+S저장
Save with Encoding인코딩해서 저장현재의 문서 인코딩변경해서 저장
Save as새로 저장Ctrl+Shift+S다른 이름으로 저장
Save All모두저장모두저장
New Window새창으로 열기Ctrl+Shift+N에디터를 두개이상 실행하고자 할때 새창으로 열기
Close Window새창 닫기Ctrl+Shift+W탭이 아닌 창으로 닫기
Close File닫기Ctrl+W탭 또는 창 닫기
Revert File파일되돌리기수정되기전으로 파일을 되돌립니다.
Colse All Files모든파일닫기모든 파일 닫기
Exit나가기나가기
Undo Insert Characters문자삽입취소Ctrl+Z삽입한 문자를 취소할때 사용합니다
Repeat Insert Characters문자삽입반복Ctrl+Y문자 삽입 반복
Undo Insert Characters문자삽입취소Ctrl+U문자 삽입 취소
Soft RedoCtrl+Shift+U소프트 다시 실행
Copy복사Ctrl+C복사
Cut자르기Ctrl+X자르기
Paste붙여넣기Ctrl+V붙여넣기
Paste and indent붙여 넣기 및 들여 쓰기Ctrl+Shfte+V붙여 넣기 및 들여 쓰기
Indent들여쓰기Ctrl+]들여쓰기
Unindent내어 쓰기Ctrl+[내어 쓰기
Reindent다시들여쓰기들어쓰기나 내어쓰기한 경우 다시 되돌리는 기능
Swap Line Up한줄위로Ctrl+Shift+Up현재의 행을 윗행과 교체합니다
Swap Line Down한줄아래로Ctrl+Shift+Down현재의 행을 아랫행과 교체합니다
Duplicate Line행 복사Ctrl+Shift+D현재의 행을 아래에 복사해서 붙여넣어줌
Delete Line행 삭제Ctrl+Shift+K현재의 행을 삭제하고 위로 이동함.
Join Lines행 합침Ctrl+J다음줄을 현재의 줄에 합류시킵니다.
Toggle Comment주석 전환Ctrl+/주석을 만들고 없애는 기능
Toggle Block CommentCtrl+Shift+/요소가 포함된 블럭 전체를 주석처리함.
Insert Line BeforeCtrl+Shift+Enter블럭 앞에 행 삽입
Insert Line AfterCtrl+Enter블럭 뒤에 행 삽입
Delete Word ForwardCtrl+Delete커서 뒤 단어 삭제
Delete Word BackwardCtrl+Backspace커서 앞 단어 삭제
Delete Line한줄삭제Ctrl+Shift+K한줄을 삭제합니다
Delete to End끝단어삭제Ctrl+K,Ctrl+k커서 다음부터 끝줄까지 삭제
Delete to Beginning앞단어삭제Ctrl+k,Ctrl+Backspace커서 앞에 있는줄까지 삭제
Transpose바꾸기Ctrl+T커서 왼쪽과 오른쪽 단어를 바꿈
Close Tag태그닫기Alt+.열려있는 태그요소 닫기
Expand Selection to TagCtrl+Shift+A현재 커서가 위치한 요소의 전체 블럭을 선택영역으로 만들기
Wrap Selection With Tag태그 묶음 선택Alt+Shift+W
Set Mark마크설정Ctrl+K,Ctrl+Space번호 마크를 생성합니다
Select To Mark마크 선택Ctrl+K,Ctrl+A현재커서부터 마크까지 선택
Delete To Mark마크삭제Ctrl+K,Ctrl+W만들어놓은 마크를 삭제합니다
Swap With Mark마크교체Ctrl+K,Ctrl+X전에있던 마크를 현재있던 곳으로 교체합니다
Clear Mark마크삭제Ctrl+K,Ctrl+G있던 마크를 삭제합니다
YankCtrl+k,Ctrl+Y마크영역을 현재 요소안에 삽입합니다
Fold접기Ctrl+Shfit+[바로 위 부모까지 접기
Unfold펴기Ctrl+Shift+]바로 아래 자식까지 펴기
Unfold All모두 펴기Ctrl+K,Ctrl+j모두 펴기
Fold All모두접기Ctrl+K,Ctrl+1빈줄없이 모두 접습니다
Fold Level 2Ctrl+K,Ctrl+2
Fold Level 3Ctrl+K,Ctrl+3
Fold Level 4Ctrl+K,Ctrl+4
Fold Level 5Ctrl+K,Ctrl+5
Fold Level 6Ctrl+K,Ctrl+6
Fold Level 7Ctrl+K,Ctrl+7
Fold Level 8Ctrl+K,Ctrl+8
Fold Level 9Ctrl+K,Ctrl+9
Fold Tag AttributesCtrl+K,Ctrl+T현재 블럭에 있는 어트리뷰트 태그요소를 접습니다
Title Case첫문자만 대문자로 만듭니다
Upper CaseCtrl+K,Ctrl+U대문자로 만듭니다
Lower Case소문자화Ctrl+K,Ctrl+L소문자로 만듭니다
Swap Case대문자를 소문자로, 소문자를 대문자로 변환
Wrap Paragraph at RulerAlt+Q들여쓰기가 모아짐
Show CompletionsCtrl+Space자동완성 툴팁 표시
Sort LinesF9라인에 맞쳐정렬
Sort Lines(Case Sensitive)Ctrl+F9라인에 맞쳐정렬(대소문자 구분)
Split into LinesCtl+Shift+L선으로 분할
Add Previous LineCtrl+Alt+Up커서를 위로 한행 추가하여 준비합니다
Add Next LineCtrl+Alt+Down커서를 아래로 한행 추가하여 준비합니다
Single Selection단일선택Escape단일 선택
Select All모두선택Ctrl+A모두 선택
Expand Selection to Line행선택Ctrl+L행으로 선택영역을 확장합니다
Expand Selection to Word단어선택Ctrl+D단어로 선택영역을 확장합니다
Expand Selection to ScopeCtrl+Shift+Space범위에 있는 모든것으로 선택을 확장합니다
Expand Selection to BracketsCtrl+Shift+M
Expand Selection to IndentationCtrl+Shift+J들여 쓰기로 선택영역 확장
Expand Selection to TagCtrl+Shift+A태그영역안까지 선택영역 확장
Find찾기Ctrl+F찾기
Find Next다음찾기F3다음찾기
Find PreviousShift+F3
Incremental Find이전찾기Ctrl+I이전 찾기
Replace대체Ctrl+H문자열을 대체할때 사용합니다.
Replace Next전부대체Ctrl+Shift+H한번에 모든 문자열을 대체합니다
Quick Find빨리찾기Ctrl+F3빨리찾기
Quick Find AllAlt+F3빠른 모두 찾기
Quick Add NextCtrl+K,Ctrl+D빠른 다음 추가
Use Selection for FindCtrl+E
Use Selection for ReplaceCtrl+Shift+E
Find in FilesCtrl+Shift+F파일에서 원한는 영역찾고, 대체하기
Show Results Panel결과 패널 표시
Next ResultF4다음 결과
Previous ResultShift+F4이전 결과
Side BarCtrl+K,Ctrl+B사이드바 열기 닫기
Show Console콘솔 보기Ctrl+`에디터에서 사용하는 콘솔 보기
Enter Full ScreenF11전체 화면으로 전환
Enter Distraction Free ModeShift+F11전체화면에서 가운데에 위치한 모드로 전환
Single싱글Alt+Shift+1에디터 하나로 보기
Columns:2컬럼:2Alt+Shift+2좌우로 두개의 컬럼으로 보기
Columns:3컬럼:3Alt+Shift+3좌우로 세개의 컬럼으로 보기
Columns:4컬럼:4Alt+Shift+4좌우로 네개의 컬럼으로 보기
Rows:2Alt+Shift+8상하로 두개의 컬럼으로 보기
Rows:3Alt+Shift+9상하로 세개의 컬럼으로 보기
Grid:4Alt+Shift+5상하로 네개의 컬럼으로 보기
Group 1Ctrl+1
Group 1Ctrl+Shift+1
Spell CheckF6맞춤법 검사
Next MisspellingCtrl+F6다음 철자 오류
Prev MisspellingCtrl+Shift+F6이전 철자 오류
Goto AnythingCtrl+P바로가기
Goto SymbolCtrl+R심볼 바로가기
Goto LineCtrl+G행 바로가기
Next FileCtrl+Pagedown다음 탭으로 가기
Previous FileCtrl+Pageup이전 탭으로 가기
Next File in StackCtrl+Tab다음문서에서 스택으로 바로가기
Previous File in StackCtrl+Shift+Tab이전문서에서 스택으로 바로가기
Switch HeaderAlt+O해더 타이틀 변경
Scroll to SelectionCtrl+K,Ctrl+C커서가 있는 곳으로 스크롤
Line Up한줄올림Ctrl+Up보여지는 영역이 한줄 올라감
Line Down한줄내림Ctrl+Down보여지는 영역이 한줄 내려감
toggle BookmarkCtrl+F2책갈피 전환
Next BookmarkF2다음 책갈피
Prev BookmarkShift+F2이전 책갈피
Clear BookmarksCtrl_Shift+F2책갈피 삭제
Select All BookmarksAlt+F2모든 책갈피를 선택
Jump to Matching BracketCtrl+M일치하는 브라켓으로 이동
Command Palette..명령 팔레트Ctrl+Shift+P명령 팔레트를 불러옴
Build생성Ctrl+B새로운 형식으로 생성함
Cancel Build생성취소Ctrl+Break생성취소
Show Build Results생성한 결과 보기
Next ResultF4다음 결과 보기
Previous ResultShift+F4이전 결과 보기
Record Macro매크로기록Ctrl+Q매크로 기록을 시작함.
Playback MacroCtrl+Shift+Q매크로 재생
Save Macro매크로 저장
Macro매크로
Open Project프로젝트열기프로젝트 열기
Clear Items아이템 삭제
Switch Project in WindowCtrl+Alt+P새로운 윈도우를 열어서 프로젝트 전환함
Save Project As..프로젝트 저장
Close Project프로젝트 닫기
Edit Project프로젝트 편집
Add Folder to Project프로젝트에 폴더 추가
Remove all Folders..모든 폴더를 삭제
Refresh Folders폴더 새로 고침
Browse Packages브라우져패키지플러그인이 들어있는 폴더 열기
Settings-Default기본 설정
Settings-User사용자 설정
Syntax Specific-User사용자 문법
Distraction Free-User
Key Bindings-Default키 바인딩 기본설정
Key Bindings-User키 바이딩 사용자설정
Create Public Gist..Ctrl+K,Ctrl+I발행할 Gist 만들기
Create Private Gist..Ctrl+K,Ctrl+P개인적인 Gist 만들기
Open Gist..Ctrl+K,Ctrl+OGist 열기
Insert Gist..Ctrl+K,Ctrl+[Gist 삽입
Add File to Gist..Ctrl+K,Ctrl+]

Gist에 파일 첨부


<참조>

  - 원문 : http://demun.tistory.com/2239

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

크롬 기반으로 개발을 시작할때 개발자라면 Chrome Canary로 시작해 보자. 최신 기능들이 포함되어 있으며 Dev Tool이 좀 더 막강하다. 거의 개발툴 수준이라고 할까?



1. Chrome Canary 설치

  - https://www.google.com/intl/ko/chrome/browser/canary.html

  - Google의 Dev Tools 강좌




2. 오스마니님 강좌

  - google+에 지속적의 자신의 활동을 올리고 있다. 구글러이면서 Yeoman의 개발자이다. 오스마니님 친구추천 ^^

  - 2013년도에는 크롬 개발툴로 생산성을 증진시키자

    + 코드 에디팅 및 로컬 히스토리 저장 

    + 코드 리비젼 기능

    + 코드 에디터에 있는 cmd+o (소스 열기), cmd+shift+o (소스 특정 위치 찾기), cmd+L(특정 라인 이동), cmd+F (특정 키워드 찾기)

    + beakpoint 통한 디버깅 

    + minify 된 코드의 beautify 하기

    + 개발툴 layout 개선 

    + Grunt 툴 통합

    + PageSppeed 툴 통합

    

 


3. 테스팅 및 디버깅

  - 모바일 기기 해상도별 테스트하기 

  - 자바스크립트 디버깅하기



<참조>

  - 오스마니님의 최근 Yeoman 강좌

  - 까나리 액젓된 크롬

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

AngularJS의 테스트툴로 Testacular를 사용하는데 명칭이 Karma로 바뀌었다. WebStorm에 설정하고 사용하는 방법을 알아보자 



1) Karma 설치하기

  - 홈페이지 : http://karma-runner.github.io/0.8/index.html

  - 선조건 : WebStorm 설치 및 Node.js 설치

  - Karma를 global로 설치 : npm install -g karma



2) Yeoman을 통한 Karma 환경설정 

  - 일반적으로 Yeoman을 통하여 스케폴딩 코드를 만들어 사용하는 것이 좋다 : Yeoman 홈페이지

  - yeoman 설치 : npm install -g yo grunt-cli bower

  - angular 프로젝트 만들기 : yo angular 또는 yo angular:app

    

    <자동 생성된 파일 및 디렉토리 구조>


  - 자동 생성된 karma 테스트 환경파일 : karma.conf.js

/ Karma configuration
 
// base path, that will be used to resolve files and exclude
basePath = '';
 
// list of files / patterns to load in the browser
files = [
JASMINE,
JASMINE_ADAPTER,
'app/components/angular/angular.js',
'app/components/angular-mocks/angular-mocks.js',
'app/scripts/*.js',
'app/scripts/**/*.js',
'test/mock/**/*.js',
'test/spec/**/*.js'
];
 
// list of files to exclude
exclude = [];
 
// test results reporter to use
// possible values: dots || progress || growl
reporters = ['progress'];
 
// web server port
port = 8080;
 
// cli runner port
runnerPort = 9100;
 
// enable / disable colors in the output (reporters and logs)
colors = true;
 
// level of logging
// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
logLevel = LOG_INFO;
 
// enable / disable watching file and executing tests whenever any file changes
autoWatch = false;
 
// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera
// - Safari (only Mac)
// - PhantomJS
// - IE (only Windows)
browsers = ['Chrome'];
 
// If browser does not capture in given timeout [ms], kill it
captureTimeout = 5000;
 
// Continuous Integration mode
// if true, it capture browsers, run tests and exit
singleRun = false;



3) WebStorm 환경설정

  - Server 설정하기 

    + 웹스톰 상단의 메뉴에서 Edit Configurations... 클릭

    

   + Node.js로 "Karma Server" 생성 : node.js, karma 설치 위치와 프로젝트 위치, 파라미터로 start 입력

      카르마의 테스트 서버 역할을 수행


    + Karma Run 생성 : 파라미터로 run 입력, 테스트를 수행한다 


    + Karma Debug : JavaScript Debug의 Remote로 생성 

       Remote URL 로 "http://localhost:8080/" 입력 



4) 테스트 수행하기 

  - Karma Server 시작하기 

    + Karma Server 선택하고 > 시작 버튼 클릭

    + 하단에 localhost:8080 으로 Listen하는 서버 구동됨 

    + 브라우져가 자동 실행 : 자동 실행안되면 브라우져 띄워서 8080 호출 



  - Karma Run 테스트 하기 

    + 테스트 수행하기 

    + 테스트가 정상 수행되면 SUCCESS가 나온다. 비정상이면 FAILED 메세지


  - Karma Debug

    + 소스 코드에 Break point를 만들고 디버그 수행

    + 테스트 해본 결과 잘 안되는데 향후 다시 한번 체크해 봐야 겠다



5) 테스트 코드 

  - BDD 방식의 테스트 코드를 짠다 

//////////////

// 업무 코드 

'use strict';
 
var app = angular.module('eggheadioApp');
 
app.controller('MainCtrl', function ($scope) {
$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
}) ;
 
app.factory('Data', function() {
return {message: 'shared data'}
});
 
app.filter('reverse', function(Data) {
return function(text) {
return text.split("").reverse().join("");
}
});


//////////////////////////

// 필터에 대한 테스트 코드 

describe('filter', function() {
beforeEach(module('eggheadioApp'));
 
describe('reverse', function() {
it('should reverse a string', inject(function(reverseFilter){ //reverse라는 Filte 파라미터
expect(reverseFilter('ABCD')).toEqual('DCBA');
}))
})
})



<참조>

  - 원본 : 유튜브 동영상

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

Chrome 의 Dev Tools에 Backbone/Ember/AngularJS 프레임워크 및 CoffeeScript Console을 확장해 본다. 

최종 확장한 모습이다 



1) CoffeeConsole 

  - 로컬에 파일 복제 : git clone https://github.com/snookca/CoffeeConsole.git

  - CoffeeConsole 폴더 밑에 coffeeconsole.crx 파일 존재

  - 크롬브라우져 URL 입력창에 chrome://extensions/  호출

  - coffeeconsole.crx 파일을 "확장프로그램 설치"창으로 drag&drop 하고 팝업창뜨면 설치 OK

  - 결과 확인 (크롬 : command+option+i)

  

  좌측에서 커피코드를 짜면 우측에서 실시간 해석되어 자바스크립트 코드가 보인다



2) BackboneJS

  - 로컬에 파일 복제 : git clone https://github.com/spect88/backbone-devtools.git

  - 크롬브라우져 URL 입력창에 chrome://extensions/  호출

  - "압축해제된 확장 프로그램 로드.." 버튼 클릭 -> backbone-devtools 폴더 선택하고 OK

  - [] Inject Backbone.Debug 를 선택하면 DevTools을 띄운 페이지가 reload된다 

  

  ** 결정적 단점은 AMD가 아직 지원이 안된다 ㅠ.ㅠ; 그냥 <script> 태그 통해서 BackboneJS 로딩해야 함

      window.Backbone available on DOMContentLoaded (no require.js support as of now, sorry)

  ** QUnit 이나 Mocha를 통하여 TDD 할 때 사용하면 된다. 



3) EmberJS

  - 로컬에 파일 복제 : git clone https://github.com/tildeio/ember-extension.git

  - 크롬브라우져 URL 입력창에 chrome://flags/ 호출하고 "실험실 확장 프로그램 API" 사용을 해야한다 

  - 크롬브라우져 URL 입력창에 chrome://extensions/  호출

  - "압축해제된 확장 프로그램 로드.." 버튼 클릭 -> backbone-devtools 폴더 선택하고 OK

  - Ember가 추가되었다  

  


4) AngularJS

  - 로컬에 파일 복제 : git clone https://github.com/angular/angularjs-batarang.git

  - 크롬브라우져 URL 입력창에 chrome://extensions/  호출

  - "압축해제된 확장 프로그램 로드.." 버튼 클릭 -> backbone-devtools 폴더 선택하고 OK

  - AngularJS 설치 화면 

  


Build Tool인 Grunt 또한 확장을 할 수가 있다. Grunt와 함께 확장툴은 사용하면서 다시 블로깅하기로 한다. 



<참조>

  - 원문 : DevTools Extensions in Chrome for Developers

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

크롬을 사용하면서 개발이나 디자인시에 유용한 Extension을 설치하여 사용하자



1) 개발 및 디자인시 꼭 설치해야할 것들 

  - 25 가지 유용한 크롬용 익스텐션 툴들

    + 창 사이즈를 다양하게 띄워서 Responsive Web 테스트

    + Ruler를 통한 사이즈 크기 측정

    + FireBug lite for Chrome : 버그 있어서 제거함

    + Speed Tracer

    + Trello 는 Scrum 도구로 사용하고 있음 : PC, Android, iPhone, iPad 지원하는 서비스

    + getPocket 은 현재 보고 있는 화면 저장 및 태깅 : PC, Android, iPhone, iPad 지원 서비스

   



2) 크롬 Inspector의 바탕 스킨 바꾸기

  - 크롬 바탕색을 검은색으로 변경, 여러 스킨들 소개

  - chrome-devtools://devtools/devTools.css  호출하면 기본 css가 나옴

  - https://gist.github.com/bentruyman/1150520   의 Custom.css 파일로 대체한다 

    + Mac: ~/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css

    + PC: C:UsersYourUsernameAppDataLocalGoogleChromeUser DataDefaultUser StyleSheetsCustom.css


  - 검은색으로 나와서 좀 더 가독성이 높아진다  

    

    

** 현재 쓰고있는 것은 RubyBlue가 가장 가독성이 좋은 것 같다. 개인적 느낌으로...^^ (Custom.css.rubyblue.dowon)

Custom.css.zip

Custom.css.rubyblue.dowon



3) Mac에서 크롬 short key list

  - 크롬 hot keys

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

github에서 쓰는 위크 포멧으로 마크다운을 많이 사용하고 있고, README.md파일을 해석된 UI 형태로 보고 싶을 경우 QuickLook을 통하여 설정하는 방법을 알아보자 



1) 설치하기

  - 플러그인 다운로드

  - 자신의 계정/Library로 이동. 만일, QuickLook 폴더가 없다면 직접 만든다 : ~/Library/QuickLook

  - 다운받은 .zip 파일 압축해제하고 전체 파일을 ~/Library/QuickLook 폴더에 copy 한다 



2) 사용하기 

  - Finder에서 *.md 을 선택하면 플러그인 설치전에는 Markdown 포멧으로 나오던 것이 해석된 형태로 보인다

   


  - 팝업창으로 보고 싶다면 commnad + y 키를 사용한다. 창닫기는 escape 키 이다 



<참조>

  - QuickLook 플러그인 설치하기 

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
2013.03.12 17:31 Dev Environment/Sublime Text

Sublime Text에서 코딩한 코드를 Command Line으로 수행하고 싶을 경우 Terminal을 hot key로 띄워서 수행 할 수 있다. 


  - 참조 : Terminal을 띄우기 위한 설정

  - Install Package에서 "Terminal"이라고 타입핑하고 설치한다 

    + mac : command + shift + p  => Install Package => Terminal 입력

// git clone 을 통하여 sublime_terminal을 다운로드 받는다 

/Users/xxx/Applications> git clone https://github.com/wbond/sublime_terminal.git

Cloning into 'sublime_terminal'...

Unpacking objects: 100% (99/99), done.


// Sublime Text > Preferences > Package Settings > Terminal > Settings Defaults 에서 iTerm.sh를 설정한다 

// iTerm.sh 연결

{

// The command to execute for the terminal, leave blank for the OS default

// On OS X the terminal can be set to iTerm.sh to execute iTerm

"terminal": "/Users/nulpulum/Applications/sublime_terminal/iTerm.sh",


// A list of default parameters to pass to the terminal, this can be

// overridden by passing the "parameters" key with a list value to the args

// dict when calling the "open_terminal" or "open_terminal_project_folder"

// commands

"parameters": []

}

  

  - 소스 코드를 저장하고 ctrl + shift + t 를 클릭하면 코드가 있는 Path로 Terminal이 열린다 


<참조>

  - 소스 : https://github.com/wbond/sublime_terminal

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
2013.03.12 17:14 Dev Environment/Sublime Text

Mac OS에서 Sublime Text 2 를 Terminal 에서 바로 수행시키는 방법


1) 설정

// 심볼릭 링크 걸기

$ ln -s /Applications/Sublime\ Text\ 2.app/Contents/SharedSupport/bin/subl /usr/local/bin/sublime


// 로그인 계정에 PATH 설정

$ vim .bash_profile 

export PATH=/usr/local/bin:{...}



2) 수행하기 

  - 파일 열기 : sublime <filename>

  - 특정 디렉토리 열기 : sublime <directory name>

  - 현재 디렉토리 열기 : sublime



<참조>

  - 원문 https://gist.github.com/artero/1236170

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
2013.02.02 17:22 Dev Environment/Sublime Text

Syntax에 대한 highlight 기능을 위하여 Jade와 Stylus 플로그인을 설치한다 


1) Sublime Text의 Package 디렉토리로 이동

  - 위치 : Sublime Text의 메뉴에서 Preferences > Browse Packages... 선택하면 이동한다 

  - 해당 위치에서 플러그인을 설치한다 



2) Jade 플로그인 설치 

$ git clone https://github.com/miksago/jade-tmbundle.git Jade

Cloning into 'Jade'...

remote: Counting objects: 139, done.

remote: Compressing objects: 100% (71/71), done.

remote: Total 139 (delta 59), reused 120 (delta 44)

Receiving objects: 100% (139/139), 18.63 KiB, done.

Resolving deltas: 100% (59/59), done.


  - Jade 확장자 파일을 연다 

  - ctr+shift+p 에서 jade라고 타입핑하고 'Set Syntax: Jade' 선택하면 highlighting 된다 

  



3) Stylus 플러그인 설치 

$ git clone https://github.com/LearnBoost/stylus.git Stylus

Cloning into 'Stylus'...

remote: Counting objects: 15849, done.

remote: Compressing objects: 100% (5401/5401), done.

remote: Total 15849 (delta 10322), reused 15R609 (delta 10117)eceiving objects

Receiving objects: 100% (15849/15849), 2.36 MiB | 121 KiB/s, done.

Resolving deltas: 100% (10322/10322), done.

Checking out files: 100% (658/658), done.


  - styl 확장자 파일을 연다 

  - ctr+shift+p 에서 stylus라고 타입핑하고 'Set Syntax: Stylus' 선택하면 highlighting 된다 

  


<참조>

  - 원문 : http://stackoverflow.com/questions/7666977/syntax-highlighting-for-jade-in-sublime-text-2

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
2013.01.30 21:42 Dev Environment/Sublime Text

Sublime Text 2에서 CoffeeScript를 빌드하고 Syntax Highlighting 기능을 사용하기 위하여 CoffeeScript 플러그인을 설치해 보자 


1) 플로그인 설치 

  - 하기 내역을 ctrl + `  누르면 sublime text 하단에 command 입력란이 나온다 => copy & paste => enter key를 치면 설치

  - ctrl + shift + p => install package 이동 => coffeescript 타입핑 하여 필요한 coffeescript 플로그인을 설치한다 

  - .coffee 파일을 오픈하면 Syntax Highlighting 이 되어 있다. (잘 안되면 하단의 참조 원문 보고 진행)

  - sublime text 메뉴 tool => build system => Automatic 으로 설정

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


2) Short Key

alt+shift+t - Run a Cake task
alt+shift+r - Run some CoffeeScript (puts/print is available for output)
alt+shift+s - Run a syntax check
alt+shift+c - Compile a file
alt+shift+d - Display compiled JavaScript
alt+shift+l - Display lexer tokens
alt+shift+n - Display parser nodes
alt+shift+w - Toggle watch mode
alt+shift+p - Toggle output panel


<참조>

  - 설정 원문 : CoffeeScript Install Using Package Installation

  - 참조 원문 : CoffeeScript Setting

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

프로젝트 및 클래스를 생성하는 빠른 방법에 대해서 알아보자 


1) Project 생성

  - File -> New Project...

  - 프로젝트 명칭, 소스디렉토리, SDK 버전, 개발프레임워크등을 선택한다

  - .idea 와 [프로젝트명].iml 내부 환경파일이 생성됨 


2) Package 생성

  - Alt + Insert 키를 눌러서 package를 생성한다 

  - com.dowon.smart.dashboard 식의 full package를 넣는다


3) Class 생성

  - Alt + Insert 키를 눌러서 class를  생성한다

  - 상속받을 class wizard는 안나타남 : Ctrl+Shift+O 키를 누르면 상속받은 클래스의 메소드가 나옴 선택하여 Overriding 또는 implement 하면 됨 


4) 빠르게 코딩하기 

  - public static void main... 은 psvm TAB 키를 넣으면 자동 생성됨 

  - System.out.println 은 sout TAG 키를 넣으면 자동 생성됨

  - Alt + Backspace == ctrl + z in eclipse 이전 코딩으로 돌아가기 


5) Test Class 및 Method 만들기

  - Ctrl + Shift + T

  - 위저드가 뜨면 JUnit4 선택해서 만들기 


<참조>

  - JetBrains Wiki

  - DZone reference cardz

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

Eclipse사용자가 IntelliJ IDEA로 옮겨 갈 때 가장 힘든 부분이 단축키 찾는 것이 아닐까 한다. 요약해 보자


1) 프로젝트의 참조 Libraries 관리 : ctrl + alt + shift + s  (설정참조)

2) JetBrains Wiki (참조)

ShortcutDescription
Alt+F1Switch between views (Project, Structure, etc.).
Ctrl+TabSwitch between the tool windows and files opened in the editor.
Alt+HomeShow the Navigation bar.
Ctrl+JInsert a live template.
Ctrl+Alt+JSurround with a live template.
F4Edit an item from the Project or another tree view.
Alt+EnterUse the suggested quick fix.
Ctrl+Slash or Ctrl+Divide 
Ctrl+Shift+Slash orCtrl+Shift+Divide
Comment or uncomment a line or fragment of code with the line or block comment.
Ctrl+N
Ctrl+Shift+N
Find class or file by name.
Ctrl+DDuplicate the current line or selection.
Ctrl+W and Ctrl+Shift+WIncremental expression selection.
Ctrl+F or Alt+F3Find text string in the current file.
Ctrl+Shift+FFind in the current folder.
Ctrl+Shift+F7Quick view the usages of the selected symbol.
Ctrl+Add or Ctrl+Equals 
Ctrl+Subtract or Ctrl+Minus
Expand or collapse a code block.
Ctrl+SpaceInvoke code completion.
Ctrl+Shift+EnterSmart statement completion.

3) Eclipse와 IntelliJ 비교 키 (참조)
EclipseIntelliJ IDEADescription
F4ctrl+hshow the type hierarchy
ctrl+alt+gctrl+alt+F7find usages
ctrl+shift+uctrl+f7finds the usages in the same file
alt+shift+rshift+F6rename
ctrl+shift+rctrl+shift+Nfind file / open resource
ctrl+shift+x, jctrl+shift+F10run (java program)
ctrl+shift+octrl+alt+oorganize imports
ctrl+octrl+F12show current file structure / outline
ctrl+shift+mctrl+alt+Vcreate local variable refactoring
syso ctrl+spacesout ctrj+jSystem.out.println(“”)
alt + up/downctrl + shift + up/downmove lines
ctrl + dctrl + ydelete current line
???alt + hshow subversion history
ctrl + hctrl + shift + fsearch (find in path)
“semi” set in window-> preferencesctrl + shift + enterif I want to add the semi-colon at the end of a statement
ctrl + 1 or ctrl + shift + lctrl + alt + vintroduce local variable
alt + shift + salt + insertgenerate getters / setters
ctrl + shift + fctrl + alt + lformat code
ctrl + yctrl + shift + zredo
ctrl + shift + cctrl + /comment out lines (my own IDEA shortcut definition for comment/uncomment on german keyboard layout on laptop: ctrl + shift + y)
ctrl + alt + hctrl + alt + h (same!)show call hierarchy
none ?ctrl + alt + f7to jump to one of the callers of a method
ctrl + shift + ialt + f8evaluate expression (in debugger)
F3ctrl + bgo to declaration (e.g. go to method)

저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

Realtime을 통하여 개발하고 있는 내용을 브라우저에서 확인을 할 수 있다면? Meteor 또는 Derby 를 사용한다면 웹앱을 통하여 그렇게 만들 수 있을 것이다. 그러나 IDE이 개발툴에서 개발한 내용이 브라우저에서 F5 또는 reloading을 하지 않고 확인하면서 개발하는 놀라운 상황. 한마디로 와우!


> JetBrains WebStorm의 Live Edit 

 


> WebStorm 5.0 과 Chrom 브라우저간 Live Edit 기능 설정하기 

  - WebStorm : View 풀다운 메뉴의 중간에 위치한 Live Edit 메뉴를 클릭한다.

  - Chrome 브라워저 : Chrome JetBrains Extension을 설치해야 한다.

    + Extension 파일 다운로드 : 파일 다운로드

    + Chrome 브라우저를 새로 열고 chrome://chrome/extensions/  라고 주소 입력한다

    + 우측 상단에 있는 "개발자 모듬"를 선택한다

    + 다운로드 받은 파일 jb.crx 파일을 브라우저로 drag & drop 하면 extension 설치여부 팝업이 뜨면 설치 OK 클릭


저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
TAG WebStorm
2012.12.07 14:38 Dev Environment/Sublime Text

Sublime Text 2를 설치하고 한글 문서를 열어 보면 깨져 나온다. 우선 인코딩이 안맞는 것인데 그럴경우 플러그 하나 설치하자. 


  • 우선 Install Package 설치하자 
  • 제공하는 플러그인 : EncodingHelper
  • Install Package (ctrl+shift+p)에서 EncodingHelper 나오면 설치를 한다 
  • 설치후 sublime text에서 
    • edit menu 선택
    • 맨 하단 convert to UTF-8 from Encoding 선택
    • 맨 위 Complete List Sorted 선택
    • 위에서 7번째 EUC KR 선택

이제 한글이 제대로 보이기 시작한다. 


저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
2012.12.05 20:16 Dev Environment/Sublime Text

Gist를 GitHub이 운영하는 코드 Snippet을 관리할 수 있는 서비스이다. 이와 비슷하게 jsFiddle.net 에서도 html/css/javascript를 저장하고 테스트까지 해볼 수 있다. 



> GitHub에 로그인 하면 상단에 Gist 메뉴가 나온다. 클릭!  (발음 : 지스트)


> Sublime Text를 통하여 등록한 코드조각이 우측에 보인다. (Create Private Gist 로 생성)


> 우측 등록된 코드조각을 클릭하면 코드를 볼 수 있고, 멘션을 달 수 있다. 




저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식

Eclipse Editor의 색상에 대하여 원하는 스타일로 변경하고 싶다면 직접하거나 또는 Plugin을 설치하여 손쉽게 변경을 할 수 있다. 



흰바탕의 깔끔한 Roboticket 스타일 추천


저작자 표시 비영리 변경 금지
신고
posted by peter yun 윤영식
prev 1 2 next

티스토리 툴바