Latest stories

Event-Loop Part 1 : Big Picture

E

사전지식 Process & Thread process와 thread에 대한 정리Process Management (Processes and Threads) I/O Device Basics of OS (I/O Structure)I/O Systems in Operating Systems | Device Drivers | interrupt Polling 심플한 결론 내 index.js를 읽고 실행한다내 코드를 읽으면서 파일 읽기/쓰기 네트워크 통신 관련 작업은 OS나 libuv에게 맡긴다(일이 끝나면, 내가 설정해 놓은 callback function이 실행되거나 event-queue에 넣어진다)이벤트 루프를 돌리면서, event-queue에 있는 callback function을...

Event-Loop Part 2 : setTimeout() vs setImmediate() vs process.nextTick()

E

들어가기에 앞서 이전글 : Event-Loop Part 1 : Big Picture이 글은 setTimeout(), setImmediate(), process.nextTick() 으로 설정한 callback function이 어떤 순서로 실행되는지에 대한 설명입니다.추가적인 그림 이전에 위와 같은 그림을 그렸었는데, 이전글과 이번글을 쓰는데 상당히 많이 참조한 이 글에 나오는 아래 그림을 바탕으로 설명하겠습니다(소스코드도 많이 가져다 썼습니다). 4. 이 글에서 setTimeout()는 setTimeout 함수 자체를 의미하고, setTimeout(cb)는 setTimeout()에서 설정한 callback function을 의미합니다. 심플한 결론...

Node.js는 single-thread가 아니다

N

결론 기본적으로 NodeJS는 event loop를 돌리는데 하나의 thread를 사용한다. 여기서 내 js code(callback function)가 실행된다. 그러나, CPU를 많이 사용해야 하는 일들을 이 main thread에서 처리할 수 는 없다. 그렇게 하면 다른 일을 못하고 서버가 엄청 느려질것이기 때문이다. 그래서 nodejs는 기본적으로 CPU Intensive한 작업들은 다른 thread에서 처리한다. 설명 crypto는 다른 thread에서 실행된다 nodejs module중에 암호생성과 관련된 crypto라는 모듈이 있다. 이 모듈의 pbkdf2()라는 함수를 사용하면 암호를 생성할 수 있다. 이 작업이 CPU Intensive하기 때문에, event loop가 돌아가는...

Blocking vs Non-Blocking

B

사전지식 I/O관련 작업은 OS와 I/O Device가 알아서 처리를 해주기 때문에, CPU가 할일이 별로 없다 Blocking Javascript코드를 한줄 한줄 실행하다가, I/O관련 작업이나 네트워크 통신을 하는 코드를 CPU(NodeJS의 single-thread에 할당된 CPU자원)가 만났을때, OS에게 그 일을 맡긴다. 그리고 CPU는 잠시 일을 쉬면서 결과를 기다린다. 그러다가 OS로 부터 일이 끝났다는 신호를 받으면, 바로 다음 Javascript코드를 한줄씩 읽기 시작한다. 이때 CPU가 잠깐 쉬면서 신호를 기다리는상태를 Blocking이라고 한다. from :  예를들어 console.log('start'); const fs = require('fs'); const data = fs...

Terminal에서 node index.js를 치면 무슨일이 일어날까?

T

index.js 파일안에 내가 쓴 javascript코드는 잘 실행되는데, 조금 더 큰 그림을 보고 싶었다. 그래서 nodejs 소스코드를 다운받아서 중요한것 같은 부분만 읽보고 실행 순서를 추측해 보았다. 심플하게 정리 node index.js → main()함수 실행Global Module( console.log , timer 등등의 기본 모듈) 로드내 index.js 로드 및 실행event-loop 실행 실제 코드 아래는 꼬리에 꼬리를 물듯이 node.js 안에서의 함수 호출과 정의를 따라 가본 과정이다. 언어는 C++과 Javascript이다. 함수의 내용물중 내가 잘 모르거나, 필요없어보이는 것들은 삭제하였다. // 시작은 main 함수! // src/node_main.cc :...

Node.js + 라즈베리파이로 원격 모터 제어하기

N

구글링해보면 라즈베리파이로 모터제어하는 글보다 아두이노로 하는게 많고, 라즈베리파이로 한다치다손 파이썬을 쓰는 경우가 많다. 하지만 나는 Node.js + Ra-Pi가 좋아서 이 조합으로 모터제어를 하였다. 목차 준비물Node.js 설치ngrokL298n 분석배선모터 제어원격 제어 준비물 라즈베리파이3 B+ (너무 옛날것만 아니면 다른 모델도 가능할것 같다)DC모터모터 드라이버 – L298n건전지 홀더 – AA건전지 4구AA건전지 4개안경 드라이버(꼭필요!) Node.js 설치 nodesource 사이트에 가보면, installation instructions 부분이 있다. 자신이 원하는 Node.js 버전과 라즈베리파이에 설치된 운영체제를 바탕으로 코드를 가져다 쓰면된다. 참고로...

Create-React-App 없이 React 환경설정

C

참고한 사이트 : Node 노드 공식 사이트에서 다운받고 설치하면 된다. NPM npm이 있어야 webpack, react, babel 등의 외부 라이브러리들을 쉽게 가져다 쓸 수 있고, 버전 관리도 쉬워진다. Node가 깔리면 자동으로 같이 깔리기 때문에 따로 설치할 필요는 없다. 프로젝트 시작 npm init Webpack 코드를 모듈로 나눠서 작성하고 그거를 하나(?)로 묶어준다. 자세한 내용은 여기를 참고한다. 추가적으로 필요한것들 Webpack dev server 말 그대로 개발서버이다. 이 라이브러리를 사용하면 webpack을 사용한 프로젝트에 개발서버를 아주 쉽게 구축할 수 있다. 코드를 막 짜고 저장만 해도 알아서 (빠르게) 번들링하고 브라우저에 실시간으로 반영도 해준다. babel...

Redux-Toolkit : Basic Tutorial

R

원문 : 주의 : 제가 이해하기 쉬운 방식으로 번역 및 첨언했습니다. Introduction: Writing a Counter Application Redux “Counter-Vanilla” Example function counterReducer(state, action) { if (typeof state == 'undefined') { return 0 } switch (action.type) { case 'INCREMENT': return state + 1 case 'DECREMENT': return state -1 default: return state } } var store = Redux.createStore(counterReducer); document...

Reduxtoolkit : INTERMEDIATE TUTORIAL

R

원문 : 주의 : 제가 이해하기 쉬운 방식으로 번역 및 첨언했습니다. 이전글 : 이번 글에서는 original Redux Todo App을 Redux-Toolkit을 사용한 Todo App으로 바꿔보면서 Redux-Toolkit의 사용법을 익혀볼것이다. Reviewing the Redux Todos Example original Redux Todo App을 보면 아래것들을 발견할 수 있다. todos reducer function 은 state의 불변성을 유지하기 위해서 “직접” object를 deep copy하고있다.actions file 에서 action 생성자 함수를 “직접” 작성하고 있다. 또한, aciton의 type을 string으로...