HTTP HyperText Transfer Protocol 인터넷에서 데이터를 주고받을 수 있는 프로토콜으로 지금은 모든형태의 데이터를 다 전송할 수 있으며 서버간의 데이터를 주고 받을 때도 HTTP를 이용한다. 이렇듯 지금은 HTTP 시대라고 보아도 무방하다. HTML, TEXT IMAGE, 음성, 영상, 파일 JSON, XML (API) 거의 모든 형태의 데이터 전송 가능 서버간에 데이터를 주고 받을 때도 대부분 HTTP 사용 지금은 HTTP 시대! HTTP 역사 가장 많이 사용하는 것은 HTTP/1.1 버전이다. 대부분의 기능이 다 들어있으며 HTTP/2, HTTP/3 은 성능개선에 초점에 맞춰져 있다. HTTP/0.9 1991년: GET 메서드만 지원, HTTP 헤더X HTTP/1.0 1996년:..
아래의 URL을 통해 어떻게 웹 브라우저가 요청해서 진행되는지 알아보자. 1. google.com에 해당하는 DNS 서버를 조회한다. IP 200.200.200.2 2. port번호를 찾아낸다. port는 https로 생략된 443번 port이다. 3. HTTP 요청 메시지 생성 : 쿼리 정보, HTTP 버전 정보, Host정보가 들어간다. HTTP 메시지 전송 1. 웹 브라우저가 HTTP 메시지를 생성한다. 2. SOCKET 라이브러리를 통해 TCP/IP 계층에 전달한다 이전 단계에서 찾은 IP, PORT 정보로 3 way handshake 방식을 통해 서버와 연결한다. 연결이 성공되면 TCP/IP 계층으로 데이터를 전달한다. 3. HTTP 메세지가 포함된 TCP/IP 패킷을 생성한다. 4. 서버는 패..
URI(Uniform Resource Identifier) 리소스를 식별하는 통합된 방법 Uniform: 리소스 식별하는 통일된 방식 Resource: 자원, URI로 식별할 수 있는 모든 것(제한 없음) Identifier: 다른 항목과 구분하는데 필요한 정보 URI ? URL? URN. ? "URI는 로케이터(locator), 이름(name) 또는 둘 다 추가로 분류될 수 있다" URI는 URL과 URL을 포함하는 상위개념이다. URL(Uniform Resource Locator) 현재 웹브라우저에서 사용하고 있다. 식별자를 경로형태로 쓰고 있다. URN (Uniform Resource Name) 이름으로 리소스를 특정한다. 식별자를 이름형태로 쓴다. URN방식은 실제로 거의 사용되어질 일이 없다. ..
한 번에 둘 이상 연결해야 하면? 친구와 게임도 하면서 화상통화도 하면서 웹 브라우저를 요청하는 경우를 생각해보자. 클라이언트와 서버간 주고받는 패킷들이 어디서 오는 패킷인지 알 수 없다. 지난 포스팅에서 다룬 TCP/IP 패킷 정보에는 출발지 IP, 목적지 IP 뿐만 아니라 출발지, 목적지 PORT가 있다. IP는 출발지와 목적지의 서버를 찾는 역할이고, PORT는 서버 안에서 돌아가는 애플리케이션을 구분할 수 있게 해 준다. IP는 아파트, PORT는 동호수인 것 같은 역할이다. PORT 같은 IP내에서 프로세스를 구분하는 역할로, 서로간 요청 시 IP주소와 Port번호를 함께 보내 어떤 프로세스인지 전달해준다. 0 ~ 65535 할당 가능 0 ~ 1023 잘 알려진 포트, 사용하지 않는 것이 좋음..
1. IP(인터넷 프로토콜) IP 인터넷 프로토콜 역할 • 지정한 IP 주소(IP Address)에 데이터 전달 • 패킷(Packet)이라는 통신 단위로 데이터 전달 IP 패킷 정보 - 출발지 IP - 목적지 IP - Message 클라이언트 패킷 전달 출발지 IP 주소에서 패킷이 던져진다. 이 패킷은 노드끼리 전달되면서 목적지 IP를 찾는다. 서버 패킷전달 목적지 IP 주소에서 메세지(ok) 이 적힌 패킷을 던진다. 노드끼리 목적지 IP를 찾아가며 전달된다. 이 때 인터넷망이 복잡하기 때문에 서로 다른 곳으로 패킷이 전달 될 수 있다. 그래서 이는 한계가 있다. IP 프로토콜의 한계 비연결성 PC 가 꺼진 상태에서도 전송된다. 패킷을 받을 대상이 없거나 서비스 불능 상태여도 패킷 전송 비신뢰성 중간에 ..
오랜만에 글을 쓴다. 항해 99 수료 후 살짝 풀어진 마음을 다잡고 취업준비, 면접 준비를 하며 타입 스크립트 공부를 하고 있다. "개발자는 평생 HTTP 기반 위에서 개발한다. " 웹 프런트엔드 개발자를 잘하고 싶어 하면서 내가 처음 공부한 방식은 개발 언어였다. 항해 99를 통해 백엔드와 협업을 하면서 웹 네트워크 지식이 많이 부족하다고 생각되었다. 수료 후 면접 준비를 하면서 많이 나온다는 네트워크 질문 모음들에 대해 공부는 했지만, 깊게 들어가면 한 없이 깊은 부분인 것 같아 실제 면접 시 질문이 들어오면 어디까지 대답해야 할지도 감이 안 왔다. 또 구글링을 하다 보면 여러 정보가 중구난방으로 혹은 똑같은 내용만 담겨있는 경우도 있어서 혹시 모를 잘못된 지식을 습득하는 것을 방지하기 위해 저렴하면..
지난 포스팅 : [WillBe 화상 면접 커뮤니티] React Player를 통한 custom player만들기 (1) 재생, 멈춤 3초 후, 3초전 소리 조절 + 음소거 배속 (0.5배속, 1배속, 1.5배속, 2배속) 전체화면 (fullscreen) 오늘 다룰 내용 6. 재생시간 툴팁으로 표시 7-1. 좋아요, 스크랩 동영상 내에서 처리 7-2. 하이라이트 Top 3 시간 누르면 해당 시간으로 이동 + TroubleShooting 6. 재생시간 툴팁으로 표시 이미지와 같이 재생바와 표시되는 시간 툴팁을 구현하는 부분이다. 필요한 메소드는 재생 컨트롤러를 인식하는 seekTo(), 현재시간을 초로 반환하는 getCurrnetTime(), 총 시간을 반환하는 getDuration() 로 이 세가지가 필요..
프론트엔드 팀원 분과 지난 3주간에 걸쳐 협업을 잘 해왔는데 프로젝트가 완성이 되어 가면서 dev에 있는 프로젝트를 main에 merge시키려는 과정에서 아래와 같은 문구가 떴다. 우선 로컬 main에 dev를 merge시키려는 과정에서 발생한 오류인데 왜 연관이 없다고 하는지 몰라 구글링을 했다. 찾아보니 원인은 두 가지라고 한다. 1. 서로 관련 기록이 없는 이질적인 두 프로젝트를 병합할 경우 2. 로컬 저장소와 원격지의 저장소의 기록(History)을 비교했을 때 소스코드의 차이가 심한 저장소의 경우 내 경우는 1번에 해당했던 것 같다. 더 찾아보니 로컬에 있던 프로젝트와 깃 저장소에 있던 프로젝트를 깃에서는 서로 다른 프로젝트라고 인식하고 있어서 생길 수 도 있다고 한다. 로컬 main브랜치에서 ..
- Total
- Today
- Yesterday
- css
- python
- 자바스크립트알고리즘
- network
- 프로그래머스 베스트앨범 자바스크립트
- 네트워크
- reactquery
- 프로그래머스
- 프로그래머스 자바스크립트
- html
- 타입스크립트
- 알고리즘자바스크립트
- 무한스크롤
- 백준
- cs50
- 모두를위한컴퓨터과학
- 클로저
- 파이썬알고리즘
- 모두를 위한 컴퓨터 과학
- 리액트네이티브
- github
- javascript
- 리액트
- 자바스크립트 비동기 처리
- 실전프로젝트
- React
- 자바스크립트
- GIT
- 자바스크립트 클로저
- 항해99
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |