5.node js

Geun-Hyung Kim
UMCL @ Dong-Eui University
Introduction to
Node.js

개 요
Node.js ?
Server-side framework
useful for building highly scalable and fast
network applications
JavaScript runtime built on Chrome’s V8 JavaScript engine.
It uses an event-driven, non-blocking I/O model that makes
it lightweight and efficient, perfect for data-intensive real-
time applications that run across distributed devices
developed by Ryan Dahl in 2009

개 요
Architecture
node standard library
node bindings
(socket, http, etc.)
V8
thread
pool
(libeio)
event
loop
(libev)
DNS
(c-ares)
crypto
(OpenSSL)
JavaScript C/C++

개 요
Brief History
JavaScript’s Speed revolution has started since 2008.
2008. 9: Google releases Chrome Web browser beta version based on
V8 JavaScript Engine
2009. 1: ServerJS project (currentCommonJS project) started to use
JavaScript in other areas except Web browser.
2009. 11: Node.js was released based on CommonJS standard and V8
JavaScript Engine (for Linux)
2011. 5: npm (Node Package Manager) 1.0 was released
2011. 7: Node.js for Windows was released
2009. 3: Node.js had a name.

개 요
Why Node.js?
<source: modulecounts.com>
Node packages are growing faster
than Ruby, Python, and Java
combined
asynchronous, event-driven
framework
designed for creating scalable
network app.
single-threaded
uses a concurrency model based on
an event loop
non-blocking with callback function:
handle concurrent operations
without multiple thread of execution
no buffering
ideal for I/O bound applications,
but not so great for CPU-heavy
applications

개 요
Event based Asynchronous
<현황>
각 상점에 가서 물건을 구매하기 위해서 대기를 기다려야 함.
한 상점 씩 다니면서 물건을 살 경우 27분이 소요된다.

Event based Asynchronous
<해결책>
1. 몸을 복제하여 동시에 여러 가게에 간다. (thread 기반 동기방식)
2. 각 상점에서 대기표를 나누어주는 시스템을 바꾸고 대기표를 받고 기다린다.
(이벤트 기반 비동기 방식)

Sync. vs. Async. I/O
fileRead(fileName)
1. 파일 읽기 요청
3. 파일 읽기 완료
2. 파일 읽는 중
Synchronous I/O

Sync. vs Async I/O
fileRead(fileName,callback)
1. 파일 읽기 요청
4. 파일 읽기 종료 후
callback 함수 호출
3. 파일 읽는 중
2. 바로 리턴
Asynchronous I/O

Installation
Official Node.js website
https://nodejs.org/en/download/
windows installer 다운로드하여 설치

Installation
Version Check and Start!
1. version check
2. execute node (it shows Node shell.)
3. type simple code to prompt “Hello World” to the console
Node shell 에서 빠져 나오는 방법: Ctrl+d

Node Program
Hello World!
// helloworld.js
console.log(“Hello World”);
// execute helloworld.js
$ node helloworld.js

HTTP Server
Target
로그인
id:
pw:
login
geunkim Welcome to this world
To geunkim
http://localhost:8000/start http://localhost:8000/hello

HTTP Server
var http = require(“http”);
http.createServer(function (request, response) {
response.writeHead(200, {“Content-Type”:”text/plain”});
response.write(“Hello World!”);
response.end();
}).listen(8000);
console.log(“Http Server has been started”);
// server.js
// cmd terminal
$ node server.js
// browser
http://localhost:8000
Simple HTTP Server - 1

HTTP Server
function onRequest(request, response) {
console.log(“Request Received”);
response.end();
}
http.createServer(onRequest).listen(8000);
// server1.js
Simple HTTP Server - 2

Node.js has a simple module loading system.
module: a single unit of code which encapsulates
related codes into.
When creating a module, this can be interpreted as
moving all related functions into a file.
In Node.js, files and modules are in one-to-one
correspondence (한 파일이 모듈이 하나..).
Assign an expression in a module file, that we want to
become available in other files to the exports object.
making a user module
Module
<ref: https://nodejs.org/api/modules.html#modules_modules>

Exporting a Module
exports.sayHelloInEnglish = function() {return “HELLO”;};
exports.sayHelloInSpanish = function() {return “Hola”;};
// greetings.js
exports.add = function(a, b) {return a+b;};
exports.sub = function(a, b) {return a-b;};
exports.mul = function(a, b) {return a*b;};
exports.div = function(a, b) {return a/b;};
// calc.js
// circle.js
const PI = Math.PI;
exports.area = (r) => PI *r *r;
exports.circumference = (r) => 2 *PI * r;
<ref: https://www.sitepoint.com/understanding-module-exports-exports-node-js/>

