Building native desktop applications with node-webkit
Report
Marco PracucciFollow
May. 14, 2014•0 likes•3,530 views
3 likes
Be the first to like this
Show More
views
Total views
0
On Slideshare
0
From embeds
0
Number of embeds
0
Check these out next
Building native desktop applications with node-webkit
May. 14, 2014•0 likes•3,530 views
3 likes
Be the first to like this
Show More
views
Total views
0
On Slideshare
0
From embeds
0
Number of embeds
0
Download to read offline
Report
Software
We build web apps that runs on browser and server-side apps on Node.JS, but what’s about native Desktop applications? In this talk I will introduce node-webkit: an app runtime based on Chromium + Node.JS, you can use to build Desktop apps with JS and HTML, with no browser’s limitations like file-system calls or running native code.
Marco PracucciFollow
Recommended
Composer and deployer for enterpriseElena Pustovoit
Docker, Ansible and Symfony micro-kernelDrupalCamp Kyiv
Workshop - Golang languageVincent Composieux
OSCONF - April 2021 - Run GitHub Actions Locally with nektos/act and DockerGaurav Gahlot
Portable class library to .NET Standard ExtensionTakeshi Fujimoto
JLPDevs - Optimization Tooling for Modern Web App DevelopmentJLP Community
Building native desktop applications with node-webkit
- OUT OF THE SANDBOX Building native Desktop apps by Marco Pracucci - CTO @spreaker at JsDay on May 14, 2014 mercoledì 14 maggio 14
- @pracucci WHY DESKTOP ? mercoledì 14 maggio 14
- @pracucci Hackable text editor by GitHub Atom.io mercoledì 14 maggio 14
- @pracucci Spreaker Studio Mix audio sources and broadcast live by Spreaker mercoledì 14 maggio 14
- @pracucci WHY DESKTOP ? HOW mercoledì 14 maggio 14
- @pracucci NODE-WEBKIT app runtime based upon https://github.com/rogerwang/node-webkit + mercoledì 14 maggio 14
- @pracucci NODE-WEBKIT runs on developed by Roger Wang at Intel mercoledì 14 maggio 14
- @pracucci package.json { “name”: “Demo”, “main”: “index.html”, “window”: { “width”: 600, “height”: 400 } } index.html <html> <body> <h1>My App</h1> </body> </html> GETTING STARTED mercoledì 14 maggio 14
- @pracucci <script> var fs = require(“fs”); var _ = require(“underscore”); var _ = require(“lame”); </script> Node modules (built-in) 3rd party modules in JavaScript 3rd party modules in C/C++ GETTING STARTED npm install ... mercoledì 14 maggio 14
- @pracucci FRONT OR BACK ? Should I use Angular or Express? mercoledì 14 maggio 14
- @pracucci Think of it as a frontend app that can “just” use node modules “ ” mercoledì 14 maggio 14
- @pracucci Single Page Apps app://whatever/path DESIGN Multiple Page Apps Ease repackage of your website to a node-webkit app { “main”: “index.html”, } { “main”: “app://foo/index.html”, } mercoledì 14 maggio 14
- @pracucci Generally speaking, you can easily port your web app to node-webkit “ ” mercoledì 14 maggio 14
- @pracucci few builtin codecs, but you can rebuild libffmpeg to add any format / codec MULTIMEDIA <audio> <video> <canvas> getUserMedia() WebRTC WebGL ... mercoledì 14 maggio 14
- @pracucci • returns the real path on filesystem • can open file dialog programmatically <input type='file' /> FILE DIALOGS mercoledì 14 maggio 14
- @pracucci Select a directory instead of a file FILE DIALOGS <input type='file' nwdirectory /> mercoledì 14 maggio 14
- @pracucci Select a (non) existing file FILE DIALOGS <input type='file' nwsaveas /> mercoledì 14 maggio 14
- @pracucci NATIVE UI MODULE var gui = require('nw.gui'); Built-in module to control the Native UI: mercoledì 14 maggio 14
- @pracucci My App File Edit 5:45 pm My App mercoledì 14 maggio 14
- @pracucci My App File Edit 5:45 pm My App gui.Window mercoledì 14 maggio 14
- @pracucci My App File Edit 5:45 pm My App gui.Menu gui.Window mercoledì 14 maggio 14
- @pracucci My App File Edit 5:45 pm My App gui.Menu gui.Tray gui.Window mercoledì 14 maggio 14
- @pracucci My App File Edit 5:45 pm My App gui.Menu gui.Tray gui.Window gui.Clipboard mercoledì 14 maggio 14
- @pracucci My App File Edit 5:45 pm My App gui.Menu gui.Tray gui.Window gui.Clipboard gui.Shell mercoledì 14 maggio 14
- @pracucci Source code will be exposed. Use nwsnapshot to compile to native code. (experimental) zip -r app.nw * 1. Make a package nw app.nw 2. Ship node-webit + app package PACKAGING mercoledì 14 maggio 14
- @pracucci Hard to contribute CONTRIBUTING You both need to know Chromium and Node.JS internals (and have a strong experience with C++) mercoledì 14 maggio 14
- @pracucci with node-webkit you can easily build native desktop apps (and have a lot of fun !) SUMMARY mercoledì 14 maggio 14
- Thank you! https://joind.in/11272 Any feedback is welcome! mercoledì 14 maggio 14