-WEB: World Wide Web
-WEB!=인터넷
=>인터넷을 통해 정보를 공유하는 서비스의 일종
-서버=>인터넷 서비스를 제공하는 프로그램 컴퓨터
-클라이언트=>서버를 이용하는 사용자 또는 사용자가 사용하는 기기
-웹 서버
=>사용자가 요청하는 웹 페이지//프로그램을 실행하여 해당 파일 및 결과를 유저에게 제공하는 역할.
-웹 브라우저
=>웹 서버에서 페이지를 가져오거나, 정보를 보낼때 사용하는 클라이언트 프로그램
(chome.naver....)
클라이언트가 서버에 요청을 보내고, 서버가 응답하는 방식으로 서비스가 진행중.
도메인의 구성
=>************인터넷 주소(IP주소를 현재 우리가 사용하는 도메인 네임으로 사용중)
http://www.abc.def/ghi/jklm/?value 1=nopqrs&2=tuv
- Scheme(http//https)웹 서버와 어떤 프로토콜로 통신 할지를 나타냄, (Hyper Text Transfer Protocol) 웹 상에서 정보를 주고받는 프로토콜(주로 HTML문서를 위해 사용) 각각 80/443번 포트
- Host=>접속할 웹 서버의 주소, 도메인과 IP주소 사용
- 폴더명//파일명
- Query:웹 서버에 전달하는 파라미터(?주소로 파라미터를 구분), 여러개 전달시 &을 통해 구분함
Client-Side Script
=>클라이언트 측에서 실행하는 언어(서버에서 수신한 정보를 브라우저에 해석해서 띄움)
Ex.Html, JS, CSS
Server-Side Script
=>서버 측에서 실행되는 언어, 서버 측에서 처리 그 결과를 클라이언트로 보냄
Ex.JSP/python/php/asp.net
HTML=>Hyper Text Markup Language
==================================================================================
html의 기본!
=>html은 기본적으로 태그를 통해 구성하는 언어.
<!DOCTYPE html>
<html>
<head>
==>head에는 기본적으로, 페이지의 기본적인 기능, 설정들을 넣는 위치!! 직접 보이지 않는 메타데이터를 저장.
<title> 제목을 넣는 곳!, 페이지의 이름이 됨! </title>
<meta charset = "utf-8"> ==>메타 캐릭터 셋: 언어에서 설정할 유니코드 인코딩 방식
(한국어의 경우 utf-8을 사용)
</head>
<h>제목 1</h> =>h태그: 제목을 설정하는 태그, h뒤의 숫자는 1~6이 존재하며, 숫자가 클수록 크기가 작아짐.
<p> 단락</p> =>paragraph태그 단락 태그라고 보면됨, 한칸을 띄는 역할.
<body>
=>페이지를 구성하는 코드가 들어가는 자리
</body>
</html>
HTML : form/input 태그
=>http의 요청 방식
1)POST방식
=>URL에 데이터 노출X
=>HTTP body에 데이터 위치, 전송 길이에 제한 없음.
2)GET방식
=>URL끝에 데이터를 추가해 전달하는 방식
=>HTTP header에 데이터가 위치함, 전송 길이의 제한이 존재.
ex.google.com/search?F=IDK =>F:파라미터의 이름, IDK 파라미터의 값
form태그 =>입력된 데이터를다른 페이지로 전송.
<form name=" " action= " " method= " ">
*name속성: 폼의 이름지정(생략 가능
*action속성: 입력할 데이터를 보낼 서버의 주소 지정.
*method속성: 서버 측으로 전달할 데이터의 전송 방식 지정(위에 나온 GET/POST)
</form>
input태그
<input name= " " type= " " value= " ">
*name =>이름
*type=> 서버로 전달할 데이터의 타입 지정 ex.type ="text"
*value => input 태그의 값 지정, value="전송" , 생략이 가능함!
==========================과제 하면서 배운 것.
<p태그의 속성 넣는법>
<p style="text-align: center> =>텍스트를 문단의 중간에 넣어주세요
<여러개 넣는 법>
<p style="text-align: center; margin-top: 50px;>==>세미콜론을 통해서 여러개를 넣을 때 구분 가능.
속성의 설정이 끝나면 하나라도 세미콜론을 찍어줘야함
<input style=margin: 300px;>
<header>태그는 <paragraph>태그의 일종이므로, h태그에는 p를 넣을 필요 없다.
속성중 margin은 위아래 양옆의 모든 길이를 포함한 것.
<div>중앙 정렬 하는 법
->margin: 0 auto
글자 크기 설정법->style속성의 font-size설정
'분식집 > 해킹..!?' 카테고리의 다른 글
| 텐서플로우 개론!-코딩애플님 유튜브 정리 (0) | 2023.03.24 |
|---|---|
| 리버싱이란? (0) | 2023.03.24 |
| html 기초! (0) | 2023.02.23 |
| HTTP의 요청과 응답. (0) | 2023.02.19 |
| Buffer overflow-쉘 코드 만들기 (0) | 2023.02.15 |