(info.) The keyword require is used in Node.js to import modules.
make a user module
Import a Module
var require = function(path){
// …
return module.exports;
}
require module files in your js file.
var greetings = require(“./greetings.js”);
access the publicly available methods of greetings.js
greetings.sayHelloInEnglish();
greetings.sayHelloInSpanish();
<ref: https://www.sitepoint.com/understanding-module-exports-exports-node-js/ >

import calc.js
Import a Module
import circle.js
var calcObj = require(“./calc.js”);
var circle = require(“./circle.js”);

When a file is run directly from Node.js, require.main is
set to its module.
So, developer can determine if a file has been run directly by testing
For a file foo.js,
this will be true when it run via node foo.js.
But, this will be false, then it run by require(“./foo”)
Accessing the main module
require.main === module

http server module
function start() {
console.log(“Request Received”);
response.write(“<h1>Welcome to HTTP Server !</h1>”);
response.write(“<h2>Hello World..</h2>”);
response.end();
}
}
exports.start = start;
// httpServer.js (version 1)

using http server module
var httpServer = require(“./httpServer”);
httpServer.start();
// index.js (version 1)
// execute index.js
$ node index.js
// browser
index.js
httpServer
start()

Http Server는 다양한 사용자 요청에 응답해야 함
조회를 위한 요청, 저장을 위한 요청 등 다양한 요청을 식별하는 routing
기능을 고려
Router
request URL과 GET/POST parameter에 따라 실행할 코드를 결정
Routing: Dependency Injection
Dependency Injection
HTTP 요청에서 URL과 GET/POST Parameter의 추출이 필요
이 정보는 어디에 있을까 ?

Routing: url parsing
url and query parsing
http://localhost:8000/start?foo=bar&hello=world
url.parse(string).pathname
querystring.parse(string)[“foo”]
url.parse(string).query
querystring.parse(string)[“hello”]
request.url
require “url” module
require “querystring” module

http://localhost:8000/start?foo=bar&hello=world
parsing results:
url and query parsing

request url
var url = require(“url”);
console.log(request.url);
response.end();
}
// httpServer.js (version 1-1)

Routing: pathname parsing
pathname parsing
function start() {
var pathname = url.parse(request.url).pathname;
console.log(“Request for ” + pathname + “ received.”);
response.write(“<h1>Welcome to HTTP Server !<h1>”);
response.write(“<h2>Hello World..<h2>”);
response.end();
}
}
//httpServer.js (version 2)

Routing: router module
simple router
function route(pathName) {
console.log(“about to route a request for “ + pathName);
}
exports.route = route;
// router.js (version 1)
index.js
httpServer
start()
router
route()inject function
index.js에서 router module을 로딩하고 route()함수를 httpServer에 전달하여 실행하는 구조
Dependency Injection
server 코드 변경없이 router 함수 교체가 가능

Routing: router
var httpServer = require(“./httpserver”);
var router = require(“./router”);
httpServer.start(router.route);
index.js with router
server.js 는 start() 실행 시 route 함수를 전달하여
‘request’ 이벤트가 발생할 때 마다 route() 함수를 호출하여
클라이언트 요청을 식별

Routing: router
function start(route) {
route(pathname); // injected function call
response.write(“<h2>Hello World..<h2>”);
response.end();
}
}
httpServer with router

Server: receives client’s request
Router: route the client’s request to the request handler
Request Handler: process the client’s specific request
Routing: Request Handler
Request Handler
index.js
httpServer
start()
router
route()
inject function
request
Handler
handle

Request Handler
//requestHandlers.js (version 0)
function start() {
console.log(“Request handler ‘start’ was called”);
return “Welcome Start Page”;
}
function hello() {
console.log(“Request handler ‘hello’ was called”);
return “Welcome Hello Page”;
}
exports.start = start; //export start
exports.hello = hello;

Request Handler
function start() {
}
function hello() {
return “Welcome Hello Page”;
}
var handle = {};
handle[“/“] = start;
handle[“/start”] = start;
handle[“/hello”] = hello;
exports.handle = handle; //export JavaScript Object

index.js with request handler
var httpServer = require(“./httpserver”);
var router = require(“./router”);
var requestHandlers = require(“./requestHandlers”);
httpServer.start(router.route, requestHandlers.handle);
start() 실행 시 route 함수와 handler 객체를 전달하고
‘request’ 이벤트가 발생할 때 마다
handler 객체를 route() 함수에 전달하여 호출하여
클라이언트의 요청을 식별하고 해당 기능 수행

