패스트캠퍼스 환급챌린지 5일차 미션 (2월 5일) : 프론트엔드개발 강의 후기
오늘의 목표
오늘의 무작정 시작하기 챕터3 중간부분부터 끝까지 들어야지.
오늘은 정신없는 하루의 연속이라 늦게 강의를 수강했다. 후하. 바쁘다 바빠 현대사회
그래도 생각보다 프론트엔드 수업 내용이 재밌어서 강의듣는 건 좋다:)
Ch 3. 무작정 시작하기
다 들었다아 오예!!
html 링크를 연결해서 외부 문서를 가져와도 되고, css 스타일을 html 파일에 그대로 가져와서 작성하는 경우도 있다.
둘 다 해봤을 때, 나는 확실히 css가 html 파일 안에 들어있는 게 편하고 빠르게 눈에 보이기는 했는데
막상 css 내용이 많아지고, body에 들어가는 내용이 늘어나다보면 아래로 스크롤이 많이 생겨서 나중에 양이 많아지는 걸 생각하면 확실히 css 파일을 따로 만드는 게 좋을 것 같다.
오늘 들은 내용들 어느정도 글로 정리해보자.
<meta>
메타는 제작자, 내용 ,키워드 같은 여러 정보를 검색엔진 또는 브라우저에게 제공한다.
그 정보가 무엇인지는 name 이라는 속성에 명시를 하면 된다.
-
name="viewport" : 우리는 스마트폰(타블렛)에서 웹 사이트를 오픈 할 수 있는데 그 스마트폰이 여기서 말하는 모바일 장치(디바이스)이다. 그리고 모바일에서 웹 페이지의 가로 너비를 모바일 환경의 가로 너비와 일치시키거나, 웹 사이트가 처음 출력될 때 확대/축소 여부나 정도를 어떻게 결정하겠다 등 몇 가지 정보를 META 태그로 명시하는 개념이 name="viewport"의 내용이다.
-
일반 데스크탑에는 해당 사항 없음, 뷰포트의 가로 길이는 디바이스가 가지고 있는 가로사이즈에 맞춰 출력, 웹 페이지 처음 출력할때 기본 크기는 1.0 배수로 출력하겠다. (확대 할 수 있는데 기본 출력시 확대할 것인지 아닌지)
-
content는 정보의 값이다.
<title>
HTML 문서의 제목(title)을 정의. 웹 브라우저 '탭'에 표시됨
<link>
외부 문서를 가져와 연결할 때 사용(대부분 CSS 파일)
<rel>
가져올 문서와 관계
(Relationship 단어의 약어) 가져올 외부 문서(대표적으로 CSS 파일)가 현재의 HTML과 어떤 관계인지를 명시하는 HTML 속성(Attribute)
<href>
가져올 문서의 경로
(Hyper Test Reference 단어의 약어) 브라우저가 참조할 특정 경로(Path)를 지정하는 HTML 속성(Attribute)
./ 는 주변에서 가져온다라는 상대적 개념
<src>
자바스크립트(JS) 파일 가져오는 경우, (Source 단어의 약어) 는 사용할 소스 코드(파일)를 지정하는 HTML 속성(Attribute)
<body> </body>
문서의 구조를 나타내는 범위
사용자 화면을 통해 보여지는 로고, 헤더, 푸터, 내비게이션, 메뉴, 버튼, 이미지 같은,
웹페이지의 보여지는 구조를 작성하는 범위
후하
기본적인 이야기들이라서 그래도 쉽게 들려서 다행이다ㅎㅎㅎ
이 재미가 오늘말고 내일도 모레도 끝나는 마지막까지 이어질 수 있으면 좋겠다아아아
흐하
본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.
#패스트캠퍼스 #직장인자기계발 #직장인공부 #환급챌린지 #패스트캠퍼스후기 #오공완 #프론트엔드
패스트캠퍼스 [직장인 실무교육]
프로그래밍, 영상편집, UX/UI, 마케팅, 데이터 분석, 엑셀강의, The RED, 국비지원, 기업교육, 서비스 제공.
fastcampus.co.kr