Make Nearly Any Website an “App” with Nativefier
Ever wish you could just have that web app start at system startup? Running Linux where there’s no native desktop app but there is a web one? Now you too can wrap your own web thing of choice in a desktop app.
Nativefier is an easy to use Node.js based application that on Linux is very easy to install and quite user-friendly if you are comfortable with the CLI. It does support use on any OS that supports Node.js including Mac and Windows. You can check out the GitHub page here https://github.com/jiahaog/Nativefier
For brevity and clarity I’ll only be covering instructions to install and use Nativefier on Linux even though it does support other operating systems. I was missing Microsoft’s OneNote and didn’t want to fiddle with Wine so I’ll use Microsoft OneNote for the web as an example. Lets get started!
I’m on Linux so presumably you’re using a package manager. For these instructions I’m using Apt on Ubuntu 18.04 but these instructions can be easily adapted to your package manager of choice.
- Press Ctrl+Alt+T to open a terminal.
- Type “sudo apt install nodejs npm”.
- Answer Y for yes to install Node.
Now it’s time to install Nativefier. This is done with Node.js’s “npm” tool so this should work the same regardless of your Linux distro or even operating system. We will continue working in the terminal.
- Type “sudo npm install nativefier -g” Hit Enter.
Build Your Web App
We’re now ready to build our web app. As noted above we’re going to build OneNote as an example. This is a good example as it features a bit of bouncing around between domain’s which can be tricky. When you wrap a domain/URL with Nativefier if the page tries to go outside of its initial domain/URL it will pop open your default browser to show this has happened and allow you to see the new domain/URL. This allows you to build a list of domains that need to stay contained in your Nativefier app. You build this list in the –internal-urls flag followed by regex of the domains involved. You’ll see this below where OneNote loops through several domains just to do the login process. Lets build it!
- Back in your terminal type:
- nativefier –name “OneNote” “https://onenote.com” –internal-urls “(office|microsoft|onenote|live)”
As you can see this is very easy and pretty straight forward. In the case of OneNote the login process is trying to use office.com, microsoft.com and live.com during the login process so they have been included in the regex. It does parse by full regex so depending on your site’s processes more complex regex may be necessary.
The above command will have built the app in to a directory it created in the root of wherever you ran the Nativefier command from. It will be named the name of your web app followed by the platform and bit identifier. In my case “one-note-linux-x64”. In that folder you will find an executable file labeled as the name of your application. You can run this with a double-click or a right-click and selecting “run”.