Okay, so like.... you ready for this. Don't blink
1. Make an HTML5 file, it can even just be an empty file, called index.html
2. Make a package.json
, you only need these 3 lines:
{
"name": "my-first-desktop-app",
"main": "index.html",
"scripts": { "start": "nw" }
}
3. npm install --save-dev --save-exact nw@sdk && npm start
That's it. You just made a desktop app. 🎉 🎊 ✨
Seriously, that was it. 2 files, 3 lines of code, and like 1-ish? maybe that's two commands? I don't know, it's freaking easy though.
Time yourself, see if you can do it in under 60 seconds. Post your times below. Always speedrun your hello worlds.
Oh, and you can also just do any Node stuff from the DOM directly. And the nw
api is pretty easy-peasy.
<!DOCTYPE html>
<html>
<head>
<title>My first desktop app</title>
</head>
<body>
<script>
const fs = require('fs');
console.log(fs.readdirSync('.'));
nw.Window.get().showDevTools();
</script>
</body>
</html>
The Node and Chromium version it comes with is always the latest. Gets updated within 24 hours of a new release of either. So, you probably don't need Babel.
"But the filesize is gigantic?"
I gotchu homie
Any other downsides I should know about?
Why you gotta be so negative, can't you just be happy for me
- XPDA: Cross-Platform Desktop Apps - Pros/Cons of XPDA tools
For a more in-depth and beginner friendly tutorial on NW.js:
Top comments (2)
How can I create a shortcut to run the app without command line each time? I tried to run the nw.exe file but that doesn't load the actual program just the NW splash screen.
You can create a windows desktop shortcut that points to the
nw.exe
file followed by a space, and then in quotes the path to the folder that contains yourpackage.json
file.C:\nw\0.60.0\nw.exe "C:\projects\cool-project"
You can also right-click the shortcut after creation, go to properties and change the icon to your own
.ico
file, and rename the shortcut to whatever you want. You can even point to thenw.exe
in the node_modules of your project if you want.C:\projects\cool-project\node_modules\nw\nwjs\nw.exe "C:\projects\cool-project"