Nativefier, convert websites to desktop applications in Ubuntu 18.10

about nativefier

In the next article we are going to take a look at Nativefier. We already talked about this tool in this same blog some time ago. In this post we are going to see how we can install and use it in Ubuntu 18.10 to convert a web page into a native application.

There are many reasons for wanting a native application for a website. They generally work quite well, plus they have some features that people expect from a desktop app. Usually, fit well on desks Gnu / Linux thanks to its configuration when creating them.

Install Nativefier on Ubuntu 18.10

Nativefier is a NodeJS application running on Gnu / Linux and other operating systems that can run Node. This program does not arrive installed by default in any major distribution. For this reason, we will have to see how to configure NativeFier, before it is possible to start converting websites into desktop applications for Gnu / Linux.

Install NPM

Nativefier relies heavily on the NodeJS programming language. For this reason, we will install this package manager, called NPM, with which should be enough.

For install NPM on our Ubuntu 18.10, we will only have to open a terminal (Ctrl + Alt + T) and write in it:

sudo apt install npm

Install Nativefier

When the NodeJS package manager is up and running on our machine, we must use it to install Nativefier. We will do this by opening a terminal (Ctrl + Alt + T) and using the npm command As follows:

install nativefier npm ubuntu 18.10

sudo npm install nativefier -g

Warning: installing Nativefier without sudo can cause problems.

Convert websites to apps

Nativefier works by generating an electron frame based on the URL which you receive from the command line. To create a native Gnu / Linux application using a website, just follow these steps:

  • Step 1 → Find the website you want to create an app for. Once you have a website in your browser, highlight the URL with your mouse, and right-click on it. Select option 'to copy'.
  • Step 2 → In the terminal window, use Nativefier to generate a basic application, pasting the url you just copied. In this article we are going to use this same website.

create app with nantivefier Ubunlog

nativefier -p linux -a x64 -n ubunlog https://ubunlog.com
  • Step 3 → Nativefier will include the URL in an electron application. It is important to pay attention to the terminal while generating the app. If an error appears, press the key combination Ctrl + C and run the command again.
  • Step 4 → When Nativefier finishes generating the application, you should update the permissions of this before being able to use it. To set the permissions, in the terminal run the following commands:
cd *-linux-x64

sudo chmod +x *
  • Step 5 → Run your application electron personalized with:

app nativefier ubunlog released

./ubunlog

Custom application options

In this section of the post, we will briefly review some of the options Nativefier has. These will allow the user to create a better desktop application.

Note: all options can be written at the same time. There is no limit on how many are used at the same time.

In the systray

Do you want to allow have the application appear in the system tray? Try to generate the application with the –tray option:

system tray app

nativefier -p linux -a x64 -n nombreapp https://url-pagina-app.com --tray

Full Screen

Do you want your application to be able to be launched in full screen? Uses the 'full-screen' option in the following command to enable it:

nativefier -p linux -a x64 -n nombreapp https://url-pagina-app.com --full-screen

Start Maximized

Possible force our electron application to always start maximized. To get it you just have to use the 'maximize' option in the command to create the application:

nativefier -p linux -a x64 -n nombreapp https://url-pagina-app.com --maximize

Enable FlashPlayer

It is possible to have a web application that is based on Flash. Fortunately, Nativefier has a way of load adobe flash plugin. We will only have to add the 'flash' option to the command that we have been using:

nativefier -p linux -a x64 -n nombreapp https://website-app-url.com --flash

Always up

Do you want your electron application ignore window manager rules and always appear on top of everything the rest? Proof the 'always-on-top' option when compiling with Nativefier:

nativefier -p linux -a x64 -n nombreapp https://website-app-url.com --always-on-top

More configuration options

nativefier help

nativefier --help

Nativefier's help to show us the different options that we can use to configure our applications. We will be able to find more information about this tool in your GitHub repository.


Leave a Comment

Your email address will not be published. Required fields are marked with *

*

*

  1. Responsible for the data: Miguel Ángel Gatón
  2. Purpose of the data: Control SPAM, comment management.
  3. Legitimation: Your consent
  4. Communication of the data: The data will not be communicated to third parties except by legal obligation.
  5. Data storage: Database hosted by Occentus Networks (EU)
  6. Rights: At any time you can limit, recover and delete your information.

  1.   JOAN said

    npm ERR! typeerror Error: Missing required argument # 1
    npm ERR! typeerror at andLogAndFinish (/usr/share/npm/lib/fetch-package-metadata.js:31:3)
    npm ERR! typeerror at fetchPackageMetadata (/usr/share/npm/lib/fetch-package-metadata.js:51:22)
    npm ERR! typeerror at resolveWithNewModule (/usr/share/npm/lib/install/deps.js:456:12)
    npm ERR! typeerror at /usr/share/npm/lib/install/deps.js:457:7
    npm ERR! typeerror at /usr/share/npm/node_modules/iferr/index.js:13:50
    npm ERR! typeerror at /usr/share/npm/lib/fetch-package-metadata.js:37:12
    npm ERR! typeerror at addRequestedAndFinish (/usr/share/npm/lib/fetch-package-metadata.js:82:5)
    npm ERR! typeerror at returnAndAddMetadata (/usr/share/npm/lib/fetch-package-metadata.js:117:7)
    npm ERR! typeerror at pickVersionFromRegistryDocument (/usr/share/npm/lib/fetch-package-metadata.js:134:20)
    npm ERR! typeerror at /usr/share/npm/node_modules/iferr/index.js:13:50
    npm ERR! typeerror This is an error with npm itself. Please report this error at:
    npm ERR! type error

    npm ERR! Please include the following file with any support request:
    npm ERR! /home/joan/npm-debug.log

    AYUDAAA