Node.js: The What, The How and The When
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Node.js: The What, The How and The When

on

  • 2,741 views

Presented live at FITC Amsterdam 2014 on Feb 24-25, 2014

Presented live at FITC Amsterdam 2014 on Feb 24-25, 2014
More details can be found at www.FITC.ca

Node.js: The What, The How and The When
with Richard Nieuwenhuis

Statistics

Views

Total Views
2,741
Views on SlideShare
2,739
Embed Views
2

Actions

Likes
1
Downloads
10
Comments
0

1 Embed 2

http://www.slideee.com 2

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • 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 += '';for(var index in sortedFileNames){ html += '' + sortedFileNames[index] + ''; }html += '';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”

Node.js: The What, The How and The When Presentation Transcript

  • 1. Node.js Awesome, Lightweight, JavaScript, High Performance qr.net/fitc2014
  • 2. WHO AM I? • Richard Nieuwenhuis • 32 years old • MediaMonks • 7 years a Monk • Lead of Operations / Head of development
  • 3. 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
  • 4. 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
  • 5. 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.”
  • 6. In short how many people see it • Server side JavaScript!
  • 7. High Level Component overview Node.js V8 Event Loop (Libuv)
  • 8. 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)
  • 9. 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
  • 10. Some Node.js APIs/Modules continued • querystring • • For parsing the query string of a request url • • functions for parsing and resolving URL‟s repl: Read-Eval-Print-Loop • Good for debugging and testing
  • 11. 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 :-)
  • 12. 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
  • 13. Requiring needed modules //require the needed modules var http = require('http'); var fs = require('fs'); var sorter = require('./sorterservice');
  • 14. 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"); }
  • 15. 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); }
  • 16. One last thing & Does it work? function sendFileNames(res, html){ res.setHeader('Content-Type', 'text/html'); res.end(html); }
  • 17. Two big things not OK here Which are also two important Node aspects 1) Error handling 2) A-synchronous architecture
  • 18. 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); }
  • 19. 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
  • 20. 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)
  • 21. “Problemo” numero dos fs.readdirSync(dirName); Node is a single threaded running process.
  • 22. 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
  • 23. Synchronous development http.createServer(function(req, res){ switch(req.method){ case 'POST': console.log('This is a post request'); break; case 'GET': //”Select *” all 200K users from the database //Give it back to the response } }).listen(8888);
  • 24. 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
  • 25. 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
  • 26. 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){……
  • 27. 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
  • 28. 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
  • 29. 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() { }); }); }); }); });
  • 30. 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!
  • 31. 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
  • 32. 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]); }
  • 33. 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); });
  • 34. Event Listener socket.on('message', function (message)…… socket.emit(„fired‟, {message: yep, you are fired});
  • 35. 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" }
  • 36. ADIDAS NITROCHARGE An interactive cinematic experience using your mobile phone as a controller. 
Produced for DDB & Tribal Case Video
  • 37. 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
  • 38. 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
  • 39. THANK YOU! • We are looking for new awesome developers! • Questions: richard@mediamonks.com