기술 블로그

VSCode 추천패키지 본문

프론트엔드

VSCode 추천패키지

jaegwan 2018. 10. 8. 14:04
반응형

필수 패키지

  • Auto Close Tag: 자동으로 태그를 닫아준다.
  • Auto Rename Tag: 자동으로 짝 태그의 이름을 바꿔준다.
  • Beautify: 선택 영역 및 파일을 beautify
  • Bookmarks: 라인을 북마크해 shift + alt + L키로 넘어다닐 수 있다.
  • Braket Pair Colorizer: 괄호를 짝을 맞춰 색상을 입혀준다.
  • Code Runner: 해당 영역을 간단히 실행시켜볼 수 있다.
  • Color Highlight: 색상 코드가 색으로 표시된다.
  • Code Spell Checker: 오타를 잡아준다. (영문만)
  • Debugger for Chrome: 크롬 디버그 툴로 front 디버깅이 가능하다.
  • DotEnv: .env syntax를 잡아준다.
  • EditorConfig for VS Code: .editorconfig 파일 설정을 불러와준다.
  • ESLint: JS Linting
  • Git History: Git commit log를 예쁘게 볼 수 있다. (Git Lens 에서 모두 확인 가능)
  • Git Lens: 라인별로 commit log를 확인할 수 있다. 파일 비교도 가능하다.
  • Guides: 가이드라인이 진해진다.
  • Log File Highlighter: 이제 없으면 로그파일 못 보겠다.
  • Path Intellisense: 경로를 자동으로 잡아준다.
  • Prettier - Code formatter: Beautify 보다 더 좋다.
  • Project Manager: ctrl + shift + p로 프로젝트를 빠르게 바꿀 수 있다.
  • REST Client: postman과 같은 기능을 간단한 코드로 구현할 수 있다.
  • Trailing Space: 비어있는 부분을 하이라이트하고 저장시 자동으로 삭제해준다.
  • VS Live Share: Code 환경 간 세션 공유 가능
  • XML tools: xml 하이라이터

개발환경별 취향

css

  • Sass

java

  • Debugger for Java
  • Java Extension Pack
  • Java Test Runner
  • Maven for Java
  • Sprint Initialzr Java Support

javascript

  • EJS language support: EJS syntax highlighter 중 제일 낫다.
  • JavaScript (ES6) code snippets
  • Veltur: Vue 매니아라면



VSCode 다운로드 : https://code.visualstudio.com/

반응형

'프론트엔드' 카테고리의 다른 글

[react-native expo]could not connect to the server 127.0.0.1  (0) 2022.01.14
Flexbox css  (0) 2022.01.14
자바스크립트 배열 정리  (0) 2018.11.24
화려한 웹 움직임 wow.js 사용하기  (1) 2018.10.26
atom 사용하기  (0) 2018.09.22
Comments