teddy8 Full Stack Software Engineer

2019 vscode 플러그인 추천

2019-07-15
teddy8
ide

Goal

2019 vscode의 인기있는 플러그인을 알아봅니다.
각각의 특징에 대해서도 간략히 서술합니다.
너무 많아서 간략히만 작성했기에 설명이 부족할 수 있습니다.
그리고 추가로 좋은게 있다면 댓글 남겨주세요!!


플러그인 목록

Auto Close Tag
	말그대로 닫힘 태그 자동으로 만들어줌

Auto Import
	임포트 해야되는 상황에 자동으로 임포트해줌
	https://www.youtube.com/watch?v=y-CtH4lu4uI

Indenticator
    들여쓰기의 깊이를 표시해줌

Node.js Extension Pack
    nodejs용 각종 확장팩

Output Colorizer
    output창의 글자가 대부분 흰색인데 컬러풀하게 가독성 올릴 수 있음

React Extension Pack
    React용 각종 확장팩

vscode-icons (Material Icon이 취향인 사람이 더 많다고 한다)
    아이콘 미리보기 기능제공

Bracket Pair Colorizer
    소, 중, 대괄호의 색상 지정으로 가독성을 올릴 수 있음

TODO Highlight
    주석달 때, todo문을 하이라이트 해준다

코드가독성 관련
    Beautify
    vscode-styled-components
    Prettier Code formatter
    Prettier Now
    CSS Formatter

Docker
    docker확장팩으로 docker파일생성과 일반적인 명령 수행 가능

ESLint (JSLint, JSHint 보다 대세)
    자바스크립트 문법의 에러 표시 기능 또한,
    코드작성의 규칙을 지정하여 팀원간의 협력도구로도 사용

GraphQL for VSCode
    graphql 스키마 작성, 자동완성 등 graphql에 대한 다양한 기능

Import Cost
    import를 하는 코드 작성 시, 그 모듈의 데이터 size 자동표시기능

Polacode
    code의 특정 부분 캡쳐 기능

REST Client
    request를 날렸을 경우의 response의 내용을 preview로 확인 가능

Settings Sync
    이름그대로 셋팅을 동기화해주는 툴.
    vscode에서 유용한 익스텐션이 많아짐에 따라 이것들을 관리하는 것도 
    일이 되버렸다. vscode를 새로 깔았을 때 익스텐션을 일일히 다시 깔고 설정을 다시 맞춰줘야하는 수고를 덜어주는 고마운 툴.

Version Lens
    package.json에서 npm, jspm, dub, dotnet core에 대한 패키지 version정보를 보여준다. 

gitlens
    이 코드는 언제 누가 수정했고 이런거 다 알려줌

References

https://junhobaik.github.io/vsc-plugin-list/
https://velog.io/@rtyu1120/%EB%82%B4%EA%B0%80-%EC%93%B0%EB%8A%94-Visual-Studio-Code-%EC%9D%B5%EC%8A%A4%ED%85%90%EC%85%98-%EB%AA%A8%EC%9D%8C%EC%A7%91-kmjtvc7xp8
카카오톡 오픈채팅방(nodejs방, react방)

Comments

Content