[입문] 웹 프론트 엔드 - 3주차
TechniqueVS code 사용법
VS cdoe는 한국어를 지원하고 window, OS X, Linux에서 모두 사용 가능한 IDE(통합 개발 환경을 제공하는 소프트웨어) 입니다.
이번에 64bit 업데이트가 이루어졌으며.
심지어 무료 입니다.
기본적으로 VS code 는 폴더를 선택한 후에 그 폴더 내에서 사용을 하는 구조입니다.
폴더 선택은 Ctrl + b 나 왼쪽 상단의 파일 아이콘을 선택하면 나오는 창에서 선택할 수 있습니다.
테마 선택
저는 사용하는 테마가 있어서 설정되어있는데요.
파일 - 기본설정 - 색 테마 에서 설정이 가능합니다.
VS code 설정
파일 - 기본설정 - 설정 을 선택해 설정 파일을 열을 수 있습니다.
개발언어로 되어있어서 당황스러우실 수 있지만.
설명이 모두 적혀있으므로 괜찮습니다.
검색기능을 이용해 찾을 수도 있습니다.
왼쪽이 기본 설정 상태이며 오른쪽으로 옮겨 수정이 가능합니다.
VS code 키설정
파일 - 기본설정 - 바로 가기 키 에서 설정이 가능합니다.
검색창에서 단어나 키조합으로 검색이 가능합니다.
HTML 기본 구조.
<!doctype html>
<html lang="ko">
<head>
<mate charset="utf-8">
<title>document</title>
</head>
<body>
<div class="wrap"></div>
</body>
</html><!doctype html>: 문서의 타입을 나타내는 선언문입니다. (HTML5 선언문)<html></html>: HTML 태그이며 document 영역이 되는 곳입니다.lang="ko": 이 문서가 어떤 언어로 이루어져 있는지에 대한 선언입니다. (ko = 한국어)<mate charset="utf-8">: 이문서의 캐릭터 셋을 utf-8(유니코드)로 지정한다라는 선언문입니다.
lang="ko": 이 문서가 어떤 언어로 이루어져 있는지에 대한 선언입니다. (ko = 한국어)<mate charset="utf-8">: 이문서의 캐릭터 셋을 utf-8(유니코드)로 지정한다라는 선언문입니다.<head></head>: 컴퓨터가 이 문서에 대한 정보를 인식하는 부분입니다. 유저가 직접 볼 수 없습니다.<body></body>: 브라우저를 통해 유저가 볼 수 있는 화면입니다.<div class="wrap"></div>: body 를 직접 제어 하는 것은 좋지 않아서 전체를 감싸는 요소를 하나 생성해 사용합니다.
<div class="wrap"></div>: body 를 직접 제어 하는 것은 좋지 않아서 전체를 감싸는 요소를 하나 생성해 사용합니다.
Charset 이란?
charset 은 Character Set 의 약자이며 한글로 번역하자면 문자 집합 정도 되겠습니다.
간단하게 컴퓨터와 통신하기 위한 인코딩 방법이라고 생각하시면 되며.
비슷하게 모스 부호를 생각하시면 되겟습니다.
유니코드 란?
컴퓨터가 사용하는 숫자와 인간이 사용하는 문자가 1:1 로 매핑되어있는 코드를 말합니다.
인간이 사용하는 언어와 컴퓨터가 처리하는 언어는 다르기 때문에 컴퓨터와 통신하기위한 번역코드 라고 보시면 편할것 같습니다.
Reset CSS
reset CSS는 브라우저마다 각각 가지고 있는 기본 css의 값이 다르기 때문에 모두 통일하기 위해 기본값을 없애 주는 CSS입니다.
https://github.com/lovefields/reset-css
위의 링크를 통해 확인해주세요.
