유용한 플러그인 중 하나인 VS Code(Visual Studio Code)입니다
무료이기 때문에 유용합니다
마이크로소프트에서 개발한 텍스트 에디터로, 2016년 4월 15일에 정식판이 발표되었습니다
범용 코드 에디터 중 하나입니다
사양 및 버전에 맞게 선택해 다운로드하기
실행프로그램은 Visual Studio가 아니라
Visual Studio Code입니다
* TMI: 화면 크기 조정 Ctrl + [+] / ctrl + [-]
테트리스 블록 모양의 네모네모난 모양이 [확장] 탭입니다
여기에서 필요한 확장팩을 검색해 설치할 수 있어요
오픈소스가 무척 많고 동일한 기능이어도 여러 확장팩이 있는 경우가 있는데요
잘 모를 때는 다운로드 많은 걸로 하시면 됩니다
다수의 개발자들이 선택한 데는 이유가 있으니까요
스타터에게 추천하는 기본 확장팩
Korean Language Pack
한국인들에게 추천하는 언어팩
Live Server
로컬환경에서 브러우저를 실행할 수 있도록
실시간으로 수정 및 빌드 가능하도록 하는 플러그인
Auto rename tag
시작 태그를 바꾸면 종료 태그도 자동으로 수정되는 플러그인
작업내용이 많아지면
시작태그 수정하고 종료태그를 찾아 수정하는 것도 일이니까요
Prettier-code formatter
자동 줄바꿈 및 자동 여백을 실행해 주는 플러그인
코드의 모양을 규칙에 맞게 예쁘게 바꾸어 주는 역할을 합니다
<Prettier-code formatter 적용 방법>
확장팩>prettier검색>prettier 설치(install)
File(파일) > Preferences(기본설정) > Settings(세팅)
검색창에 code formatter 검색 > None에서 Preetier - Code formatter로 적용
<자동으로 저장해주는 Format On Save 적용>
save 검색 > Format On Save 체크표시
File(파일) > Preferences(기본설정) > Settings(세팅) > 검색창에 setting 검색 > Edit in setting.json(json에서 편집)
Prettier code 많은 곳 : https://ux.stories.pe.kr/150
=> VS Code는 custom이 가능하다
'Frontend > HTML' 카테고리의 다른 글
| 프론트엔드 HTML 시멘트 웹 태그, table, datelist, form, iframe (0) | 2023.02.04 |
|---|---|
| HTML 기본 개념 (0) | 2023.01.15 |
| 백엔드, 프론트엔드 및 UI, UX 기본 개념 (0) | 2023.01.15 |