Devcon5, NYC 2013: How To Learn Node.js

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, and fun to use.

Join frog principal web engineer and O'Reilly technical author, Jesse Cravens, as he provides a framework for learning how to use Node.js for a number of different types of applications that include DIY IoT prototypes to real world applications by breaking the platform down into four main layers: callbacks, events, streams and modules.

Transcript

1. Learning to Node.js July 2013 Sunday, December 29, 13
2. @jdcravens github.com/jessecravens frog Sunday, December 29, 13
3. July 2013 Devcon5 NYC 2013 Intro to HTML5 3 Experience Sunday, December 29, 13
4. July 2013 Devcon5 NYC 2013 Learning to Node.js 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. - nodejs.org Node.js is an open source project designed to help you write JavaScript programs that talk to networks, file systems or other I/O (input/output, reading/writing) sources. - Max Ogden 4 What is Node.js? Sunday, December 29, 13
5. July 2013 Devcon5 NYC 2013 Learning to Node.js It is lightweight, simple, and easy to make complex reactionary systems with little effort. Best of all it is JavaScript, so you have no risk of falling madly in love with your initial prototype and will eventually rewrite in something 'more production-worthy'. Or not. - voodootikigod 5 Why Node.js? Sunday, December 29, 13
6. July 2013 Devcon5 NYC 2013 Learning to Node.js Simple, Asynchronous I/O Use your pizza delivery app and order a pizza. A ticket is created in the system and your pizza goes in the oven. Meanwhile, others order pizza and their pizzas go in the oven. But, the thickness of crust and types of toppings vary! If others had to wait at until your deep dish pie was fully baked, you’d be blocking all other orders in line from while your pizza was finished! This system is blocking I/O because all I/O (pizza baking) happens one at a time. We are talking non-blocking, which means we can cook many pizzas at once. The digital order is deferred and it sits and waits to be handled by the delivery person. 6 More Why Node.js? Sunday, December 29, 13
7. July 2013 Devcon5 NYC 2013 Learning to Node.js Easily transferable JavaScript skillset Easy to install, build/maintain modules Balance between easy to use, and easy to scale 7 More Why Node.js? Sunday, December 29, 13
8. July 2013 Devcon5 NYC 2013 Learning to Node.js Project Management, Workflow, Build Tools, etc Network Server and Streams ExpressJS Web Framework Soft, Real-Time Applications with WebSocket Micro Controllers, IoT Prototypes 8 When to use Node.js? Sunday, December 29, 13
9. July 2013 Devcon5 NYC 2013 Learning to Node.js Core Callbacks Events Streams Modules Express 9 How to learn Node.js? Sunday, December 29, 13
10. July 2013 Devcon5 NYC 2013 Intro to Node.js • Buffer • C/C++ Addons • Child Processes • Cluster • Crypto • Debugger • DNS • Domain • Events • File System 10 • STDIO • Stream • String Decoder • Timers • TLS/SSL • TTY • UDP/Datagram • URL • Utilities • VM • ZLIB • Globals • HTTP • HTTPS • Modules • Net • OS • Path • Process • Punycode • Query Strings • Readline • REPL Core Sunday, December 29, 13
11. How to learn Node.js Callbacks Sunday, December 29, 13
12. July 2013 Devcon5 NYC 2013 Learning to Node.js 12 Executing Functions w/out Callbacks var num = 1; function iterate() { num++ }; iterate(); console.log(num) // 2 Sunday, December 29, 13
13. July 2013 Devcon5 NYC 2013 Learning to Node.js var a = false; asyncFunction(function({ console.assert(a, 'a should be true'); }); a = true; 13 Executing Functions Async (Callbacks) Sunday, December 29, 13
14. July 2013 Devcon5 NYC 2013 Learning to Node.js $( document ).ready(function() { $( "a" ).click(function( event ) { console.log( "Thanks for visiting!" ); }); }); 14 Callbacks are familiar Sunday, December 29, 13
15. July 2013 Devcon5 NYC 2013 Learning to Node.js var fs = require('fs'); var num = undefined; function iterate() { fs.readFile('data.txt', function(data) { num = parseInt(data); num++; }) } iterate(); console.log(num); //undefined 15 Callbacks Sunday, December 29, 13
16. July 2013 Devcon5 NYC 2013 Learning to Node.js var fs = require('fs') var num = undefined; function iterate(callback) { fs.readFile('data.txt', function(data) { ! num = parseInt(data); ! num ++; callback(); }) } function logNum() { console.log(num); } iterate(logNum); 16 Callbacks as Arguments Sunday, December 29, 13
17. July 2013 Devcon5 NYC 2013 Learning to Node.js one(function() { two(function() { three(); }) }) function one(cb) { console.log('one is done'); cb.call(); } function two(cb) { console.log('two is done'); cb.call(); } function three() { console.log('three is done'); } 17 Callback Hell Sunday, December 29, 13
18. July 2013 Devcon5 NYC 2013 Learning to Node.js async.series([ function(callback){ // do some stuff ... callback(null, 'one'); }, function(callback){ // do some more stuff ... callback(null, 'two'); } ], // optional callback function(err, results){ // results is now equal to ['one', 'two'] }); 18 Async Sunday, December 29, 13
19. July 2013 Devcon5 NYC 2013 Learning to Node.js Q.fcall(one) .then(two) .then(three) .then(four) .then(function (value4) { // Do something with value4 }) .catch(function (error) { // Handle any error from all above steps }) .done(); 19 Q Sunday, December 29, 13
20. July 2013 Devcon5 NYC 2013 Learning to Node.js Callbacks should be familiar to UI developers. I/O from disk or over the network is slow, so these operations should be asynchronous. Functions are Objects, so they can be passed as arguments to other functions. Can use Libraries like Async or Q to manage Callback Hell. 20 Callbacks Sunday, December 29, 13
21. Async DisneyBaby.com Sunday, December 29, 13
22. Full Stack Asynchronuos I/O DisneyBaby.com Sunday, December 29, 13
23. July 2013 Devcon5 NYC 2013 Intro to Node.js 23 function init() { // Global variables dbaby.Iris.delay = 7000; // ... var loopReadyDfd = loadSlides(); $.when(loopReadyDfd).done(function() { // reposition the last slide $('#promo-' + dbaby.Iris.lastslide).css('right', -800 + "px"); // ... nextIris(dbaby.Iris.delay);! } }; Sunday, December 29, 13
24. July 2013 Devcon5 NYC 2013 Intro to Node.js 24 function loadSlides() { var dfd = $.Deferred(); // Determine slug from URL. var slug = $('#iris').data('slug'); // Request additional slides. $.ajax({ url: '/ajax/get/iris/' + slug + '/' }).done( function(data) { // fetch new promo HTML from response // .. // fetch src of all new images we're trying to load src = $.map( $promos.find('img'), function( img ) { return img.src; }); // preload all new images $.when(dbaby.preloadImg( src ) ).then( function() { // ... set up a bunch of listeners // resolve deferred object dfd.resolve(); } ); }); return dfd; } Sunday, December 29, 13
25. July 2013 Devcon5 NYC 2013 Intro to Node.js 25 function nextIris(delay) { if (tickerOn) { if (irisOn && slideNow == dbaby.Iris.totalSlides) { var x1 = 0; var $pxWrap = $('#iris-wrapper'); if ( Modernizr.csstransforms && $.browser.webkit ) { // for CSS transitions $pxWrap.css(TRANSITION, '0s cubic-bezier(.333, 0, 0, 1)'); $pxWrap.css(TRANSFORM, 'translateX('+x1+'px)'); } else { // for Animated transitions $pxWrap.css('margin-right', x1 + 'px'); }; $.when(nextSetReadyDfd,animReadyDfd).done(function(obj) { .when(transitionMomentSet( obj.$momentSet, obj.pixieDustType) ).done(function(){ nextIris(delay); }); }); } } } Sunday, December 29, 13
26. How to learn Node.js Events Sunday, December 29, 13
27. July 2013 Devcon5 NYC 2013 Learning to Node.js var utils = require('utils'), EventEmitter = require('events').EventEmitter; var Engine = function() { console.log('init'); }; utils.inherits(Engine, EventEmitter); var e = new Engine(); e.on('start', function() { console.log('start'); }); if (somecriteria) { e.emit('start'); } 27 Events Sunday, December 29, 13
28. simple CLI Event Emitter Sunday, December 29, 13
29. How to learn Node.js Streams Sunday, December 29, 13
30. July 2013 Devcon5 NYC 2013 Learning to Node.js var http = require('http'); var fs = require('fs'); var server = http.createServer(function (req, res){ fs.readFile(__dirname + '/data.txt', function (err, data){ res.end(data); }); }); server.listen(8000); //buffers up the entire data.txt file into memory for every request before writing the result back to clients. 30 Why Streams? Sunday, December 29, 13
31. July 2013 Devcon5 NYC 2013 Learning to Node.js var http = require('http'); var fs = require('fs'); var server = http.createServer(function (req, res) { var stream = fs.createReadStream(__dirname + '/data.txt'); stream.pipe(res); }); server.listen(8000); //data.txt file will be written to clients one chunk at a time as received from the disk. //emits ‘data’ events per chunk of data and then emits ‘end’ event when they are all finished. 31 Why Streams? Sunday, December 29, 13
32. July 2013 Devcon5 NYC 2013 Learning to Node.js Readable Writable Transform Duplex Passthrough 32 Types of Streams Sunday, December 29, 13
33. simple in/out over HTTP Readable and Writeable Streams Sunday, December 29, 13
34. July 2013 Devcon5 NYC 2013 Learning to Node.js stream-adventure by substack Streams 2 practical examples http://blog.strongloop.com/practical-examples-of-the-new-node-js- streams-api/ 34 More on Streams Sunday, December 29, 13
35. How to learn Node.js Modules Sunday, December 29, 13
36. July 2013 Devcon5 NYC 2013 Learning to Node.js 36 Modules Sunday, December 29, 13
37. July 2013 Devcon5 NYC 2013 Learning to Node.js 37 Modules Sunday, December 29, 13
38. July 2013 Devcon5 NYC 2013 Learning to Node.js What is NPM? Online repository for the publishing of open-source Node.js projects Command-line utility for interacting with module repos for package installation, version management, and dependency management. $ npm search arduino 38 Modules Sunday, December 29, 13
39. July 2013 Devcon5 NYC 2013 Learning to Node.js Use require() ! var http = require ('http'); ! var spawn = require('child_process').spawn; ! var mod = require('some_module').do(); Create package.json : ! { "id": "test_module", "version": "1.0.0", "dependencies": { "async": "latest" } ! } 39 Modules - Creating a Simple Module Sunday, December 29, 13
40. July 2013 Devcon5 NYC 2013 Learning to Node.js $ git init $ npm init $ touch index.js - module.exports = 1 $ node -pe "require('./example')" $ npm publish <folder> 40 Modules - Quick Start Sunday, December 29, 13
41. ResponderJS Adaptive Middleware Node.js module Sunday, December 29, 13
42. More Real World Use Sunday, December 29, 13
43. July 2013 Devcon5 NYC 2013 Learning to Node.js Project Management, Workflow, Build Tools, etc Network Server and Streams ExpressJS Web Framework Soft, Real-Time Applications with WebSocket Micro Controllers, IoT Prototypes 43 When to use Node.js? Sunday, December 29, 13
44. Express Web Framework Chapter 10 ‘HTML5 Hacks’ Sunday, December 29, 13
45. ws Module Chapter 9, Hack #71 Sunday, December 29, 13
46. Nerdclustr Real Time, Geo Location Sunday, December 29, 13
47. Application Tracker Grunt, Bower, Yeoman Sunday, December 29, 13
48. Trailr.io Node.js MicroController Framework Sunday, December 29, 13
49. July 2013 Devcon5 NYC 2013 Learning to Node.js 49 trailr.io http://www.youtube.com/watch?v=H00_BGRkBRM&t=14m14s Sunday, December 29, 13
50. July 2013 Devcon5 NYC 2013 Learning to Node.js 50 NodeCopter http://www.youtube.com/watch?v=gucpgJEJ5b4 Sunday, December 29, 13
51. July 2013 Devcon5 NYC 2013 Learning to Node.js 51 Johnny Five http://www.youtube.com/watch?v=jf-cEB3U2UQ Sunday, December 29, 13
52. © 2012 frog. All rights reserved. Sunday, December 29, 13