HTTP (HyperText Transfer Protocol)
- 요청(request) : 서버에게 HTML 주라고 요청
- 응답(resposne) : "여기 있습니다"라고 하고 HTML을 주는 행위
- HTTP는 request와 response를 나타냄
- HTML, CSS, JavaScript 이미지와 같은 파일들은 서로가 주고받는 컨텐츠
-- 그 컨텐츠를 주고받기 위해서는 서버와 클라이언트가 서로 알아들을 수 있는 공통의 약속인 메시지
--- 그 메시지 : "HTTP"
- HTTP : request와 response를 위한 메시지로 구분되어 있음
- 크롬 개발자 도구
-- `Network` 탭 : 웹 브라우저와 웹 서버가 어떤 통신을 하고 있는지 모니터링할 수 있는 도구
--- `.html`을 클릭하면 웹 브라우저와 웹 서버가 서로 주고받은 데이터, HTTP 메시지를 볼 수 있음
--- HTML 코드 열어서 `img`에 JPG 이미지가 있으면 웹 브라우저는 그것을 보고 그 이미지 파일을 다시 웹 서버한테 우리 모르게 조용히 요청한 것이 `Name` 탭에 있는 이미지
--- `Headers`라는 부분에 `Request Headers`가 웹 브라우저가 웹 서버에게 요청한 데이터
---- `view source`를 클릭하면 날 것 그대로를 보여줌
----- 텍스트로 만들어서 웹 브라우저가 웹 서버에게 보내준 것
----- ```
GET /1.html HTTP/1.1
Host: localhost: 8080
```
------ `GET` 방식으로 `1.html`을 요청하면서 지금 사용할 수 있는 통신 방법은 `HTTP/1.1`이다는 정보
------ 웹 브라우저가 어떤 웹 서버의 주소로 접속했는지에 대한 정보
------ 이 두 줄이 필수적인 정보
--- `Response Headers` > `view source`
---- ```
HTTP/1.1 200 OK
```
----- `HTTP/1.1 200 OK` : 첫 번째 줄에는 반드시 이렇게 생긴 코드를 넣도록 약속되어 있음 (이게 필수)
------ "나도 `HTTP/1.1`로 통신할 거야"라고 본인의 통신 방법을 웹 서버가 웹 브라우저에게 응답하는 컨텐츠
------ `200`이라는 것은 "성공적으로 데이터를 찾아서 너에게 보내줄게"라는 뜻
---- `Content-Length: 1434`
----- 이 컨텐츠의 길이가 얼마나 되는가를 보여줌
---- `Content-Type: text/html`
---- 웹 서버가 웹 브라우저에게 응답하는 이 정보가 `text`이고 `text` 중에 `html`이다는 것을 알려줌
---- 그러면 웹 브라우저는 이러한 정보들을 받아서 본인의 필요에 따라서 잘 처리해서 화면에 표시해주게 됨
-- 웹 브라우저 : (Request) Headers라는 텍스트 정보를 만들어서 사용자가 요청한 정보를 웹 서버에게 대신 물어봐주는 기계
-- 웹 서버 : 본인이 갖고 있는 정보를 보내주면서 Response Headers라는 응답 헤더를 만들어주는 기계
--- 그러면 웹 브라우저는 그렇게 응답한 정보를 화면에 적당히 그려주는 역할을 하는 프로그램