VSCode 확장 도구, 데코레이션 편

 잘 꾸며놓아야 일하기 좋다? (확장 도구 : Dracula Official)

 작업 도구는 눈이 아프지 않아야 하고, 오타 하나가 버그를 만들 수 있으니, 잘 보여야 한다. 보기에 좋기까지 하다면 금상첨화다. VSCode 확장 도구에는 많은 테마들이 있고, 그 중에 많이 쓰이는 테마를 하나 받아 사용한다.

 이름부터 Dracula 다. 설치하고, Command 창에 Theme 를 입력하면, Preferences: Color Theme 에서 테마를 변경할 수 있다. Dracula, Dracula Soft 가 지원되며, 그 중에 색이 부드러운 Dracula Soft 를 적용하였다. Color Theme 는 입맛에 맞는 것을 설치해서 사용하면 된다. Color Theme 뿐 아니라 Icon Theme 변경을 통해, 파일 탐색기에서 더 직관적인 아이콘을 적용할 수 있다.

 다른 색으로 꾸며 직관성을 높여보자. (확장 도구 : Color Highlight, Bracket Pair Colorizer 2, indent-rainbow, Rainbow CSV)

 Color Highlight 는 HTML 작업을 할 때에 추천되는 확장 도구이다. HTML Color Code 를 입력하면, 해당하는 색을 보여주는 도구인데, 아래 다른 도구들을 설정할 때에 Color Code 를 바로바로 확인할 수 있어 설치하고, Marker Type 설정 값을 Outline 으로 변경하였다. 배경색으로 해두었을 경우, 지나치게 큰 범위에 색이 적용되어 산만해지는 경향이 있어, 외곽선으로 변경하였는데, 이것만으로도 충분히 구분되었다.

 Bracket Pair Colorizer 2 는 코드에서 사용되는 괄호를 짝을 맞추어 다르게 해주어 직관적으로 괄호의 범위를 알 수 있도록 도와주는 확장 도구이다. 기본적으로 Gold, Orchid, LightSkyBlue 의 세가지 색을 순환하여 보여주는데, 조금 더 명확하게 인지하기 위해, 설정값을 아래와 같이 바꾸었다.

"bracket-pair-colorizer-2.colors": [

"#F7DC6F",

"#F1948A",

"#85C1E9",

"#58D68D",

"#F4F6F7",

"#808B96",

],

 indent-rainbow 는 코드의 들여쓰기 횟수에 따라 색을 다르게 해준다. Tab 이 Space 4개 일 경우, Space 가 4개가 아니면, 빨간색으로 표시하는 기능도 지원한다. 개인적으로 설정값 색을 바꾸어보았는데, 어둡고 연한색이 아닐 경우 시선을 산만하게 하여 기본값을 유지하였다.

 프로젝트에서 자료의 저장을 위해, csv 파일을 사용하는 경우가 있는데, Rainbow CSV 는 csv 파일의 가독성을 높여준다. csv 파일은 구분자로 구분되기 때문에 행이 반복될수록 열의 내용을 잊기 쉬운데, 색으로 구분되어 가독성이 매우 높아진다.