Visual Studio Code Extension
Korean(사용법) Language (Microsoft)
VS Code 한글 패치입니다. (Command + Shift + p)를 눌러 "명령 팔레트"가 나오면 "Configure Display Language"를 입력한 후 "ko"를 선택하여 Restart 해주면 UI언어가 한글로 바뀌게 됩니다.
Code Spell Checker (Street Side Software)
Typescript, JavaScript, Text 등 영문 오타를 수정해줍니다.
Korean Spell Checker VS Code (Yunseok)
최대 500자 한글 맞춤법 검사 및 교정해 줍니다.
작성된 한글 선택 후 Command + Shift + P 누르고 korean spell check를 입력하면 오른쪽 창에 검사 결과를 출력해줍니다.
작성된 한글을 선택 후 Command + Shift + P 누르고 korean spell fix를 입력하면 맞춤법을 바로 교정해줍니다.
Live Server (Ritwick Dey)
HTML 파일을 작성 후, 실시간 확인이 가능하도록 가상 서버를 구현해 브라우저에서 결과를 확인할 수 있습니다.
실행: Command + L, O (Command + L 누르고 다음으로 O를 누르면 됩니다.)
중단: Command + L, C (Command + L 누르고 다음으로 C를 누르면 됩니다.)
TabOut (Albert Romkes)
VS Code에서 코드를 쓰다 보면 따옴표"", 괄호(), 콜론:, 세미콜론; 커서를 이동해줘야 하는 불편함이 있습니다. TabOut을 설치하고 Tab키만 누르면 방향키(→) 기능 역할을 해줘서 효율을 높여줍니다. 단축키: Tab
Auto Rename Tag (Jun Han)
태그를 변경하면 자동으로 닫는 태그도 변경됩니다.
Snippets (Binary Bytes)
코드를 다 쓰지 않아도 자동 완성해주니, 작업 속도 향상으로 효율이 좋습니다. (HTML, CSS, JavaScript)
Indent-rainbow (oderwat)
코드의 들여 쓰기 부분에 다양한 색상층으로 표현해주므로 가독성을 높여줍니다.
Bracket Pair Colorizer2 (CoenraadS)
괄호에 색상을 입혀 범위가 헷갈리지 않게 구분해줍니다.
VS Code의 내장 설정 기능으로 Bracket Pair Colorizer2 설치 안 해도 사용할 수 있는 방법:
VS Code 설정에서 setting을 검색하고 json 파일 열고 아래 코드 2줄 추가 후 재실행하면 됩니다.
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs":"active",
Prettier-Code formatter (Prettier)
코드를 엉망진창으로 작성해도 저장을 누르는 순간 코드들을 자동 정렬해줍니다.
HTML to CSS autocompletion (solnurkarim)
HTML에서 입력한 클래스명을 CSS에서 입력할 때 자동 완성시켜주는 확장 기능입니다.
HTML에서 작성하고 저장해야 CSS에서 자동 완성시켜 줍니다.
CSS Peek (Pranay Prakash)
HTML에 적용된 CSS 코드로 찾아줍니다.
Command + 클릭하면 CSS 코드로 이동됩니다.
Git Lens (GitKraken)
VS Code에 내장된 Git 기능을 더 똑똑하게 활용할 수 있습니다. 누가 작성한 코드인지 시각화해주고, Git 레포지토리를 더 원활하게 탐색할 수 도 있으며, 코드 비교도 한눈에 할 수 있는 기능이 제공됩니다.
Material Icon Theme (Philipp Kief)
확장자를 아이콘 형태로 보여줍니다. 설치 후 Extension에서 <파일 아이콘 테마 설정>을 클릭해 주면 됩니다.
Monokai Dark Soda (Adam Caviness)
입문 초기부터 사용해오던 Color Theme입니다.
Power Mode (Cody Hoover)
코드 타이핑 시 이펙트를 보여주는 Extension입니다. 지루함을 줄여주는??
Code Runner (Jun Han)
자바스크립트에서 원하는 부분만 실행하고 싶을 때, 우선 코드를 저장 후 (Ctrl+S) 실행하고자 하는 부분을 선택하고, 오른쪽 위부분 (▷) 버튼을 누르면 출력됩니다.
코드 실행 : Ctrl + Option + N
실행 중단 : Ctrl + Option + M
Visual Studio IntelliCode (Microsoft)
MS에서 만든 AI 기반의 자동 완성 추천 기능입니다. 현재 IntelliCode는 C#, C++, Python, TypeScript / JavaScript, Java, XAML을 지원하고 있습니다.