JavaScript beyond the browser

Slides in Portuguese: https://speakerdeck.com/henvic/javascript-alem-do-navegador

Transcript

1. JavaScript beyond the browser Henrique Vicente http://henvic.github.io/
2. JavaScript • Created by Brendan Eich • First public appearance on the betas of Netscape Navigator 2.0
3. ECMAScript • “JS standardization / formalization” • ECMA-262, ISO/IEC 16262 • Gave origin to [other] new implementations such as ActionScript, QML, QtScript, …
4. Why JS on the browser? • How else would you offer a better experience for applications such as web mail? • More portable • Everywhere • Fast (and getting faster) • Simplicity
5. Alternatives on the browser • Less performance • No broad support • Not as simple • ???
6. And why JavaScript beyond the browser? 1. Code re-use / avoid duplicity 2. Using your JS know-how to attack even more problems 3. JavaScript is ubiquitous and everybody uses it 4. Why not?
7. Web application with JS both on the client-side as well as on the server-side • Share data validations code:
 
 Less inconsistencies
 
 Just-in-time feedback to the end-user
 
 Still have safe verification on the server-side * * Thou shalt never trust the user https://www.owasp.org/index.php/Don't_trust_user_input
8. JS runtimes • Google V8 (Chrome) • SpiderMonkey (Firefox) • WebKit (Safari) • Trident (IE) • Rhino • Wakanda • …
9. JS beyond the browser • Web apps for Chrome, Firefox * • Apache Cordova / PhoneGap • PhantomJS • SlimerJS • CasperJS • MongoDB (the map / reduce functions) • Node.js * as extensions / app, instead of common web sites
10. Web apps for Chrome, Firefox • On the browser • But with access to APIs restricted to regular web pages • Apps installed as extensions, not just regular web pages
11. • Mobile framework for developing using a web stack (HTML, JS, CSS) • Lets you develop a single system for different mobile platforms (i.e., Android, iOS, Windows Phone…)
13. • JavaScript programmable web stacks • PhantomJS: headless, WebKit-based • SlimerJS: Gecko-based • Use cases:
 web crawler, functional tests, monitoring, bots
14. Examples • Scripts from my“Tests and automation with PhantomJS and CasperJS” talk
 
 https://speakerdeck.com/henvic/tests-and- automation-with-phantomjs-and-casperjS
 
 https://github.com/henvic/phantom-casper- simple-talk
16. Example: very simple functional tests with Wordpress e CasperJS https://github.com/henvic/phantom-casper-simple-talk/blob/master/wordpress.js
18. Node.js • Great community, growing fast • Excellent for CLI tools, prototyping, and… • Taking some room from Apache + PHP, Python, Ruby, etc, as a serious web application stack • non-blocking I/O, single-threaded event loop
 this can make your brain blow if you’re not used to concurrency… (event-driven programming)
19. npm ~ Node’s apt-get
20. npmjs.org • Anyone can publish a npm package by just preparing it and invoking “npm publish” • Many great package available • Be aware of what code you run due to security
21. npm ~ Node’s apt-get • npm_modules - npm modules directory • There are local and global modules • Each module has its own dependencies (other modules) installed inside their own npm_modules
22. Adding a module to your program • var expressValidator = require(‘express-validator’);
 // Includes the express-validator module, available on npm
 
 Install it locally with
 npm install express-validator
 
 You shall install it locally.
23. What should be installed globally? • Tools like Cordova, grunt-cli, bower, services… • npm install -g <package> or
 npm install <package> -g
24. Real world example: Creating a chat prototype for a corporate social network I used socket.io for this, but would try Faye with its Bayeux protocol if I knew it by the time I built it.
25. Chat final implementation running on production, also with Node.js & Socket.IO
26. Serving static files 1. Node.JS doesn’t provide an official way to do this. 2. Install a module that does so, like node-static
 > npm install node-static
 
 then, write a simple program to do the job:
27. Compute n! with Node.JS
28. package.json • To publish a Node package you need to write this document • Even if you don’t intend to publish a npm package, create a package.json document to take advantage of a series of things like dependency management, etc
29. package.json
30. Some fantastic tools built with Node.js
31. Slides available on https://speakerdeck.com/henvic/javascript-beyond-the- browser