nodejs, coffeescript & real-time web
TRANSCRIPT
![Page 1: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/1.jpg)
Node.js, CoffeeScript & Real-Time Web
Jakub Nesetril
[email protected]@jakubnesetril
čtvrtek, 30. června 2011
![Page 2: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/2.jpg)
About Me
web developer for 15 years
director of frontend engineering, GoodData
CEO/founder of apiary.io - hosted REST API tools
čtvrtek, 30. června 2011
![Page 3: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/3.jpg)
Contents
not a deep-dive
aims to explain a bit of the frenzy
really more about Javascript
čtvrtek, 30. června 2011
![Page 4: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/4.jpg)
čtvrtek, 30. června 2011
![Page 5: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/5.jpg)
What is Node.js
• it’s NOT a framework: but several Rails/Sinatra-style frameworks are available for it
• it’s not a programming language: uses Javascript
• it’s not a VM: uses Chrome’s v8 engine)
čtvrtek, 30. června 2011
![Page 6: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/6.jpg)
What is Node.js
• clever glue code between C and Javascript, with standard libraries
• exposes low-level POSIX to JS
• advanced TCP/HTTP support
• strongly event-oriented(reactor pattern)
• fast
čtvrtek, 30. června 2011
![Page 7: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/7.jpg)
#3 on Github
more traffic then jQuery
Popular
čtvrtek, 30. června 2011
![Page 8: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/8.jpg)
Getting Started—installing Node
Node changes quickly, use nvm or n to install:
https://github.com/creationix/nvmhttps://github.com/visionmedia/n
Allows to quickly migrate between version:
$ nvm ls … stable: v0.4.8-rc latest: v0.4.8-rc current: v0.4.6$ nvm install 0.4.8-rc»»» downloads, builds, installs and sym-links new node
čtvrtek, 30. června 2011
![Page 9: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/9.jpg)
Getting Started—installing libraries
NPM - Node Package Manager
$ curl http://npmjs.org/install.sh | sh…$ npm install foo
Debugging:
$ npm install -g node-inspector$ npm install v8-profiler
interactive debugger, breakpoints, inspection of stack variables,memory snapshosts, cpu profiling…
čtvrtek, 30. června 2011
![Page 10: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/10.jpg)
Getting Started—working
Node loads code at startup
Restart required when code changes (unlike PHP, similar to Ruby)
$ npm install -g supervisor
Supervisor watches/restarts your app when changed:
$ supervisor --watch . server.js … DEBUG: crashing child DEBUG: Starting child process with 'node server.js' …
čtvrtek, 30. června 2011
![Page 11: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/11.jpg)
Demo
čtvrtek, 30. června 2011
![Page 12: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/12.jpg)
Javascript
čtvrtek, 30. června 2011
![Page 13: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/13.jpg)
Javascript
čtvrtek, 30. června 2011
![Page 14: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/14.jpg)
“The World's Most MisunderstoodProgramming Language”
Douglas Crockford, the Yoda of Javascript
čtvrtek, 30. června 2011
![Page 15: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/15.jpg)
čtvrtek, 30. června 2011
![Page 16: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/16.jpg)
Javascript as a Compilation Target
GWT (Google), ObjectiveJ (Cappuccino/280North), everything else…
Different idioms then Javascript
Obscure integration with other Javascript
Unreadable output:
function g(){var a=G(db);if(a!=null){return a}return Q}function i(){var a;if(typeof isBodyLoaded==gb||!isBodyLoaded()){var b=hb;var c;n.write(ib+b+jb);c=n.getElementById(b);a=c&&c.previousSibling;while(a&&a.tagName!=kb){a=a.previousSibling}if(c){c.parentNode.removeChild(c)}if(a&&a.src){return e(a.src)}}return Q}
čtvrtek, 30. června 2011
![Page 17: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/17.jpg)
čtvrtek, 30. června 2011
![Page 18: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/18.jpg)
Compiles to clean Javascript
čtvrtek, 30. června 2011
![Page 19: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/19.jpg)
CoffeeScript
Exposes only The Good Parts™ of Javascript
Syntactic sugar = Less noise, more readable output
Somewhere between Python and Ruby:
• whitespace/indentation defines blocks• classes! inheritance!• default arguments, splats… (catch-all argument)• list comprehensions• destructuring assignments (pattern matching)• auto local-scoped variables (no more manual var)• optional binding of this scope• and many more…
čtvrtek, 30. června 2011
![Page 20: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/20.jpg)
Popular
63% 12%
25%
CoffeeScript plan CoffeeScript JavaScript
Hacker News Poll, June 22ndhttp://news.ycombinator.com/item?id=2683372
čtvrtek, 30. června 2011
![Page 21: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/21.jpg)
Getting Started—installing
$ npm install -g coffee-script
$ coffee server.coffee
$ coffee --compile server.coffee»» produces server.js
$ coffeecoffee>
čtvrtek, 30. června 2011
![Page 22: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/22.jpg)
Common Problems
you’ll end up debugging in Javascript, know how stuff compiles!
isnt is not is not
console.log(1 isnt false)console.log(1 is not false)
in vs of
console.log(x) for x in {a: “a”, b: “b”}console.log(x) for x of {a: “a”, b: “b”}
tricky local vs. global variable scope
čtvrtek, 30. června 2011
![Page 23: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/23.jpg)
Real-Time Web
čtvrtek, 30. června 2011
![Page 24: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/24.jpg)
Traditional Model
Request/Response
The way HTTP was designed
Dramatic benefits for scaling and simplicity
čtvrtek, 30. června 2011
![Page 25: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/25.jpg)
Real-Time Web
Needs bi-directional communication (polling too slow)
WebSocket standard in process, varying support in new browsers
Older browsers can use flash fallback or “long-polling” mechanisms
Requires support from ground-up across the whole backend stack (proxies, web servers, application servers)
čtvrtek, 30. června 2011
![Page 26: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/26.jpg)
Solutions
• Pusher (WebSocket IaaS)
similar to Apple iOS push notification service
keep your existing code/infrastructure
send HTTP POST request to Pusher to push messages
• socket.io
$ npm install socket.io
implements websocket server AND client
transparently supports all fallback mechanisms (many!)
supports IE5.5+, WebKit on iOS/Android/WebOS
čtvrtek, 30. června 2011
![Page 27: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/27.jpg)
Demos
čtvrtek, 30. června 2011
![Page 28: NodeJS, CoffeeScript & Real-time Web](https://reader034.vdocuments.site/reader034/viewer/2022042614/555c252bd8b42a0b418b4c3d/html5/thumbnails/28.jpg)
Questions?
čtvrtek, 30. června 2011