Node webkit

A small presentation about node-webkit. Created for Lunch and Learn [at] Woboinc.

Transcript

1. Node-webkit It is an app runtime that allows developers to use Web technologies (i.e. HTML5, CSS and JavaScript) to develop native apps
2. Yes, Your simple Front-End App, running on the Desktop.
4. What? Apps are written in: 1. HTML 2. CSS 3. Javascript 4. Node.js Modules You can also use: 1. Coffee/Type/Clojure 2. Angular/Ember/React 3. HTML/JADE/SLIM 4. NPM Modules 5. Bower 6. ...
5. History / How is it possible? Creator: github.com/rogerwang/
6. Features • Apps written in modern HTML5, CSS3, JS and WebGL. • Complete support for Node.js APIs and third party modules (npm). • Good performance: Node and WebKit run in the same thread: Function calls are straight-forward; objects are in the same heap and can just reference each other. • Easy to package and distribute apps. • Available on Linux, Mac OS X and Windows.
8. Pros Cons • HTML+CSS+JS (pwned!) • Node Modules (IO Access) • One code base • Multiple OS (Win, Linux, Mac) • Easy to build games, presentations, real-time apps • Access to GPU (Games!) • GUI tools (tray, context menu) • Offline storage • HUGE App size (>= 60mb) • HTML5 API Limitations* • App Crash • Different implementations of HTML5 API’s on different layers. (Browser vs Content Layer)
9. Must know / Mixes! Mixed Message loop • Node (event-driven based on libuv) • Webkit (event-driven MessagePump of Chrome) • Result: Single message loop. Custom MessagePump built on top of libuv Mixed context access of each other • During initialization, node-webkit injects the Node context inside of Webkit context. • Result: Contexts together Security Model Changes / Frames • Two kinds of frames (Node frames and Web frames) • Web frames: Cross-domain AJAX problems (same-origin policy) • Node frames: No restriction. Security token is shared on all Node frames. • Result: Cross-domain access is allowed and objects in the Node's context are accessible too
11. Shut up and code! 1. HTML main file 2. package.json
12. Live coding time!
13. Apps Using / Cowdown App
14. Apps Using / Brandon Must Die
15. Apps Using / Light table
16. Apps Using / Popcorn time
17. How we can use for Wobo Inc - Deploy Apps (Business People) - Our own Hipchat / Customer Support Apps - Kiosk Apps integrated with our APIs (HPB/SKYO)
18. Last but not least
19. Links • https://github.com/rogerwang/node-webkit • http://www.slideshare.net/paulbjensen/desktop-apps-with-node-webkit • https://github.com/djalmaaraujo/cowdown (Rocks!) • http://yedingding.com/2014/08/01/node-webkit-intro-en.html • https://groups.google.com/forum/#!forum/node-webkit • www.brandonmustdie.com • www.lighttable.com • www.popcorntime.io • https://github.com/rogerwang/node-webkit/wiki/List-of-apps-and- companies-using-node-webkit • https://github.com/djalmaaraujo/github-info-node-webkit-example