Is there any standlone gui module for node application [closed]

I want to build a code editor in nodejs. There is option like using an express server to show editor and to execute code in backend. But that would require a browser. So I am looking for node modules that can provide standalone gui for windows platform.


Solution 1:

There are a couple of different options, depending on how you want to proceed.

Option 1:

Use something like QT or GTK bindings to make a more traditional GUI application. These options generally are just Node bindings to the C/C++ API that GTK and QT expose. See node-qt and yue. Although these seem to not be actively developed.

Update:

You can take a look at NodeGUI: https://github.com/nodegui/nodegui

NodeGUI is a javascript library for building cross-platform native desktop applications with JavaScript and CSS like styling. It uses Qt under the hood and works on Mac, Linux and Windows.

It also has a react based renderer called React NodeGUI which is like React Native but for desktop: https://github.com/nodegui/react-nodegui

Option 2:

Use a framework that takes HTML, CSS, and Javascript and bundles it into a standalone HTML5 app. There are a bunch of frame works out there that do this. Examples include node-webkit and AppJS among many others.

Solution 2:

I recommend using an HTML/JS/CSS Framework

Option #1: Electron by GitHub.
Website | GitHub Repo | Releases

It's easier than you think

If you can build a website, you can build a desktop app. Electron is a framework for creating native applications with web technologies like JavaScript, HTML, and CSS. It takes care of the hard parts so you can focus on the core of your application.

Option #2: NW.js (previously known as node-webkit).
Website | GitHub Repo | Releases

Call all Node.js modules directly from DOM/WebWorker and enable a new way of writing applications with all Web technologies.

Electron and NWJS Pros:

  • AppJS is officially deprecated

  • Electron is similar to NW.js but newer, more popular and has a bigger community and updates more frequently. I recommend it.

  • NWJS always uses the latest Versions of Chromium and Node while Electron takes more time to catch up.

  • NWJS supports [JavaScript Source Protection][1] by compiling it to V8 native code. Electron does not.

  • NWJS have a Legacy release for Windows XP and Mac OS X 10.6 support.

  • Electron and NWJS both use MIT license.

You can compare the contributions to electron with NW.js


Electron and NWJS Cons:

  • there is no out-of-the-bag run-time solution currently, so you'll have to ship it with your code (~50MB compressed and +100MB uncompressed) or find a way around it.
  • depending on your app, Electron/NWJS might considered an overkill especially since its startup time is less than ideal, just something to take into account.
  • no native look, you'll have to create your own UI elements using CSS or using some framework.

Option #3: DeskGap.
Website | GitHub Repo | Releases

DeskGap is a framework for building cross-platform desktop apps with web technologies (JavaScript, HTML and CSS).

To enable native capabilities while keeping the size down, DeskGap bundles a Node.js runtime and leaves the HTML rendering to the operating system‘s webview.

  • Lightweight since the webview is provided by the operating system.

  • The API is still quite limited (pretty much a work in progress).

  • Requires new OS versions.

Solution 3:

Apart from the other answers here:

You can take a look at NodeGUI: https://github.com/nodegui/nodegui

NodeGUI is a javascript library for building cross-platform native desktop applications with JavaScript and CSS like styling. It uses Qt under the hood and works on Mac, Linux and Windows.

It also has a react based renderer called React NodeGUI which is like React Native but for desktop: https://github.com/nodegui/react-nodegui

Also, its under active development.

Solution 4:

Answer specific to your question may be NodeGui (powered by Qt5, NodeGui-React)

There are many other options. I'm listing a few options below,

  • electron (Lets you write cross-platform desktop applications using JavaScript, HTML and CSS, based on Node.js & Chromium)
  • carlo (Requires Node & Google Chrome to be installed on the system to run)
  • NW.js (Similar to electron, provides Source code protection)
  • DeskGap (bundles a Node.js runtime and leaves the HTML rendering to the operating system‘s webview)
  • Proton Native (does the same to desktop that React Native did to mobile, based on https://github.com/parro-it/libui-node)

For more, you can use my github repo electron-alternatives to pick a cross-platform desktop development option.