Save 10% off ANY FITC event with discount code 'slideshare'
See our upcoming events at www.fitc.ca
Node.js: The What, The How and The When
with Richard Nieuwenhuis
2. WHO AM I?
•
Richard Nieuwenhuis
•
32 years old
•
MediaMonks
•
7 years a Monk
•
Lead of Operations / Head of
development
3.
4. Overview
•
What is Node.js
•
Some small examples
•
Asynchrony here, asynchrony there
•
Some (popular) Node.js modules
•
Socket.io
•
High performance examples
•
Some tips & tricks
5. When and by whom?
•
First made public in 2009
•
Ryan Lienhart Dahl
•
Currently at version 0.10.25*
•
“Why is a progress bar so difficult?”
•
•
“Why the heck are we polling???”
This sheet was created 17-2-2014
6. What nodejs.org says
•
“Node.js is a platform built on Chrome's JavaScript runtime for
easily building fast, scalable network applications. Node.js 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.”
7. In short how many people see it
•
Server side JavaScript!
9. Where to begin?
•
Download & Install Node.js
•
•
Use your favorite IDE
Node.js API/Modules:
•
•
Sort of API‟s which expose Node functions
•
Allows the Node.js community to extend Node.js
•
•
Built-in
Super lightweight
Add-ons
•
Quite a big community
•
The NPM (Node Package Manager)
10. Some Node.js APIs/Modules
•
http
•
•
Provides basic functions for creating a server and handling requests
https
•
•
For setting up a secured server
assert
•
•
For creating unit tests for your code (NodeTDD!)
fs
•
For doing stuff with the File System
12. Let‟s build something simple
•
Simple server
•
Every “Hello World” Example starts with this.
•
Read the files of a folder.
•
Print the file names in the browser in sorted fashion.
•
PS. Examples show Node specifics and are to illustrate points and are by no
means “elegant, save” etc :-)
13. Create our own module: sorterservice.js
function sortFileNames(fileNames){
return fileNames.sort();
}
exports.sortFileNames = sortFileNames;
-
a module can be a single file
a module can be a folder
exports is a special object to define properties
-
Can be any type: function, strings, etc
14. Requiring needed modules
//require the needed modules
var http = require('http');
var fs
= require('fs');
var sorter = require('./sorterservice');
15. Create server and verify requests
http.createServer(function(req, res){
switch(req.method){
case 'POST':
console.log('This is a post request');
break;
case 'GET':
switch(req.url){
case '/':
readFileNames(res);
break;
case '/showfiles„:
readFileNames(res);
break;
case '/favicon.ico„:
break;
}
break;
default:
res.setHeader('Content-Type', 'text/plain');
res.end("This method I simply do not know");
}
16. Let‟s read the file names
function readFileNames(res){
var dirName = './files';
var html = '';
var fileNames
= fs.readdirSync(dirName);
var sortedFileNames = sorter.sortFileNames(fileNames);
html += '<ol>';
for(var index in sortedFileNames){
html += '<li>' + sortedFileNames[index] + '</li>';
}
html += '</ol>';
sendFileNames(res, html);
}
17. One last thing & Does it work?
function sendFileNames(res, html){
res.setHeader('Content-Type', 'text/html');
res.end(html);
}
18. Two big things not OK here
Which are also two important Node aspects
1)
Error handling
2)
A-synchronous architecture
19. Main problem 1
function readFileNames(res){
var dirName = './files';
var html = '';
var fileNames = [];
fileNames
= fs.readdirSync(dirName);
var sortedFileNames = sorter.sortFileNames(fileNames);
html += '<ol>';
for(var index in sortedFileNames){
html += '<li>' + sortedFileNames[index] + '</li>';
}
html += '</ol>';
sendFileNames(res, html);
}
20. What did we see?
•
The server crashed and Node stopped running
•
A lot less forgiving than PHP for example
•
Not OK during a super bowl commercial where millions of Dollars are spend
;-)
Tip: Look at the Node.js module forever
21. In this case a simple
if (fs.existsSync(dirName)){
fileNames = fs.readdirSync(dirName);
}
Would suffice….
•
Defensive programming is super important in Node
•
Verify everything!
•
Valid user input
•
Expect the unexpected (even if you expect otherwise)
•
Act on any error that may occur (and log it)
•
Have a process in place to restart node just to be sure (forever module)
23. Synchronous development
•
Blocking/Synchronous requests are bad
•
•
It will “block” the continuation of your logic for the amount of time the
blocking request is active (requesting a JSON file for example)
On the server you basically have the same problems
•
•
But it will affect all visitors immediately when one request is stalling
Can ultimately lead to a crashing server
25. Continued
Pffff, I need to
return 200K
rows?
Request
Cpu to r2: Sorry, I
am doing nothing,
but the DB is
sooooo slowww
Request 2
Going to take
me a while!
doQuery()
CPU
processData()
Cpu
time
DB
26. The Event Loop
Take this event
loop!:
doQuery(cb)
Pffff, I need to
return 200K
rows?
Going to take me
a while!
Request
CPU to r2: thanks
man! I am
processing your
request
Request 2
CPU
processData()
E
loop
callback
DB
27. A-Synchronous Node development
A lot of Node functions have a-synchronous versions.
fs.readdir(dirName, function(err, data){
if (err){
console.log();
}
var sortedFileNames = sorter.sortFileNames(data);
//The other code
--------------------------http.createServer(function(req, res){……
28. A-Synchronous Node development
•
A-synchronize as much as possible to keep the main process as “free” as
possible.
•
•
Much more necessary when it is a high-performance environment
It is not the holy grail! Keep the Big O in mind: for (var x = 0; x < 25.5Billion;
x++)
•
Sequencing & parallel
•
Can become quite messy and unreadable
29. A highly unlikely hypothetical situation
•
Read the files from Dir A
•
Merge the content of all files of Dir A into one file
•
Read the files from Dir B
•
Append the content of step 1 to all files in Dir B
•
Store these results in the Database
30. Would look something like this
aSynReadDir('A/', function(files) {
mergeFiles(files, function(fileContents) {
aSynReadDir('B/', function(files) {
appendFiles(fileContents, files, function(appendedFiles) {
insertIntoDatabase(appendedFiles, function() {
});
});
});
});
});
31. Useful Node Modules: Socket.io
•
Latest browsers support Web sockets
•
IE10+
•
Chrome
•
FireFox
•
“Weirdly” on Android only starting from 4.4…
•
Socket.io leverages the Web socket technology for bi-directional
communication between clients & servers:
•
With degradability in place for the “older” browsers!
32. Socket.io continued
•
Very nice for real time applications with a lot of concurrent users.
•
Browser based games where you mobile is the controller
•
Second screen applications
•
Updating the client:
•
Chat
•
Real time statistics
•
News updates
•
Etc
33. Small example (Server)
var server = http.createServer(function(req, res){
//code here
});
var io = socketio.listen(server);
function sendRandomMessage(){
var index = Math.floor((Math.random()*4));
io.sockets.send(words[index]);
}
34. Small example (Client)
var socket = io.connect();
socket.on('message', function (message) {
console.log(„I received the message ' + message);
var m = document.createElement('p');
m.innerText = message;
document.getElementById('text').appendChild(m);
});
36. Other Useful Node Modules
"dependencies": {
"express": "3.4.7", // Web Framework
"express-validator": "1.0.1",
"request": "2.25.0", //
"redis": "0.10.0", //Redis: High performance in memory DB
"hiredis": "0.1.16", // To make Redis even faster with C written stuff
"redis-sentinel": "0.0.5", // Redis failover
"http-auth": "*", //for authentication
"openid": "0.5.5", //Open ID client
"statsd-client": "*", //NodeJS deamon for logging request s
tatistics
"facebook-node-sdk": "0.2.0",
"librato-metrics": "0.0.7",
"statsd-client": "0.0.15"
}
38. KLM
CLAIM YOUR
PLACE IN SPACE
Are you ready to win the ultimate journey
of inspiration? Claim your spot in space
Produced for DDB & Tribal Amsterdam
Case
Video
39. THE VOICE
OF HOLLAND
Talpa
This season you can be a
coach at home. Show your
coaching qualities with The
Voice of Holland Thuiscoach
app.
Case
Video
40. THANK YOU!
•
We are looking for new awesome
developers!
•
Questions: richard@mediamonks.com
Notas do Editor
Like MediaMonks on Facebook: https://www.facebook.com/mediamonksMore information about MediaMonks: http://www.mediamonks.com/
Share your participation!Facebook share moment: “I am participating in the 2nd screen presentation of @MediaMonks @FITC”Twitter share moment: “I am participating in the 2nd screen presentation of @MediaMonks @FITC”
Text: “This is Ryan Dahl”{Image of Ryan Dahl}
Text: “Yep, literally copy pasted it”
Text: “Nothing to say here”
Text:“V8 powers the Google Chrome browser”“More information on V8: https://code.google.com/p/v8/”
Text: “Download Node.js here: http://nodejs.org/”Text: “Currently around 60.000 3rd Party modules! See: https://www.npmjs.org/”
Question: “What JavaScript engine is Node.js using?”v2 rocketV8V7 v18Correct answer = b
Text:A closer look on your phone:“{ protocol: 'http:', slashes: true, auth: null, host: 'www.mediamonks.com', port: null, hostname: 'www.mediamonks.com', hash: null, search: '?who=richard&location=fitc', query: 'who=richard&location=fitc', pathname: '/', path: '/?who=richard&location=fitc',href: 'http://www.mediamonks.com/?who=richard&location=fitc' }“Note for myself:Do a repl demonstration of the following code: “require(‘url’).parse(‘http://www.mediamonks.com/?who=richard&location=fitc’)”
Image (ugly_code.jpg)
Text: “Nothing to say here”
Text: “Share moment”Facebook share: “Looking at some Node.js Code @FITC”Twitter share: “Looking at some Node.js Code @FITC”
Text:“Nothing to say here”
Text: “Bored? Answer the following question:”Script Language = JavaScriptWhat is the value of Y at the end of the following code snippet:var x = 7;var y = ‘’;if (x++ == 8) y = 'The Terminator';else y = 'Robocop';‘’The TerminatorRobocopError, syntax errorCorrect answer = c
Text: “That was freaking awesome!”Richard notes: Show them the amazing website
Image: arnold.jpg
Question: What do you think is the underlying technology of this application on your mobile?PollingStored in JavaScriptSockets (and fallbacks)Correct answer: CRichard notes: show them what happens when the dir name is changed
Question: “Which Node.js module did I use for reading the files?”httpnetfsnsCorrect answer = c
Answer the following question:What sentencewill be printed?function justWaitAMinute(cb){setTimeout(function(){cb(); }, 60000);}var text = ‘Future’;justWaitAMinute(function(){ console.log(‘What?: ‘ + text );});var text = ‘Creativity’;What?: CreativityWoot?: CreativityWhat?: FutureCorrect answer = A
Text: “Nothing to say here”Node has cluster setup
Text: “You might think, DUH! ”
@Richard: show them it blocks by using the slowserver.jsQuestion:Which of the following is not an HTTP methodPOSTGETHEADUPDATEDELETECorrect answer: D
Text: “The important thing here is that the main process is waiting for the database to return its result, while basically doing nothing resource wise. It prevents other request of being accepted”
Text: “The important thing here is that the main Node process lets the Event Loop wait for all the IO call backs. This means that the main process can continue handling request for example”
Text: For if you wanted to see the rest of ht code:if (err){ console.log('Crap, dir does not exist :-('); }if (typeof data != 'undefined'){varsortedFileNames = sorter.sortFileNames(data); }html += '<ol>';for(var index in sortedFileNames){ html += '<li>' + sortedFileNames[index] + '</li>'; }html += '</ol>';sendFileNames(res, html); });
Text: “See node.js documentation here: http://nodejs.org/api/. Make sure to use the A-Synchronous variants of the functions”
Question: What is the Big O of the following pseudo code snippet?data = [1 , 2, …, ………];data2 = [1, 2, …, …..];for(var x = 0; x < data.length; x++){ for (var y = 0; y < data2.length; y++){ //do something }}n2n3nn^3n^2Answer is e
Text: “Nesting happens a lot!”
People’s Choice of the Year: Adidas Nitro charge uses Socket.ioDesktop: http://www.nitrochargeyourgame.com/Image: nitro.jpg
Share moment:FB & Twitter share “Socket.io for the win @FITC”
Text: “Nothing to say here”
Text: For more information on Socket.io: http://socket.io/
Text ‘Nothing to say here’
Text: “This is a package.json file in which you can specify module dependancies”