> For the complete documentation index, see [llms.txt](https://simian114.gitbook.io/blog/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://simian114.gitbook.io/blog/undefined-1/diary/2021/january/20210114.md).

# 20210114(목)

## 2021-01-14

### 1. 학습 날짜

* 2020-01-14

### 2. 학습 시간

* 11:30 \~ 13:00, 14:00 \~ 18:00, 20:00 \~ 21:00

### 3. 학습 범위 및 주제

* websocket

### 4. 학습 목표

* websocket에 대해 알아보기

### 5. 학습 정리

* x

### 6. 상세 학습 내용

**Websocket**

* 웹소켓은 HTTP와 같은 하나의 프로토콜이다.
* 웹소켓이 나오게된 역사적 배경을 먼저 이해하자.
* 태초에 HTTP 프로토콜이 있었다. 이 프로토콜은 누구나 알겠지만 매우 성공한 프로토콜이다.
* 하지만 시간이 흐르면서 이 프로토콜도 약점이 있다는게 발견이 되었는데....
* HTTP프로토콜은 클라이언트가 서버로 먼저 요청을 보내야지만 서버가 응답을 할 수 있는 구조(서버가 먼저 클라이언트한테 요청을 보낼 수 없다. 즉 일방적인 관계)
* 단순한 요청이었는데도 불구하고 페이지 전체를 리로드 해야하는 문제가 있었다.
* 단순한 요청이었는데 페이지 전체가 리로드되면 클라이언트나 서버나 둘 모두에게 부하가 발생하게 된다.
* 따라서 이 문제를 해결하고나 나온게 AJAX.
* AJAX는 프로토콜은 아니고 기술이다.
* 이 기술은 자바스크립트의 기능을 활용해서 구현되는데, HTML의 돔 요소를 동적으로 수정 하는 것이다.
* 동적으로 DOM 요소가 변경되면 웹브라우저는 페이지 전체를 리로드 하는게 아닌 수정된 부분만 렌더링을 하게 된다.
* 이로써 두 번째 문제인 전체 리로드 문제를 해결했다. 이번에는 첫 번쨰 문제를 해결해 보자.
* 만약 서버가 먼저 클라이언트한테 요청을 보낼 수 있다면, 즉 쌍방향 통신이 가능하게 된다면 어떤 이점이  생기는지  생각해보자.
* 페이스북을 생각해보자. 로그인을하면 오른쪽에 친구들의 상태가 보인다. 이 상태는 실시간으로 변경 된다.
  * 클라이언트가 이를 요청했는가? 아니다 서버가 다른 유저들의 세션 상태를 보고 서버에서 이를 갱신한다음에 클라이언트한테 이 데이터를 전송하는 것이다.
  * 즉 쌍방향 통신이 가능하게 됨으로써 실시간으로 무엇인가를 클라이언트가 요청하지 않고도 알 수 있게 된 것.
* 이게 바로 웹소켓의 대표적인 예다.
* 즉 웹소켓은 브라우저(클라이언트)와 서버 간의 양방향 통신을 가능하게 해줌으로써 일방적인 관계만을 갖고 있는 HTTP를 보완할 수 있게 되었다.
  * 웹소켓은 HTTP 위에서 동작한다.
* 또한 웹소켓은 오버헤드가 적어서 속도 또한 빠르다.

### 7. 오늘 학습 내용에 대한 개인적인 총평

* 항상 공부를 많이 못한다고 핑계를 대는데.. 요즘은 정말로 공부를 안한다. 반성하자.

### 8. 다음 학습 계획

* 액션 케이블
* 메신저 프로그램 작성해보기