십수년에 걸쳐 노트패드부터 에딧플러스, 아크로 에딧, 아톰, 서브라임 텍스트에서 이제는 vscode가 정말 많이 대세가 된듯하고, 기존의 수많은 플러그인도 호환이 되고, 개발환경이 쉬운 탓에 이제 별거없는 한 이대로 가겠다 싶어서, 정리 겸, 내가 찾고자 한 필요한듯 하면서 노가다를 줄여줄수 있는 몇개를 추천한다.
기존에 vs code 플러그인해서 나오는 일반적인 lint 계열등이나 다른데서도 많이 추천하는건 생략하거나 이름만 남기고, 개인적으로 추천하고 사용중인것 들만 설명을 하기로 한다.
본인 에디터 환경상 install된 순서대로 abc순으로 소개함
#A
현재 파일의 경로를 보여준다
자동으로 현재 태그를 닫아주거나, 태그 앞부분만 수정해도 뒤가 자동으로 수정됨. 가끔 중복으로 태그가 더 생길수 있다.
태그 앞,뒤 한 곳 을 바꾸면 자동으로 뒷부분의 닫는 태그도 같이 바뀜
#B
자동정렬 - 너무 유명하니 설명 생략
사이드바에 추가해서 보이게 할수도 있고, 파일별로도 관리되어서 자주 씀
#C
css 파일에서 바로 색상코드값을 바로 볼수 있고, 수정시에도 color picker가 바로 보인다, 리소스는 조금 먹는 편인데, 거의 필수
일반적으로 소스 옆에 주석 달때 이쁘게 정렬할때 쓴다. 이거 일일히 스페이스로 띄어서 하지 말자
#E
일부 에디터에서 특수문자 변환이 필요할때, 사용한다. 특별한 환경에서는 아주 유용하다.
<,>'' 등의 특수문자를 entity code로 자동 변경해줌
#G
형상관리에 git 쓴다면 거의 필수, 기존에 git lens를 썼는데 새로 설치하려고 보니 유료로 바뀐건가 잘 안되서 이걸로 사용
딱히 설명은 필요없다. 형상관리 git사용중이라면, 콘솔에서 쓰는경우를 제외하곤 gui환경에서 제일 편함
#H
현재 라인에 하이라이트를 준다. 설정에서 dashed 타입이나 몇개 바꿔줄수 있다. 너무 과해서 호불호를 탈수는 있겠다
현재 선택된 태그를 하이라이팅 해줘서 보기 편함
#L
일반 html환경에서 바로 서버를 돌려서 preview보기가 편함
#M
주석달때 "mark : " 이걸 써주고 나면 ctrl+alt+m으로 바로 목차형식으로 바로가기도 편성되고, 사이드바에서도 볼 수 있다.
js나 css에서 사용해두면 많이 편함
#N
테마는 검은화면을 좋아하면 이게 제일 낫다. Metiral 테마나 기본 dark 테마도 많이 써봤는데, 가독성도 이게 좋음. 하얀 화면 선호하시면 다른걸로 하시고
#S
현재 선택된 영역이 총 몇줄인지 필요할때 사용한다. html마크업 노가다등으로 여러라인 만들어놓고 "이게 몇 줄이었지?" 할때 자동으로 표시되서 편함
Split HTML Attributes (Vue, React, Angular)(⭐)
vue에서 속성이 길어질때 세로로 정렬해준다. 가끔 자동으로 정렬하다가 한줄로 합쳐졌을때나, 여러모로 유용하게 씀
#T
마크업 노가다시 동일한 숫자를 증가시켜야 될때 편함
공백을 빨간색블록으로 표시해줘서 확인하기 쉬움, 옵션에 true로 바꿔주면, 자동으로 저장할때 공백문자를 삭제해주는 기능도 필수
{ "trailing-spaces.trimOnSave": true }
#V
Vue Language Features (Volar)(⭐)
vue프레임워크를 사용한다면, 이거 하나면 거의 필수라고 본다. vetur이랑 같이 쓰면 문제 생겨서 이쪽으로 넘어왔다. 해당 추가 확장 extension pack다 설치해주면 편함
