TIL

240510 TIL 열아홉번째날 Node.js 입문 1 - 1~2

8나지 2024. 5. 10. 22:05

// 내생각 색깔글씨 : 중요표시 

공부한 내용 - 팀프로젝트 후에 코드 리뷰를 전날 마무리가 안되어 아침에도 함께 코드리뷰함, 노드입문, 

코딩 잘하는 방법 : 목표설정 정확히 - 코드를 만들면서 정하지 말것, 유지보수가 쉽고 보기 좋은 코드로 만들 것, 변수 이름 의미있는 것으로 해야함

 

웹브라우저 통신 방식

웹브라우저 : 인터넷 브라우저 ; HTML, CSS Javascript 파일을 전달받아 해석=> 우리 눈으로 볼 수 있음

전달받고 해석하는 과정에서 웹 브라우저는 정적인 파일과 동적인 정보 처리

 

브라우저 통신방식

1. 사용자가 웹 브라우저의 주소창에 URL입력

2. 웹  브라우저는 입력받은 URL읠 DNS서버로 전달하여 해당 IP주소 찾음

3. DNS서버는 도메인 이름을 IP주소로 변환 

4. 웹브라우저는 해당 IP주소로 HTTP 요청 전달

5. IP주소에 연결된 웹서버는 요청을 받아 처리

6. 웹서버는 처리결과를 HTTP response로 전달 

7. 웹 브라우저는 받은 HTTP Response를 바탕으로 사용자에게 표시

 

웹브라우저 주소창에 URL입력 : URL이란 인터넷 상의 리소스 위치 나타내기 위해 사용. 인터넷의 주소

프로토콜://<도메인명:<포트>/<경로>

ex) http://cafe.naver.com/joonggonara 

프로토콜://서브도메인.메인도메인/리소스경로

 

결론 우리가 주소를 입력하면 브라우저는 서버의 메인페이지 요청, 해당 서버가 보내는 데이터를 받아 웬 브라우저에 보여줌으로써 웹페이지 조회 가능함

DNS(domain name service) : 도메인 이름 중개, IP로 변경해주는 서비스 제공 ; 인터넷 상의 연락처

: 흔히 아는 주소의 URL을 입력 -> IP로 변환해주는역할 (IP는 숫자와 점으로 되어 있어 보기 어려움으로)

(URL : 영어, 숫자, 특수 문자로 이뤄어져있음)

 

IP : 일반적으로 IPv4, IPv6 으로 2가지 방법 사용. 현재까지는 4가 많이 사용됨

; 4가 많아져서 6이 도입되었는데, 표시방법이 문자등을 포함하여 16진수로 표시가능

; 또한 보안에서 차이가 남 4는 IPsec 프로토콜을 별도로 설치가 필요하지만, 6은 확장기능에서 기본으로제공함

결론 6은 나은 확장성과 보안성 제공

 

데이터 주고 받는 양식이자 약속 = 통신규약 = 프로토콜

Http : 통신 규약 중 하나 이며 전세계에서 제일 널리 쓰임

Https : 데이터 통신의 안정성 높이기 위해 암호화 기능포함 

가운데 자물쇠를 패킷이라고 하던데 정보를 말하는듯??

 

HTTP로 어떻게 정보를 주고 받을 수 있나?

HTTP에서는 언제나 요청(Request)응답(Response)이라는 개념이 존재

어떤 메서드인지, 어떤 경로인지 

스테이터 코드와 어떤 형태로 구성되어있는지 받을 수 있음

데이터는 어떠한 데이터든 주고 받는게 가능

네트워크에서 데이터 타입 확인가능

- 헤더스 : 제너럴 - 어떤 (서버에, 메서드,요청을 보냈고, 그 결과;status) 확인가능 =>기본적 정보 포함

              : 리스폰스 헤더 - 서버가 처리된 결과 완료 후 추가적 부여하는 데이터

              ex) 하나의 페이지, 데이터 전달 된 데이터에 해당 데이터가 어떤 것을 전달하는지 추가적으로 전달

              : 컨텐트 타입 - 해당 파일이 어떤 타입인지 확인 할 수 있음

              : 리퀘스트 헤더 - 데이터 전달시 어떤 데이터 전달했는지

              ex) 구글.컴에 요청을 보냈고 겟이라는 메서드로 해당하는 기본경로(/)에다 https라는 프로토콜을 통해 보냄

 

- 프리뷰 : 리폰스의 결과 부분

- 리폰스 : 브라우저의 HTML부분

 

HTTP 구성요소 : method, header, payload

더보기
  • Method 설명 (가장 대표적인 get, post) 
    • GET: 이름 그대로 어떤 리소스를 "얻을 때" 사용됩니다. 그리고 브라우저는 기본적으로 여러분이 웹 서핑을 한다고 가정하므로 모든 요청은 "GET" 메서드를 사용해서 서버에 요청을 보냅니다. (예외 상황도 있지만 거의 마주하지 않는 상황이기 때문에 여러분의 머리를 보호하기 위해 생략합니다 😇... 그래도 궁금하다면? 클릭)
    • POST: 웹 서버에 데이터를 "게시"할 때 사용하는게 일반적입니다. (ex. 회원가입, 게시글 작성, 댓글 작성)
  • Header 설명 (추가 데이터. 메타 데이터)
    • 브라우저가 어떤 페이지를 원하는지 : 리퀘스트
    • 요청 받은 페이지를 찾았는지
    • 성공적으로 찾았는지
    이러한 사례 외에도 아주 다양한 의사 표현을 위한 데이터를 모두 Header 필드에 넣고 주고 받습니다. 위에서 설명 된 메서드도 사실은 헤더에 포함되어 서버로 보내집니다 😁

 

  • Payload 설명 (데이터. 실질적인 데이터)
    • 서버가 응답을 보낼 때에는 항상 Payload를 보낼 수 있습니다.
    • 클라이언트(브라우저)가 요청을 할 때에도 Payload를 보낼 수 있습니다. 그리고 "GET method를 제외하곤 모두 Payload를 보낼 수 있다" 는게 HTTP에서의 약속입니다. (json형태?)
    • 추가적으로 DELETE method에서 Payload를 보낼수있지만, 보통 많은 경우에 Payload를 보내지않고있습니다.

 

 

https://www.cloudflare.com/ko-kr/learning/ssl/what-is-https/

 

오늘 작성한 노드

https://8naji.tistory.com/98

https://8naji.tistory.com/99

  https://8naji.tistory.com/101

 

회고 : 코드 리뷰.. 생각보다 흥미로웠고, 나의 많은 만행들을 다시 되짚어 볼 수 있었음..ㅎ 내 코드로 힘드셨을 팀원 들에게 좀 미안햇..ㅎㅎ 어쨋든 조만간 나왔던 용어들 정리해서 올려야겠다. 사실 다 모르지만🤣