router.js with request handler
function route(handle, pathName) {
if (typeof handle[pathName] === ‘function’) {
return handle[pathName]();
} else {
console.log(“No request handler found for “ + pathName);
return “404 Not Found”;
}
}
요청(pathName) 별로 다른 함수를 호출

httpServer with router
function start(route, handle) {
var content = route(handle, pathname);
response.write(content);
response.end();
}
}
construct response message with return value
of request handler

Routing: Blocking
From request to response
HTTP Server
Router
Request Handlers
request
url forwarding
invoke handler
response
return result
return result
Problem:
Request Handler’s processing time may degrade the performance of HTTP Server.

Routing: Blocking
Performance
//requestHandlers.js (version 1-1)
function start() {
function sleep(msecs) {
var startTime = new Date().getTime();
while(new Date().getTime() < startTime + msecs);
}
sleep(10000); // 10 sec waiting
}
Server waits util this function returns.
This makes the response delay of other request.

Routing: Non Blocking
From request to response
HTTP Server
Router
Request Handlers
request
pass response object
pass response object
response
Each request handler sends the response message individually.

Routing: Non Blocking
httpServer with non-blocking
function start(route, handle) {
route(handle, pathname, response);
}
}

function route(handle, pathName, response) {
handle[pathName](response);
} else {
response.write(“404 Not Found”);
response.end();
}
}
Non blocking router

View Logic
View logic for POST
//start function in requestHandlers.js (version 2)
function start(response) {
var body = “<html><head><title>First View</title>”+
“<meta charset=‘UTF-8’></head><body>“ +
“로그인</br>”+
“<form action=‘/hello’ method=‘post’>” +
“id: <input type=‘text’ name=‘id’></input>”+
“ <input type=‘submit’ value=‘login’/></br>”+
“pw: <input type=‘text’ name=‘pw’></input>”+
“</form></body></html>”;
response.writeHead(200, {“Content-Type”:”text/html”});
response.write(body);
response.end();
}

POST data receiving
Asynchronous Data receiving
request.addListener(“data”, function(chunk) {
// called when a new chunk of data was received
}
request.addListener(“end”, function() {
// called when all chunks of data has been received
}

POST data receiving
httpServer with POST
var postData =“”;
request.setEncoding(“utf8”);
request.addListener(“data”, function(chunk) {
postData += chunk;
});
request.addListener(“end”, function() {
route(handle, pathname, response, postData);
});
}
//onRequest function in httpServer.js (version 6)

POST data receiving
function route(handle, pathName, response, postData) {
handle[pathName](response, postData);
} else {
response.end();
}
}
Router with POST

Pass POST data to the Client
Request handler with POST
function hello(response, postData) {
var out = “To “ + querystring.parse(postData)[“id”];
response.write(out);
response.write(“</br> Welcome to this World”);
response.end();
}

GET data receiving
httpServer with GET
var getData =“”;
getData += url.parse(request.url).query;
route(handle, pathname, response, getData);
}
//onRequest function in httpServer.js (version 7)

GET data receiving
function route(handle, pathName, response, getData) {
handle[pathName](response, getData);
} else {
response.end();
}
}
Router with GET

View Logic
View logic for GET
//start function in requestHandlers.js (version 3)
function start(response) {
var body = “<html><head><title>First View</title>”+
“<meta charset=‘UTF-8’></head><body>“ +
“로그인</br>”+
“<form action=‘/hello’ method=‘get’>” +
“id: <input type=‘text’ name=‘id’></input>”+
“ <input type=‘submit’ value=‘login’></br>”+
“pw: <input type=‘text’ name=‘pw’></input>”+
“</form></body></html>”;
response.writeHead(200, {“Content-Type”:”text/html”});
response.write(body);
response.end();
}

Pass GET data to the Client
Request handler with GET
function hello(response, getData) {
var out = “To “ + querystring.parse(getData)[“id”];
response.write(out);
response.write(“</br> Welcome to this World”);
response.end();
}

Node: Appendix
Who uses Node ?

E-Commerce
Payment Processing
Social Media
Realtime Services
Media Applications
Enterprise Services
Node: Appendix
Apps suited for Node.js

Node.js: Hello로 시작하는 Web 애플리케이션
http://www.nextree.co.kr/p8574/
The Node Beginner Book
Simona Clapan, “The MEAN stack - SoCalCodeCamp -
june 29th 2014” from slidehsare
References

5.node js

More Related Content

What's hot (20)

Viewers also liked (15)

Similar to 5.node js (20)

More from Geunhyung Kim (7)

Recently uploaded (20)

5.node js