본문 바로가기
FastCampus/한 번에 끝내는 파이썬 웹 개발 초격차 패키지 Online.

한 번에 끝내는 파이썬 웹 개발 초격차 패키지 79일차

by Dream_World 2021. 11. 23.

웹 &  프론트엔드 기본

솔직히 고백하면 블로그 하루는 쉬고 싶었다. 오늘 웹 취약점 진단을 했는데 나온 항목이 메소드 오류 외에는 나온 부분이 없기에 해킹 공부를 하고 싶어서 드림 핵 강의를 시청하면서 빠지게 되었다. 쭉 강의 다 보고 드림 핵에서 제공되는 과제들을 풀어보고 싶은 욕구가 치솟았다. 하지만, 댓글을 보면 상상을 하게 된다. 누구는 쉽네, 누구는 어렵네, 누구는 방향을 잘못 잡았네! 라는 문구들이 보이는 것이다. 솔직히 엄두가 안 나서 과제를 다운받지는 않았지만 어떤 강의를 들으면 쉽게 풀 수 있을 거라는 문구를 보면서 학습을 제대로 하면 나도 저런 수준은 풀 수 있는지를 알게 된다. 실무에 뛰고 있어야 하는 나로서는 웹 취약점 진단의 포인트를 잘 파악해서 웹 구조를 제대로 알아야 할 것이다. 요즘같이 보완이 된 웹 들은 SQL Injection, XSS 공격은 안되는 것이 대부분이며 다운로드, 업로드 공격도 쉽지가 않다는 것이다. 유일하게 보이는 것이 에러 코드나 리 다이렉트 오류 등등 아직은 내 수준이 아주 낮다는 것을 알 수 있었다.

 


주요 요소

주요 요소 정리 - 정보 태그

<!DOCTYPE html>
<html>
    <head>
    
    </head>
    <body>
    
    </body>
</html>
<!DOCTYPE html> : 문서의 HTML 버전을 지정
DOCTYPE(DTD, Document Type Definition)은 마크업 언어에서 문서 형식을 정의하며, 웹 브라우저가 어떤 HTML 버전의 해석 방식으로 페이지를 이해하면 되는지를 알려주는 용도

<html> : 문서의 전체 범위
HTML 문서가 어디에서 시작하고, 어디에서 끝나는지 알려주는 역할

<head> : 문서의 정보를 나타내는 범위
웹 브라우저가 해석해야 할 웹페이지의 제목, 설명, 사용할 파일 위치, 스타일(CSS)같은, 웹페이지의 보이지 않는 정보를 작성하는 범위

<body> : 문서의 구조를 나타내는 범위
사용자 화면을 통해 보여지는 로고, 헤더, 푸터, 네비게이션, 메뉴, 버튼, 이미지 같은, 웹페이지의 보여지는 구조를 작성하는 범위

 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" hef="./main.css">
	<link rel="icon" href="./favicon.png">
	<style>
		div {
			color: red;
		}
	</style>
	<script src="./main.js"></script>
	<script>
		console.log('Hello world!')
	</script>
	<title>Document</title>
</head>
<body>
	
</body>
</html>
<meta />는 HTML 문서(웹페이지)의 제작자, 내용, 키워드 같은, 여러 정보를 검색엔진이나 브라우저에게 제공
charset : 문자인코딩 방식
name : 정보의 종류
content : 정보의 값
<title> : HTML 문서의 제목(title)을 정의
<link> : 외부 문서를 가져와 연결할 때 사용 (대부분 CSS 파일)
rel : 가져올 문서와 관계
href : 가져올 문서의 경로
<style> : 스타일(CSS)를 HTML 문서 안에서 작성하는 경우에 사용
<script src="./main.js"></script> : 자바스크립(JS) 파일 가져오는 경우
<script>console.log('Hello world!')</script> : 자바스크립트(JS)를 HTML 문서 안에서 작성하는 경우

 

오늘은 주요 요소 정리 - 정보 태그에 대해 학습해 보는 시간을 가졌다. 평소에 잘 보려고 하지 않았던 항목이라 강의가 귀에 쏙 들어왔다. meta 태그는 솔직히 제대로 몰랐다. 매번 따라 작성하기 바빴으니까 이런 정보 값이 있기에 확인 할 수 있음을 알게 된다. 평소의 소스 코드를 보면 meta 코드에 작성하면서 년 도를 늘 기입해서 누가 개발했는지 보이는 부분이 종종 보이곤 했다. 난 meta가 필수 요소인지는 자세히는 모른다. 회사 소스 코드를 열었을 때 누가 작성했고 어떤 부분을 수정했는지 알릴 필요가 있기에 쓰이는 것 같기도 하다.
79일 차는 여기서 마무리하고자 합니다.


패스트캠퍼스 링크 :https://bit.ly/37BpXi

 

패스트캠퍼스 [직장인 실무교육]

프로그래밍, 영상편집, UX/UI, 마케팅, 데이터 분석, 엑셀강의, The RED, 국비지원, 기업교육, 서비스 제공.

fastcampus.co.kr

댓글