[LG CNS AM Inspire Camp] 1. IntelliJ는 잠시.. VSCode에 적응해보기

0. 들어가며

이전까지 내 개발환경에서 OS는 mac과 windows 모두 사용해 봤지만, IDE만큼은 언제나 IntelliJ를 고집했다.

 

처음 개발을 시작했을 때 접했던 IDE가 IntelliJ였고, 익숙함 때문인지 자연스럽게 이를 사용하게 됐다. 특히 유료 버전에서 제공하는 편리한 기능들 덕분에 쉽게 포기할 수 없었다.

 

하지만 이번 LG CNS AM Inspire Camp 풀스택 과정에서 프론트엔드로 React를 학습하게 되면서 상황이 조금 달라졌다. 이전 회사에서는 Vue.js를 사용했었고, 1인 개발자로 일했던 덕분에 IntelliJ 하나로 프론트와 백 작업을 모두 해결했었다.

 

그런데 이번 캠프의 React 수업에서는 당연히 V Code를 사용하게 됐다. 각자의 취향에 따라 IDE를 선택할 수 있겠지만, 한 가지 도구만 고집하는 것은 오히려 발전을 막는 것 아닐까 하는 생각이 들었다. 그래서 이번 기회에 VSCode에 제대로 적응해 보기로 했다.

 

새로운 툴에 적응하는 건 쉽지 않지만, IntelliJ에서 VSCode로 넘어오면서 느낀 점과 세팅 과정을 차근차근 정리해 보고자 한다.

1. 선택한 Extention과 그 이유들

IntelliJ에 너무 익숙해져 있었기 때문에, VSCode로 넘어가더라도 기존 IntelliJ에서 제공하던 기능들과 나의 코딩 스타일을 최대한 유지하는 것이 목표였다.

 

VSCode를 사용할 때 단점으로 느껴질 수 있는 부분도 미리 알고 있었다. 대표적으로 자동 import 기능이 약하다는 점과, 필수적인 편의 기능들이 대부분 기본 제공되지 않고 extension을 통해 해결해야 한다는 점이었다.

 

그래서 이번 세팅 과정에서는 이런 단점들을 보완하고, IntelliJ에서 사용하던 환경과 비슷한 개발 경험을 만드는 데 초점을 맞췄다.

 

1-1. ES7+ React/Redux/React-Native snippets

 

React 개발 시 유용한 코드 스니펫들을 제공해준다

IntelliJ에서 축약어를 입력하면 코드를 완성해주는 그런 기능들을 보여준다

초반 React 학습할때는 disable해놓고 사용하겠지만, 이런 좋은 extention을 까먹을까봐 미리 설치해뒀다

 

1-2. Prettier - Code formatter

 

코드 스타일 정리를 위한 자동 포매터를 제공한다.

IntelliJ의 코드 자동 정리 기능과 유사한 역할을 한다.

VSCode를 사용하는 사람들한테는 필수 extention으로 꼽히는 것 같다.

 

1-3. ESLint

 

코드 린트와 에러 감지 기능을 제공한다.

IntelliJ에서 Vue.js로 작업할때, npm run serve를 하면 ESLint 에러를 보며 실수로 놓쳤던 오류부분들을 고치곤했는데,

코드 품질 유지에도 좋고, 유용하게 썻던 기억이 있어서 선택했다.

 

1-4. Auto Import

 

사용 중인 클래스, 함수 등을 자동으로 import해주는 기능을 제공한다.

IntelliJ의 자동 import 기능과 비슷한 경험을 제공한다고 하는데..

이쯤되니 정말 IntelliJ에 기본으로 내장된 훌륭한 기능들이 많긴 했구나 느낀다.

예전에 Java로 코테 문제를 풀면 짜증나는 점 하나가 import 구문을 일일히 적어야한다는 점인데,

평소 코딩할때도 그런 불편함을 감수할 수는 없다고 생각, 선택하게되었다.

1-5. Path Intellisense

 

파일 및 경로 자동 완성을 지원해준다.

IntelliJ로 Vue.js 개발할 당시, 프론트엔드는 폴더경로에 대해 백엔드보다 특히 많이 다루는 일이 많았던 경험이 있다.

그런데, VSCode에서는 기본 제공이 안된다고 하니.. 선택

1-6. Darcula Theme

 

IDE쓰면 각자 본인에게 잘맞는 테마 하나쯤 있을 것이다.

나는 요 Darcula Theme를 IntelliJ에서 고정 사용했다.

다른 테마도 왠만한건 다 사용해봤는데, 이게 제일 뭔가 차분하게 코딩이 잘되는 느낌? 가독성도 좋고..

정말 다행히 VSCode에도 해당 테마가 있어서 바로 설치헀다!

 

2. 마치며

대충 볼만해졌다

예전에 작업했던 코드를 열어보니 대충 볼만해졌다.

폰트 문제인지 아직 이질감이 들긴하는데, 천천히 적응해봐야겠다.