What is NW.js?
Join the DZone community and get the full member experience.Join For Free
You’ll also notice a package.json file as well. This is the manifest file used by Node.js to load applications and libraries, and NW.js uses it to store configuration information about the desktop application. It is required by NW.js for the application to load.
The NW.js application is able to load an application with a given path of the folder where the files live. It looks for the package.json file, which points to the index.html file to load, and thus loads the web page into what looks like a web browser embedded inside of an application window. This is what you can expect to see:
In web applications, the back-end code is running from a server, and the page that is delivered to the browser on the user’s computer is limited as to what it can do on a user’s computer, due to the browser’s content security policy. With an NW.js desktop app, because the user has explicitly executed the application and it is running in a local context, then the content security does not apply. Also, the application has access to both the page as well as the computer’s resources, through an API to interact with the Operating System, allowing the code to interact not only with the front-end part of the application, but also the back-end part of the application (the computer in this case as no external server serves the desktop app). In the next section we’ll explore how this works in a bit more detail.
Interacting with the Operating System
Control the size and behavior of the application’s window
Display a native toolbar on the application window, with menu items
Add context menus in the application window area on right-click
Add a tray application item in the Operating System’s tray menu
Access the Operating System clipboard; read the contents and even set the contents as well
Open file, folders and URLs on the computer using their default applications
Insert notifications via the Operating System’s notification system.
As you can see from the list, there are a lot of things that you can do within NW.js that web browsers cannot do. For example, web browsers do not have direct access to files on the desktop or the contents of the clipboard, due to security restrictions that web browsers implement to protect users from sites with malicious intent. In the case of NW.js, because the application runs on the user’s computer, it is granted a level of access where the user trusts the application, and therefore it can do a lot more things[p1] .These features allow the developer to create desktop applications that fit well into how the user’s Operating System works, and don’t stick out like a sore thumb to the user.You can think of NW.js as being like an application with an embedded web browser, that allows the contents of the site to also have access to the computer. Below is a diagram illustrating this:
Using Node.js with the application
Building the application for multiple OSes
One of the most useful features of NW.js is that you can build native executable applications for Windows, Mac OS X, and Linux using a single codebase for your desktop application. This is a time saver when trying to develop an application that has to work across multiple platforms. This also means that you can have greater control over how the application looks and feels, more so than you can when trying to support a website for multiple web browsers.
The native executable is able to run on its own, and does not require the user to have any other software installed on his or her computer. This makes it easy to distribute the application to users, including on App Stores where some NW.js apps are sold.
The process of building an application for a specific operating system involves a few command line arguments, but there are some tools that simplify the process for you, such as the node-webkit-buildertool, illustrated in the example below:
Using the hello worldexample app shown in Fig 1, we’re able to use nodewebkit-builder’s nwbuild command to automate the steps of building the application for both Mac OS X and Windows. This can save a lot of time (especially if you’re having to make both 32-bit and 64-bit builds of the application), and prevent mistakes from being made when building the application.
There is also the ability to build the application so that the source code is compiled. This protects the source code so that other developers can’t inspect the code and reverse-engineer it. If you have an application and you’re concerned that other developers might try to copy it, then this option offers the ability to protect your application.
With features like this, NW.js is a sophisticated tool for creating desktop applications, and knowing how it works under the hood helps you to understand what kind of applications you can build with it.
Opinions expressed by DZone contributors are their own.