TIL_2024-11-19_Node.js_입문_1-1~1-13

그동안 Js 를 이용하여 웹페이지를 만들고 CLI 로그라이크 게임을 만들었지만 제대로 이해한 상태에서

해당 코드를 사용한것은 아니었다.

 

장님이 다른사람의 말을 믿고 길을 찾아가는 느낌으로

안되면 될때까지 때려 맞춰서 만들었다고 해야하나?

엄청 비효율의 극치를 달렸지만

그만큼 얻은것들도 있다.

시간낭비?! 그것도 어느정도는 필요하다.

하지만 선행되어야 할것이 안되어있다면 허공에 발을 저어 이동하는것과 같이

우리가 수영하는 법을 모른다면 개헤엄치듯 갈수는 있지만 지치는건 어쩔수 없다.

기본기가 탄탄한 만큼 앞으로 나아갈때 시너지 효과는 더더욱 커질것이다

 

우선 Node.js 임문주차 1주 2주차 까지 모두 빠르게 훑어 보고

이제 조금씩 해당 내용을 다시 보며 이해가 되지 않았던것 등등 천천히 곱씹어 보며 정리하고 있다.

 

 

우선 1주차 1-13 까지의 내용 정리

 

Node.js 입문

 

웹 브라우저의 통신 방식

 

웹 브라우저는 인터넷 브라우저 라고도 불리며,

웹 서버로 부터 정보를 요청 하고 받아 사용자에게 보여주는 소프트 웨어입니다.

 

HTML, CSS , JavaScript 파일을 전달 받아 이를 해석하고 우리의 눈으로 볼 수 있게 되는 것이다.

 

정적인 파일과 동적인 정보 2가지 정보를 처리하게된다.

 

정적웹페이지는 서버에서 브라우저로 전송되는 그대로 표시 되고

동적웹페이지는 서버로부터 데이터를 받아 브라우저가 실시간으로 내용을 생성 또는 변경된다.

---

 

브라우저의 통신 방식 순서

 

1. 사용자가 웹 브라우저의 주소창에 URL을 입력합니다.
2. 웹 브라우저는 입력받은 URL을 DNS 서버로 전달하여 해당 IP 주소를 찾게됩니다.
3. IP 주소에 연결된 웹 서버는 요청 Request 을 받아 처리합니다.
4. 웹 서버는 처리 결과를 HTTP Response 로 브라우저에게 전달합니다.
5. 웹 브라우저는 받은 HTTP Response 을 바탕으로 사용자에게 표시하게 됩니다.

---

 

 

URL 은 인터넷 상의 리소스 위치를 나타내기 위해 사용합니다.

 

 

 

 

 

각 주소를 사용하다 보니 주소가 고갈될 위험에 처했다.

 

그리하여 IPV6 가 나왔다.

더 많은 주소를 사용 할 수 있게 되엇다.

 

 

HTTP의 이해

데이터를 주고 받는 양식을 정의한 통신 규약 중 하나가 HTTP입니다.

통신 규약 : Protocal

 

통신 규약이란 컴퓨터끼리 데이터를 주고 받을때 정해둔 약속을 의미합니다.

 

요청 Request 과 응답 Response

 

Req 요청, 요구

 

Res 응답, 반환

 

 

GET 가져오기 및 얻을때

 

POST 게시 및 생성

 

Header 추가 데이터 메타 데이터

 

Payload 서버가 응답을 보낼때에는 항상 Payload를 보낼수 있습니다.

Get method 를 제외하곤 모두 Payload를 보낼 수 있다 는게 HTTP에서의 약속입니다.

 

웹 서버의 이해

 

 웹 서버는 HTTP를 이용하여 인터넷 상에서 클라이언트의 요청을 처리하고 응답해 주는 컴퓨터 또는 프로그램 이다.

 

웹서버는 클라이언트의 HTTP 요청을 받아 정적인 콘텐츠 를 제공합니다.

 

클라이언트의 요청을 웹 어플리케이션 서버 WAS로 전달하여 처리할 수 있습니다.

대표적인 웹 서버로는 Apache, Nginx 이 있습니다.

 

 

 

 

WAS 웹 어플리케이션 서버는 웹 서버와 협력하여 동적인 컨텐츠를 제공합니다.

데이터 베이스를 조회하거나 복잡한 계산과 같은 비즈니스 로직을 처리합니다.

클라이언트의 요청을 웹 서버로부터 전달받아 처리하고, 결과를 다시 웹 서버에 반환하여, 최종적으로 클라이언트가 응답을 받을 수 있도록 구성됩니다.

