> For the complete documentation index, see [llms.txt](https://injun-woo30000.gitbook.io/growth-log/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://injun-woo30000.gitbook.io/growth-log/daily-review/2021/april/2021-04-02-fri.md). # 2021-04-02(Fri) | 항목 | 내용 | | ---------- | ------------------------------ | | 학습 날짜 | 2021-04-02(금) | | 학습 시간 | 11:00\~23:00 | | 학습 범위 및 주제 | node.js, express.js | | 학습 목표 | qr-checkin 코드를 분석할 수 있도록 학습한다. | | 동료 학습 방법 | - | ## 상세 학습 내용 오늘부터 메타-스터디 자료도 남겨보겠다. 클로저 자료 중 끝판왕 C로 치면 일종의 메모리릭에 해당하는 현상이 `var` 키워드를 통해서는 자연스럽게 일어난다. 메모리에 남아있다니. 걱정마라 쓰고나서 null 처리해주면 GC가 처리해주니까! ### Node.js 학습 메모 **쓰레드 기반 vs 비동기 이벤트 기반** 대부분의 애플리케이션은 Blocking I/O를 사용하여 멀티 쓰레드를 사용할 수 밖에 없었다. * Blocking I/O는 **하나의 프로세스가 어떤 자원을 사용하고자 할 때 그 자원을 다른 프로세스가 점유하고 있다면, 그 프로세스가 그 자원의 사용을 끝마칠 때까지 기다려야 한다는 것**을 의미한다. * 문제는 **Blocking I/O 자체가 쓰레드 지연을 발생시킨다는 것이다.** I/O 요청을 하고 응답이 올 때까지 아무것도 하지 않고 시간을 낭비하게 된다! * 또한 **스케쥴링 자체에 걸리는 시간과 쓰레드가 많아질 수록 늘어나는 Context switch 비용도 무시할 수 없다.** * 대안으로는 쓰레드들을 별도로 관리하거나, 더 작은 단위로 쪼개어 VM 등으로 실제 쓰레드로 분배하는 방식 같은 대안이 등장한다. 그리고 노드의 방식도 대안이다. 어떤 식이냐면.. #### 싱글 쓰레드와 이벤트 기반의 비동기 I/O 처리 노드는 이러한 문제들을 **싱글 쓰레드**와 **이벤트 기반의 비동기 I/O 처리로 해결**하고 있다. 노드는 I/O 작업이 시작되면 I/O 작업 처리에 대한 응답을 기다리지 않고, **바로 다음 작업을 실행**해버린다. 대신 I/O 작업이 종료되면 이벤트를 발생시키고, 이 이벤트는 해당 프로세스의 이벤트 큐에 등록되게 된다. 노드로 개발된 프로세스는 이 이벤트 큐에 등록된 새로운 이벤트를 감지하여, 해당 이벤트 시 수행하여야 할 작업을 실행하게 된다. #### 이벤트 루프 이벤트 루프(Event Loop)라는 것은 작업을 요청하면서 그 작업이 완료되었을 때 어떤 작업을 진행할지에 대한 콜백 함수를 지정하여 **동작이 완료되었을 때 해당 콜백 함수를 실행되는 방식의 동작 방식**을 말한다. 이런 방식이기 때문에 **이벤트 루프는 어떤 요청이 발생하면 그 작업에 대해 쓰레드 실행만을 일으킬 뿐**이다. ![image](https://user-images.githubusercontent.com/54612343/113382132-b765c680-93bb-11eb-85b7-566952004d7b.png) jekim님과 관련해서 토론하다가 이 [링크](https://velog.io/@gtah2yk/-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%8B%9C%EA%B0%81%ED%99%94-%EC%9D%B4%EB%B2%A4%ED%8A%B8-%EB%A3%A8%ED%94%84-7yk5qv46ur)를 공유 받았다. ### Node.js의 아키텍쳐 ![image](https://user-images.githubusercontent.com/54612343/113382224-f85ddb00-93bb-11eb-9090-2ac0a0940625.png) 초창기의 Node.js 아키텍쳐. ![image](https://user-images.githubusercontent.com/54612343/113382318-2cd19700-93bc-11eb-8b29-1cc159710cd5.png) 지금은 기술이 발전하여 위처럼 libev의 종속성을 제거하고 libeio와 libev를 쓰는 버전으로 변경되었다. 각 모듈별 역할은 이 [링크](https://edu.goorm.io/learn/lecture/557/%ED%95%9C-%EB%88%88%EC%97%90-%EB%81%9D%EB%82%B4%EB%8A%94-node-js/lesson/174356/node-js%EC%9D%98-%EC%95%84%ED%82%A4%ED%85%8D%EC%B3%90)를 참고. ### npx 라이브 코딩을 보아하니, 모듈을 받을 때 `npm`, `npx`, `yarn` 등을 혼용하는 것처럼 느껴진다. 특히 `Sequelize`를 다룰 때 `npx` 를 많이 쓰기에 이 녀석이 무엇인지 궁금해져 버렸다. #### 그래서 npx는 뭘까? npx는 새로운 패키지 관리 모듈이 아니라, 자바스크립트 패키지 관리 모듈인 npm(Node Package Module)의 5.2.0 버전부터 새로 추가된 도구이다! `npx` 명령어를 사용할 수 있다면, npm 레지스트리에 올라가있는 패키지를 쉽게 설치하고 관리할 수 있도록 도와주는 CLI 도구이다. * npm: Package Manager(관리) * npx: Package Runner(실행) #### 왜 npx가 도입될 필요가 있었을까? 과거 npm으로 패키지를 설치할 때 두 가지 케이스가 있었다. 1. 전역으로 패키지를 설치하여 의존성 라이브러리들을 전체적을 관리하는 방법 2. 특정 프로젝트에만 의존성 라이브러리를 설치하는 방법 이러한 의존성 라이브러리들이 전역이나 로컬에 설치된 채 관리가 되면 설치된 위치에 따라 따로 관리해줘야한다는 번거로움이 발생한다. npx는 기존 npm 설치 방법과는 다르게 일일이 설치, 제거를 할 필요 없이 일회성으로 원하는 패키지를 npm 레지스트리에 접근해서 실행시키고 설치하는 실행도구이다. 따로 패키지를 설치하고 업데이트하지 않더라도 npm 레지스트리에 올라가 있는 최신 버전을 실행시키고 설치만 시키면 끝인 셈이다. [참고](https://webruden.tistory.com/275#:~:text=npx%EB%8A%94%20npm%20%EB%A0%88%EC%A7%80%EC%8A%A4%ED%8A%B8%EB%A6%AC%EC%97%90,%EC%8B%A4%ED%96%89%ED%95%A0%20%EC%88%98%20%EC%9E%88%EA%B2%8C%20%EB%8F%84%EC%99%80%EC%A4%8D%EB%8B%88%EB%8B%A4.) ## 학습 내용에 대한 개인적인 총평 쌩뚱맞게 node & express 학습을 시작했다. spring도 넘 재밌게 하고 있었긴한데, [QRcheckin](https://github.com/kenu/qr-checkin)에 이벤트 테이블을 붙여보고 싶어져서..ㅎㅎ; 다른 것보다 실제로 사용되는 서비스를 만들고 싶다는 갈증이 너무 커진 상태이다. 무엇보다 사람들이 많이 쓰는 코드를 작성하고 싶다. cub3d tester도 사람들이 많이 써주니까 즐겁더라. 마침 관심있었던 것들이 모여있다. * node * QR코드 * 상용 서비스에 테이블 붙이기 사실 나를 제한하는건 나 밖에 없다. 놀 시간에 node & express 공부해보자, 그냥 잠을 덜 자면 되지 뭐ㅎㅎ :) flow는 아래와 같이 할 것이다. 1. node 기초 학습 (완료) 2. QR 코드 리더기 뜯어보기 (진행 중) 3. 테이블 붙이기 4. 붙인 테이블에 이벤트 입력하는 어드민 페이지 개발 ## 다음 학습 계획 * QR 코드 리더기에 테이블 붙이기