VSCode Extension - 웹개발을 위한 필수 익스텐션 10개 추천
HTML, CSS 이것 저것 해보려면 코딩 에디터가 필수, 그냥 노트패드++ 을 써왔는데 대세인 VSCode 로 갈아타보자.
그런데, 사용해 보기도 전에 검색을 먼저하는…해보지도 않고 편리한 툴만 찾아 삼만리 하고 있다.
맨날 배우려만 하고, 익숙해지도록 직접 해 볼 생각을 안해..나이 드니 그런듯 ㅠㅠ 아무튼 10개 정도 추천하는 영상을 찾아서 정리해 본다.
레퍼런스 동영상
“비쥬얼 스튜디오 코드 설치 및 웹개발을 위한 필수 익스텐션 10개 추천 - 프론트엔드 개발자 입문편: HTML, CSS, Javascript”
{% include youtube.html id="bS9yTI2fC0w" %}
-
동영상 북마크
VSCode Extension 10 개 추천 정리
- 리스트는 위에 북마크에 다 적혀 있네요. 그냥 이름으로 검색해서 설치하면 끝!
- VSCode 실행하고, 왼쪽 메뉴에서 Extensions 누르고 검색하면 됩니다!
추가로 추천한 것
-
VSCode 에 기본 내장되어 있는 Emmet - 간략하게 양식을 자동으로 많이 넣어 준다.
-
! 누르면 html5 기본 골격 틀을 만들 수 있다.
-
<di이정도 치면 emmet 이란 창이 뜨는데 그냥 탭 누르면 자동으로 들어간다.
-
아래에 한줄로 작성하고 있는
div>(header...)를 치고, 아래 작은 Emmet 창이 뜰 때 탭 치면 위의 노란박스와 같은 코드가 자동으로 만들어 진다.
-
-
HTML to CSS autocompletion
“웹사이트 빨리 만드는 지름길 Emmet, HTML 빠르게 마크업하기 - 프론트엔드 개발자 입문편: HTML, CSS, Javascript”
{% include youtube.html id="m7wsrVQsVjI" %}