웹 어플리케이션 서버는 콘텐츠 생성이나 데이터베이스와의 상호작용이 필요할때 주로 사용합니다.


사용자는 브라우저를 통해 HTTP request 로 웹사이트를 웹 서버에 요청하고 웹서버는 이 요청을 처리한 후 HTTP response를 통해 대항 웹사이트 데이터를 브라우저에 전송합니다.

마지막으로 브라우저는 서버에서 받아온 데이터를 이용해 웹사이트를 브라우저에 그려내는 일을 합니다.

 

JavaScript

 

존재 하기 이전의 웹 생태계는 워드에서 볼수있는 형태의 순수한 문서형태의 페이지였다.

 

하이퍼 링크를 걸어둔것이 전부였는데

 

정적인 문서를 조금 더 동적으로 표현 할 수 있게 만들어 진것이 NetScape라는 웹 브라우저를 통해 상호작용을 강조하기 위해 간단한 기능을 넣어 만든것이 자바 스크립트의 시초였습니다.

 

정적 웹페이지는 확정된 페이지로 실시간 정보나 맥락을 반영하지 못합니다.

 

동적 웹페이지는 반대로 맥락과 상황을 반영할 수 있는 페이지를 말합니다.

 

 

Node.js는

 

Chrome V8엔진으로 빌드된 JavaScript 런타임입니다.

 

이벤트 기반, 논 블로킹 I/O 모델을 사용해 가볍고 효율적입니다.

npm 패키지 오픈 소스 라이브러리 생태계를 사용할 수 있습니다.

 

논블로킹은 싱글쓰레드 환경이고

싱글쓰레드 환경에서는 멀티쓰레드 환경과 달리 학습 곡선이 낮고

빠르게 원하는 기능 구현을 할 수 있다는 장점이 있지만

멀티 쓰레드 환경보다 처리의 속도는 차이가 날 수 밖에 없습니다.

하지만 멀티 쓰레드 환경의 문제점을 밀어두고

해당 문제에서 벗어날수 있어 그만큼 쉽게 사용이 가능합니다.

 

이벤트 루프는 여러 이벤트 들과 같은 비동기 작업들을 모아서 관리하고,

어떤 순서대로 실행해야하는지 도와주는 도구입니다.

 

 

자세한 내용을 보자 뇌를 그냥 관통하는 내용들 뿐이라 그나마 이해되는 자료가 해당 이미지 입니다.

 

https://www.korecmblog.com/blog/node-js-event-loop

Node.js 이벤트 루프(Event Loop) 샅샅이 분석하기

 

 

웹 프레임 워크는 프로그래밍의 특정 부분을 추상화 하여,

개발자가 더 높은 수준에서 프로그램을 작성할 수 있게 도와주는 도구입니다.

 

차를 처음 부터 모든 부품을 하나씩 직접 만드는 것 보다는

이미 만들어진 부품들을 조립하는 편이 더 빠르고 효율적이기 때문입니다.

 

이와 같이 이미 만들어진 기능들을 재사용하고, 이를 조립하여 웹서비스를 만드는것 입니다.

 

Express를 사용한다면 복잡성을 줄이고 개발 과전을 단순화 할 수 있게 될 것입니다.

 

Express.js 의 가장 큰 특징중 하나는 미들웨으를 지원하는 것입니다.

미들웨으는 사용자의 요청과 응답 사이에 위치하며, 특정 기능을 수행하는 함수로 생각할 수 있습니다.

 

Express는 웹 프레임워크일 뿐이고 Web Server와 동일하지 않습니다.

Node.js를 위한 웹 프레임 워크일 뿐이고 웹 서버 자체가 아니라

웹 서버를 구현하는데 도움을 주는 도구입니다.

 

모듈

추가 공부해야 하는 키워드 
정적 모듈 Static module
동적 모듈 Dynamic module

순환 종속 Circular Dependency

 

 es6의  module 을 사용하기 위해 type: module설정을 해주어야 한다.

 

상대경로

 

 

export default funtion 도 사용해보고

 

export 방법이 여러가지 있는데 이것에 대해서도 좀 더 확인이 필요하다.

함수 앞의 exprt

export default function

export default 명칭;

 

default를 사용하면

import  * as 별칭 from '경로'

별칭.defalut로 사용이 가능하다.

 

아직까진 실습이 크게 없어서 export 이외에는 크게 와닿지 않았다.

이제 점점 실습이 늘어날것인데 기대가 된다!!

2주차 까지 모두 들었지만 영상만 보고 넘어갔기 때문에 근질 근질 하던 참이었다!!