어렴풋이 스르륵 다 공부하고 써본적이 있지만, 그래도 가장 근본적인것부터 공부해야겠다 생각했다.
드림코딩 by 엘리 영상을 보면서 앞으로 프론트엔드 공부를 하고, 그 내용을 여기에 정리해보려고한다.
HTML
HTML은 브라우저에서 실행 가능한 가장 기본적인 파일이다.
https://jsbin.com/kulinudozi/edit?html,output
HTML에 대해 설명을 해주실때 이 페이지를 통해 코드를 보고 바로바로 설명을 해주셨다.(이런곳이 있는지도 이제 안 나는 무엇...)
참고로 원하는 태그를 입력하고 탭 키를 누르면 자동완성이 된다..!
예를 들어
h1 입력 후 탭 키를 누르면 <h1></h1> 자동완성! 참으로 좋지 아니한가..... 앞으로 요긴하게 사용될수도 있겠다는 생각이 든다.
다시 본론으로 돌아와서
<!DOCTYPE html>은 브라우저가 따라야하는 중요한 룰을 정의하는 부분이다. 예전에는html버전도 표기했으나, 이제는 모든 브라우저가 html5를 지원하기에 관습적으로 이렇게 적는다.
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
</body>
</html>html 태그는 html 제일 상위에 있는 태그.
html 안에는 head와 body가 있다.
head는 사용자에게 보여주는 UI적인 요소가 하나도 들어가있지 않다. 대신 다양하게 정의해야하는 부분, 가령 CSS와 같은 메타데이터를 정의하는 부분이다.
utf-8은 현존하는 모든 언어를 지원한다.
body 안에 있는 부분이 사용자에 보여주는 부분이다.
참고하면 좋은 사이트 목록
MDN : html의 다양한 태그들에 대한 설명 및 사용방법
Validator : 유효한 태그를 썼는지 검증
지금은 갈팡질팡하지만 점차 바르게 걷게될지어다