비주얼 스튜디오 코드(visual studio code) 초기 세팅 가이드

2023. 3. 6. 13:05Development👩🏻‍🦳

시작하기에 앞서 에디트툴을 먼저 설치해 준다
Visual Studio Code를 사용하여 개발을 진행할 예정이다
윈도우와 맥을 번갈아가면서 포스팅할 예정이다😉

비주얼스튜디오코드 홈페이지 이다

 

검은 화면에 글씨는 흰색이다

코딩의 원리만 알고있다면 툴을 갈아타는건 매우 쉽다
일단 기본이 되는 원리를 알아가보도록하자

 

검은 화면에 하얀색 글씨
벌써 어려워 보이지만 매우 정상이다 
작업을 시작하기에 앞서 작업 능률을 올려줄 Extension을 설치해준다
(일종의 플러그인 같은것이다)

 

Auto Close Tag
HTML태그를 끝까지 완성하지 않아도 자동으로 뒤에 닫히는 태그를 쳐준다
(얼마나 좋은건진 나중에 알게될것이다)

Auto Rename Tag
태그중에서도 열어줘야하고 닫아줘야하는 태그가 존재를 한다
해당 태그들의 열고닫음을 한꺼번에 반영을 시켜준다

 

HTML Boilerplate
Div —> <div></div>
doc —> <!DOCTYPE html>
A.    —> <a href=“”></a>
탭키를 누르면 자동으로 코드릴 생성해준다

LIVE SERVER
이건 우리가 예제가 실제로 변하는 부분의 관측을
즉각적으로 하기위해 꼭 필요한 요소입니다
반드시 설치 해주세요

+꼭 설치할 필요는 없으나
Autoprefixer
간단하게 설명하자면 브라우저마다 지원하는 코드가 있다
코드가 다 다르므로  css앞에 수식어를 넣어주어야한다