Notice
Recent Posts
Recent Comments
Link
공부하는 안씨의 기록
chapter 02. web의 동작 원리 본문
* 본 포스팅은 테킷 프론트엔드 온보딩트랙 강의(조경민 강사님)를 참고하였으며,
그 외의 자발적 학습 활동을 진행한 것을 토대로 작성되었습니다.
| 목차
1. 강의 내용 학습
1.(1) web 의 등장
1.(2) 클라이언트(client)와 서버(server)
1.(3) HTTP와 URL
1.(4) 쿠키와 세션
1.(5) 네트워크란?
1.(6) IP와 IP address
1.(7) port와 DNS
2. 추가 학습 활동
3. 학습 후기
1. 강의 내용 학습
1.(1) web의 등장
*팀 버너스 리: 1989년에 World Wide Web의 하이퍼텍스 시스템을 고안
PC 통신 | Web |
폐쇄 | 개방 |
저속 | 고속 |
전화선/모뎀 | 광랜(FTTH) |
- Web 1.0
- 1990년대 후반~ 2000년대
- 어느 누구나 프로그램을 대중에게 공개할 수 있는 세상의 도래
- 네이버, 다음, 야후, freechal, LYCOS, empas 등의 웹서비스 포털→ 고정 사용자 등장
- 인터넷 쇼핑몰(오픈마켓): 옥션, 인터파크, g market, d&shop → 인터넷으로 구매
- 메신저: msn, buddybuddy, nateon, cyworld
- → 수많은 서비스의 탄생, 그러나 생존자는?
- Web 2.0
- 2010년대~현재
- 일방향적으로 정보를 제공받던 사용자가 직접 정보를 생산하고 공유한다. (네이버 블로그, 위키피디아)
- 아이폰의 등장(스마트폰)
- real time, 실시간 공유
- sns의 등장: 카카오톡, 페이스북, 트위터, 영상통화(줌)
- Web 3.0
- 데이터의 투명한 공개 → 블록체인(가상화폐, 비트코인…)
- 블록체인은 완벽한 기술인가?
- 모든 참여자에게 동기화 → 느린 네트워크 처리 속도
- 오픈소스 형태로 책임자가 불분명하다는 문제!
1.(2) 클라이언트와 서버
- 클라이언트(client): 브라우저를 통해서 요청(request)을 보내는 주체
- 서버(server): 요청(request)에 대한 응답(response)을 받음.
- 통신 시 규칙이 필요함.
1.(3) HTTP 와 URL
- HTTP(HyperText Transfer Protocol): 웹 브라우저에서 ‘URL’이라는 주소 양식을 통해 클라이언트와 서버가 통신하는 규칙
- hypertext: 다른 리소스로 이동할 수 있는 ‘링크’
- protocol: 규약. 규칙
- URL(Uniform Resource Locator): 인터넷 상의 위치에 있는 각종 자원의 주소 체계
- https://www.google.com/search?q=techit
- 프로토콜(protocol): 통신규칙 - http(https)
- 호스트(host): 서버의 주소. goole.com을 호스트 네임이라 지칭
- 경로(path): 호스트 내 서비스의 위치. 서비스 별로 분할(ex: 검색, 회원 등)
- 쿼리 문자열(Query String): ? 기호로 시작, & 기호로 연결. 키/값 쌍으로 구성
1.(4) 쿠키와 세션
- 쿠키(cookie): 서버에서 클라이언트로 보내져 브라우저에 저장되는 작은 데이터(키/값 구조로, 유효기간이 있음.)
- 클라이언트에서 서버로 로그인 요청→ 로그인 성공 쿠키 생성, 기억됨.
- 쿠키의 필요성 및 작동 원리
- →서버에서 로그인 처리 후 성공 메세지를 응답(성공 메세지 뿐만이 아니라, 쿠키 또한 받는다.) →로그인 성공 이후, 강의 장바구니 이동-개인정보 수정 페이지 이동-강의 시청 페이지 이동 등의 작업 수행 → 위와 같은 작업 수행이 가능한 이유: 로그인을 성공하였기 때문임. → 이때, https 통신: 이전의 작업을 기억하지 못함. 각각의 요청및 응답이 독립적으로 수행됨. 즉, 이러한 요청이 있었음을 남겨둘 필요가 있음! → stateless 하다는 특성이 있는 http protocol(보통 수많은 클라이언트들이 특정 서버에 동시에 연결되어있으므로 http의 stateless한 특성이 리소스 관리 측면에서 굉장히 효율적임.) → 즉 **로그인이 성공하였다는 ‘쿠키’**를 남겨 로그인이 유지되며, 강의 장바구니 및 마이페이지 확인이 가능한 것임.
- 서버가 클라이언트를 식별할 수 있는 방법은 ‘쿠키’이므로 아래와 같은 방법으로 보완
- httpOnly cookie
- secure cookie
- 쿠키의 필요성 및 작동 원리
- 세션(session): 쿠키의 한계점을 보완.
- 서버에서 ‘session id’를 쿠키에 실어서 보내줌. 서버의 ‘세션 저장소’에 해당 쿠키를 보관. 클라이언트에서 불필요하게 많은 민감 정보를 담지 않고 서버에서 세션 아이디를 받은 후 세션 아이디에 해당하는 정보를 찾아서 사용하게 되는 것임!
- 클라이언트가 재 로그인 시, 서버는, 세션 아이디에 매핑된 상태 데이터를 기반으로 클라이언트에게 응답을 주게 됨.
- → 리소스 비용 절감, 민감정보가 노출되고 변조되는 것을 막는다.
1.(5) 네트워크란?
네트워크(Network) : 두 대 이상의 컴퓨터가 연결된 통신망 (꼭 인터넷만의 이야기가 아님)
- 네트워크의 구성 요소
- host(호스트): 연결된 개별 컴퓨터
- switch(스위치): 연결의 매개체(묶어준다고 생각하자)
- problem! 스위치는 다른 네트워크에 접속할 수 없음.
- router(라우터): 스위치의 기능을 포함. but 서로 다른 네트워크 간의 통신이 가능. (=공유기)
- 인터넷(Internet): 네트워크와 네트워크가 연결된 거대 통신망
1.(6) IP와 IP address
- IP(Internet Protocol): 컴퓨터 간 데이터를 주고받는 네트워크 계층의 규약. 데이터 전달에 필요한 목적지 컴퓨터 정보가 필요.
- IP 주소: 네트워크에서 컴퓨터가 부여 받는 고유한 주소
- 송신자 — ( 수신자의 주소 ) — > 수신자
- IPv4: 32비트 할당 가능
- IP 주소 체계(IPv4 기준)
- 11000000101010000000000000000011
- ( 32비트 주소를 8비트씩 분할- 4개의 옥텟(octet) )
- 11000000|10101000|00000000|00000011
- (2진수를 10진수로 변환)
- 192.168.0.3
- →범위: 0.0.0.0~255.255.255.255
- IP 주소 체계(IPv4 기준)
- IPv6: 128 비트 할당 가능
- 공인 IP , 사설 IP
- 공인 IP: 전체 인터넷 망에서 고유하게 식별 가능한 주소(IPv4 체계에서 자원 부족)
- ISP(인터넷 서비스 제공자: KT, LG U+, SK …): 우리가 사용하는 공유기에 공인 IP 할당
- 하나의 공인 IP에서 수많은 사설 IP할당이 가능
- 사설 IP: 가정의 LAN과 같은 네트워크에서 할당되는 주소, 컴퓨터에서 조회되는 IP
- 공인 IP: 전체 인터넷 망에서 고유하게 식별 가능한 주소(IPv4 체계에서 자원 부족)
- 127.0.0.1
- localhost(컴퓨터 자기 자신을 의미)
1.(7) port와 DNS
- Port(포트, 포트 넘버): 하나의 컴퓨터에서 실행되는 다양한 서비스를 구분하는 역할. 접근하려는 서비스의 목적지 포트를 정확하게 설정해야 함.
- http: 80, https: 443, smtp(메일): 25, ftp(파일): 21
- DNS(Domain Name Server): URL을 해석하여 ip 주소로 반환하는 서버
- URL 입력→ DSN 서버에서 매칭되는 정보가 있는지 확인→URL과 맵핑된 IP주소를 브라우저로 전송→ 브라우저는 전달받은 IP주소를 통해 페이지 접속
- DNS는 국가, 기업 등이 운영하며 전세계적으로 연결되어 있으므로, 장애 발생 시 막대한 피해 발생
2. 추가 학습 활동
ㅇㅇㅇㅇ
3. 학습 후기
ㅇㅇㅇㅇ
'웹 프로그래밍 > 테킷 프론트엔드 온보딩 트랙(230710~230819)' 카테고리의 다른 글
chapter 06. HTML 기초 (구성, 요소 및 실) (0) | 2023.07.26 |
---|---|
chapter 05. Git & Github (2) 원격 저장소(remote repository), 협업, 병합 충돌,GUI (0) | 2023.07.20 |
chapter 05. Git & Github (1) 터미널 사용법, 로컬 git 저장소 생성 (0) | 2023.07.18 |
chapter.04 개발 환경 세팅 (0) | 2023.07.18 |
chapter.03 웹페이지를 이루는 삼총사: HTML, CSS, JavaScript (0) | 2023.07.17 |