ubuntu

visual studio code 우분투 사용기

소화자/ editor

  • 0 comments
  • 6,183 views
  • 2017년 12월 3일

마이크로소프트 데스크탑용 오픈소스 크로스 플랫폼 코드 에디터 Visual Studio Code를 우분투에서 사용해 봅니다.

한마디

요즘은 클라우드 웹기반 IDE를 비롯해서 훌륭하고 좋은 에디터가 끊임없이 출시되는데도 불구하고
개발자나 개발자를 꿈꾸는 사람이라면 더 빠르고 더 편한 에디터에 대한 욕구에 항상 목말라합니다.
언제나 모두를 만족시키는 에디터가 나올지? 소스 코드 에디터 전쟁의 끝은 언제 어떻게 끝날지?
얼마나 더 좋은 에디터가 나올지 계속 기대도 해보게 됩니다.

아마도 유료를 사용하시는 분이 아니라면   brackets 이나 Sublime Text를 많이 사용하고 계시지 않을까 싶습니다.

비주얼 스튜디오 코드 (vscode라고도 부름)는 마이크로 소프트에서 오픈소스로 만든 크로스 플랫폼 에디터로서
웹기술(html,css,javascript)로 Electron을 이용하여 만든 데스크탑 어플리케이션입니다.
저는 Sublime Text를 주로 사용하고 있고,
최근에 비주얼 스튜디오 코드도 병행하여 사용하고 있어 여기서 내용을 공유하고자 합니다.
제가 우분투를 사용하고 있어서 크로스플랫폼 툴이긴 하지만 우분투 기준으로 설명 드려 보겠습니다.
설치 하시면 우분투에서 C# 프로그램 공부나 개발도 가능하게 됩니다.^-^

심플 설치

설치는  비주얼 스튜디오 코드 공식 사이트에서 우분투용 확장자  .deb  파일을 다운받아서 더블클릭합니다.
소프트웨어 센터가 실행되고 화면 오른쪽 위에 install이 보이면 눌러줍니다. 설치 끝^-^
홈디렉토리 아래에 Microsoft란 디렉토리가 생겨 있는 걸 보니, 리눅스에~~….. 왠지 많이 낯섭니다.~~

실행

“which code”  명령으로 확인해 보시면 위의 설치로 인해 /usr/bin 디렉토리에 code라는 명령어가 보입니다.

code                 ## 단순 실행
code .               ## 실행하고 현재 폴더를 열게 됩니다.
code . --locale=ko   ## 실행하고 현재 폴더를 열고 언어를 한글로 세팅합니다. 
code -help           ## code 명령어의 옵션들을 보여줍니다.

위 화면은 한글로 세팅하여 실행하고,왼쪽 다섯개 큰 아이콘(탐색기,검색,Git,디버그,익스텐션)중에서
익스텐션을 선택한 화면입니다.
리눅스에서는 보기 힘든 심플하고 깔끔한 모습입니다.^-^
일단 마우스로 메뉴부터 상태바까지 눈에 보이는 것 먼저 대략적으로 확인해 둡니다.

설정 파악하기

~/.config/Code 디렉토리에는 비주얼 스튜디어 코드관련 설정 파일들이 있으며
~/.vscode/extensions 디렉토리에는 설치된 익스텐션(보통 플러그인이라 부르죠)들이 있습니다.
한글설정은 F1 누르시고 Configure Language를 써주시고,선택하시면 locale.json 파일이 열리고,
“locale”:”en” 에서 en을 ko로 바꿔주시면 이후 실행부턴 계속 한글로 유지됩니다.
대부분의 환경설정은 File->Preferences->user settings선택 수정으로 가능합니다.

