Node.js is an event-driven, non-blocking server-side JavaScript runtime built on Chrome's V8 engine. It allows highly scalable network applications to be built by wrapping non-blocking libraries. Node.js uses an event loop that listens for events like connections, requests, data, and closures and queues callbacks for handling them asynchronously without blocking the main thread. This document provides an overview of Node.js and some of its core modules like Express for building web servers and Socket.io for real-time communication. It also includes examples of using Node.js and these modules to build a collaborative drawing application.

1. Node.js
“This is the node.js project: to provide a purely
evented non-blocking infrastructure to script highly
concurrent programs.” - Ryan Dahl
by Shelly Seroussi & Hannah Kim

2. Node.js is...
● Builds fast, scalable network applications.
● Wrapper to Google’s V8 Javascript runtime.
● Event driven with nonblocking libraries.

3. contents = File.read(‘/etc/hosts’)
puts “#{contents}”
puts ‘Hello Flatiron’
fs.readFile(‘/etc/hosts’, function(err, contents){
console.log(contents);
});
console.log(‘Hello Flatiron’);
Blocking Code - Ruby
Non-Blocking Code - Node.js
Blocking Code
Non-Blocking Code

4. Listening
For Events
Known EventsEvent Queue
close
connection
request
connection
close
The Event Loop

5. Express
● Middleware Using Connect
● URLs Routing as Callbacks
● Redirection Helpers
● File Uploads
● Environment Based Configuration

6. Socket.io
● Real-time Event-based Communication
● Abstracts Websockets
● Browser Compatibility

7. Server.js
var express = require('express');
var socket = require('socket.io');
var app = express();
// LISTEN FOR REQUESTS
var server = app.listen(3000);
var io = socket.listen(server);
-----
// ROUTES
app.get('/', function(req, res){
res.render('index', {
title: 'title'
});
});

8. // Initialize Socket.io
var socket = io.connect('/');
socket.on('user:connect', function(user_count) {
update_user_count( user_count );
});
socket.on('user:disconnect', function(user_count) {
update_user_count( user_count );
});
var active_users = 0;
io.sockets.on('connection', function (socket) {
active_users++
io.sockets.emit('user:connect', active_users);
socket.on('disconnect', function () {
active_users--
io.sockets.emit('user:disconnect', active_users);
});
server.js
index.html

9. // EVENT: User is drawing something
socket.on('draw:progress', function( user, data ) {
progress_external_path( JSON.parse( data ), user );
}
});
// EVENT: User stops drawing something
socket.on('draw:end', function( user, data ) {
end_external_path( JSON.parse( data ), user );
});
// EVENT: User is drawing something
socket.on('draw:progress', function (uid, coordinates) {
io.sockets.emit('draw:progress', uid, coordinates)
});
// EVENT: User stops drawing something
socket.on('draw:end', function (uid, coordinates) {
io.sockets.emit('draw:end', uid, coordinates)
});
index.html
server.js

10. Node is great for
● Websocket Servers
● Fast File Upload Clients
● Ad Servers
● Real-Time Data Apps

11. Contact Us
Shelly Seroussi
shelly.seroussi@flatironschool.com
Hannah Kim
hannah.kim@flatironschool.com

12. Socket.io

13. var http = require(‘http’);
http.createServer(function(request, response) {
response.writeHead(200);
response.write(‘Hello, Flatiron School!’);
response.end();
}).listen(3000);
console.log(‘Listening on port 3000’);
Hello Flatiron!

14. package.json
---
"scripts": {
"start": "app.js"
},
"version": "0.0.0-14",
"engines": {
"node": "0.6.x"
},
"dependencies": {
"express": "^3.5.3",
"jade": "*",
"socket.io": "*"
}
}
{
"name": "drawstuff",
"subdomain": "drawstuff",
"scripts": {
"start": "server.js"
},
"version": "0.0.0-14",
"engines": {
"node": "0.6.x"
},
"dependencies": {
"express": "^3.5.3",
"jade": "*",
"socket.io": "*"
}
}

15. function onMouseDown(event) {
var point = event.point;
path = new Path();
path.fillColor = active_color_rgb;
path.add(event.point);
// The data we will send every 100ms on mouse drag
path_to_send = {
rgba : active_color_json,
start : event.point,
path : []
};
}
index.html

16. Paper.js
● Vector Graphic Library Framework
● Runs on Top of HTML5 Canvas

17. www.awesome.com

18. << NPM >>
Node Package Management