HTML 01 _ 웹 개발의 기초

HTML은 자동차의 툴, CSS는 자동차의 외관, Java Script는 자동차를 움직이는 동력이라고 생각하면 된다.

HTML과 CSS는 visual studio code를 설치해 실행할 수 있다.

vscode를 설치했다면 앞으로 html css 코드를 짤 때, 좀 더 편리하게 짤 수 있도록 하는 확장 프로그램을 설치하는 것이 좋다.

vscode 맨 왼쪽 탭에서 블록처럼 보이는 5번째 '확장' 아이콘을 선택하면 위와 같이 검색 탭이 뜬다.

아래의 확장 프로그램을 하나씩 검색해서 설치해주면 끝이다.

Korean language pack : 한국어로 볼 수 있게 해주는 패키지
bracket pair colorize : 여러 개의 괄호가 겹쳐있을 때 색을 다르게 하여 구분할 수 있도록 해주는 프로그램
indent rainbow : tab 영역을 색깔별로 다르게 표시하여 코드 라인이 길어졌을 때 잘 구분할 수 있도록 프로그램
auto rename tag : 하나의 태그를 수정 했을 때 쌍을 이루는 다른 태그들을 자동으로 수정할 수 있도록 해주는 프로그램 (여는 태그, 닫는 태그)
CSS peek : html 문서에서 정의된 css를 금방 찾을 수 있도록 도와주는 확장 프로그램
HTML to CSS autocompletion : 정의된 css가 html의 어디에서 사용되었는지 쉽게 찾을 수 있도록 도와주는 프로그램. 문서에 선언된 클래스 명을 css파일에서 입력할 때 자동완성 기능을 제공함
HTML CSS support : html 문서에서 css의 자동완성 기능을 제공하는 프로그램
live server : html 파일 수정시 새로고침 없이 바로바로 페이지에 적용되도록 하는 프로그램
prettier : 코드를 예쁘게 정렬해주는 코드 formatter 중 하나 ('ctrl' + ',' ⇒ 설정화면을 띄울 수 있다.

짐코딩 HTML/CSS 강의를 참고했습니다.

공부하는 영초