layout | title | date | catalog | tags | ||
---|---|---|---|---|---|---|
post |
문자열 복사 |
2016-12-18 |
true |
|
안녕하세요 스타트업에서 근무하고 있는 신입 개발자입니다. 회사 내의 기술 스펙이 거의 자바스크립트를 기반으로 두고 있어 기존에 사용해왔던 IntelliJ에서 WebStrom으로 변경하게 되었습니다. 그래서 이번 기회에 Webstrom에 좀 더 친숙해지고 사용법을 읽힐 겸 간단하게 정리해봅니다. 물론 WebStrom 뿐만 아니라 JetBrains사의 IDE에서 공통적으로 사용이 가능합니다.
단축키는 Mac OS 기반으로 알려드리겠습니다.
코드를 작성하다가 동일한 문자열을 변경해야 하는 경우는 빈번하게 발생합니다. 위 그림과 같이 특정 변수를 모두 변경해야 하는 경우가 대표적인 예입니다. 변수가 2~3이면 귀찮지 않은데 위 와 같은 경우에는 크게 귀찮아집니다. 이럴 때 유용하게 사용하는 기능입니다.
변경하고 싶은 문자열을 드래그 이후 command + control + g 단축키를 입력하면 동일 문자열을 한 번에 변경이 가능합니다.
동일 문자열과 비슷한 기능입니다. 만약 변경 대상이 동일한 문자열이 아닐 경우도 위와 같이 발생할 수 있습니다. 이러한 경우에 Alt + 마우스 드래그를 통해서 한 번에 변경하실 수 있습니다. 이 기능 익숙해지면 다양하게 사용할 수 있습니다.
개발을 하면서 우리는 수없이 정말 수없이 복사 붙여 넣기를 합니다... 이럴 때 가장 불편한 점 중에 하나는 새로 복사할 때마다 이전 복사한 내용들이 없어진다는 점이죠.
이러한 경우에 command + shift + v를 사용하시면 간단하게 해결됩니다. 단축키를 입력하시면 복사한 리스트들 출력되고 해당 리스트에서 엔터키를 입력하면 됩니다
코드를 작성하다 보면 중간중간 결과 값을 확인하기 위해서 console.log('')
를 사용해서 확인 작업을 수없이 진행하게 됩니다. 이러한 반복적인 코드와 예약 어를 정의하고 예약 어를 통해서 코드를 불러오는 기능이 Live Template입니다.
저 같은 경우에는 예약어 clog로 console.log('')
를 간단하게 작성합니다. 물론 이러한 간단한 코드는 그때그때 작성해도 크게 불 펴하지는 않지만 코드량이 길어지면 점점 귀찮아지기 시작합니다.
api를 호출하는 ajax 같은 코드도 빈번하게 작성되는 코드다 보니 위 그림과 같이 ajg 예약어로 ajax get 코드를 간단하게 작성하실 수 있습니다.
하지만 저 같은 신입의 경우 해당 코드를 어느 정도 숙지가 완료되었을 때 Live Template에 추가하는 것을 권장드립니다. 코드를 숙지하지 않고 IDE기능을 통해서만 작성하는 것은 좋은 습관은 아니라고 생각합니다.
⌘ + ,단축키를 통해서 설정에 들어가시면 Live Template 항목에서 해당 언어의 Template을 설정할 수 있습니다. 자바스크립트뿐만 아니라 다양하 언어의 Template 지정할 수 있습니다. 반드시 하단에 Define을 클릭하시고 해당 언어를 다시 한번 정의해주셔야 됩니다.
이번에 소개해드린 기능들은 제가 가장 많이 사용하고, 유용하게 사용하는 기능들입니다. 앞으로는 좀 더 막강한 기능들을 공부해서 소개하여드리도록 하겠습니다.
조금이나마 도움이 되셨기를 바랍니다. 긴 글 읽어주셔서 감사드립니다.