후다닥 필요한 것만 먼저 알아보기

  • F1 키는  사전 정의된 (preset) 기능들을 Search,실행하는데 자주 사용됩니다.
  • 초기버젼 발표시 화제가 되었던 멀티 커서 기능은 Alt키 누른 상태에서 원하는 라인에 마우스 클릭하시면
    되야 하는데 우분투에선 기본 단축키와 우선순위 문제로 실행이 안되니 아래 명령어를 터미널에서
    실행한 뒤에야 동작합니다. 신기하지만 필요성은 의문입니다.

    gsettings set org.gnome.desktop.wm.preferences mouse-button-modifier "<Super>"

 

  • 보기(view)->통합터미널(Integrated Terminal)을 선택하시면, visual studio code 내에서 터미널을
    사용하실 수 있습니다. 아직 멀티 task기능이 완벽히 지원되지 않아서
    Task(외부 프로그램연결)보다는 통합터미널 사용을 개인적으로 권장드립니다.
    task 빠른 검색은 Ctrl+p,스페이스 순으로 누릅니다.
  • 디버그 사용시에는 F9가 브레이크 포인트 설정, F5가 시작 기능을 합니다.
    비주얼 스튜디오 사용경험이 있으신 분은 바로 느낌이 오실 것 같습니다.
    저의 경우 디버깅에 로그파일 만드는 방식을 써서,이 기능을 거의 사용하지 않습니다.
  • 블락선택(Column Block)은 Shift+Alt 누른상태에서 마우스로 영역선택합니다.
  • 코드 들여쓰기 정리하려면 마우스로 영역선택후 Ctrl+k, Ctrl+f 순으로 눌러줍니다.
  • emmet 기능은 탭키로 완성됩니다.
    예를 들면 html문서(텅빈 파일)에서 html을 쓰고 Tap키를 누르면 태그가 쌍으로 완성됩니다.
    doc나 li*6 쓰고 Tab키 눌러서 결과를 확인하십시오.^^
  • Ctrl+넘버는 에디터창을 여러개 열었을 때 순서대로 바로 선택할 수 있습니다.
  • Extension은 설치하면 reload를 해줘야 사용할 수 있습니다.
  • 기타 상태바에 보이는 메뉴와 작은 아이콘들을 마우스로 클릭해 보시면 도움되실 겁니다.

추천 링크

  1.  비주얼 스튜디오 팁앤트릭
  2.  리눅스용 비주얼 스튜디오 코드 단축키
  3.  놀라운 비주얼 스튜디오
  4. 우분투에 .NET Core 설치   [C# 하시려면 필요합니다]

마치며

2015년 초기 버젼(가끔 깜깜해지거나 화면이 깨짐!!)에 비하면, 기능들이 많이 안정화된 것 같고, 무엇보다
리눅스에서 마이크로소프트 제품을 사용해서 윈도우용 프로그램 개발도 할 수 있다는 느낌이 새롭습니다.
제공되는 Extension은 엄청나게 많다보니, 품질이 떨어지는 것도 꽤 있습니다.
데스크탑 어플리케이션이다 보니 클라우드 웹기반 IDE에 비해서 훨씬 빠르다는 장점이 있는 반면,
사용자 본인이 필요한 런타임을 설치해야 하는 수고를 해야 하는 단점이 있습니다.
비주얼 스튜디오 코드 홈페이지 Doc문서에서 주로 사용하시는 언어부분(LANGUAGES) 참고 하시어
하루정도 Full로 사용하시면 꽤 빠른 시간내에 익숙해 지실 겁니다.
자세히 써보려 했는데 역시 글로 표현하는데 한계가 느껴지네요.ㅠㅠ
유투브 활용을 검토해 봐야 할 때가 온 것 같습니다.~~

혹 개인적으로 아시는 트릭 있으시면 댓글 공유 부탁 드려요~~^-^

이 글이 누군가에게는 조금이나마 도움이 되었으면 하는 작은 바램입니다.

소화자

존재를 드러내지 않고 무림의 배후를 조정하는 전설로만 전해지는 무엇이든 소화하는... 갑 오징어~^-^

Leave a Reply

avatar