Adds base boilerplates similar to that of Electron
This commit is contained in:
Atul R
@@ -0,0 +1,138 @@
|
||||
# Guides and Tutorials
|
||||
|
||||
- [About NodeGui](tutorial/about.md)
|
||||
- [Setting up the Development Environment](tutorial/development-environment.md)
|
||||
- [Setting up macOS](tutorial/development-environment.md#setting-up-macos)
|
||||
- [Setting up Windows](tutorial/development-environment.md#setting-up-windows)
|
||||
- [Setting up Linux](tutorial/development-environment.md#setting-up-linux)
|
||||
- [Choosing an Editor](tutorial/development-environment.md#a-good-editor)
|
||||
- [Creating your First App](tutorial/first-app.md)
|
||||
- [Hello World](tutorial/first-app.md#Hello-World)
|
||||
- [NodeGui Development in a Nutshell](tutorial/first-app.md#NodeGui-development-in-a-nutshell)
|
||||
- [Running Your App](tutorial/first-app.md#running-your-app)
|
||||
|
||||
// BOOK MARK - TODO AFTER THIS
|
||||
|
||||
- [Application Architecture](tutorial/application-architecture.md)
|
||||
- [Main and Renderer Processes](tutorial/application-architecture.md#main-and-renderer-processes)
|
||||
- [Using NodeGui's APIs](tutorial/application-architecture.md#using-NodeGui-apis)
|
||||
- [Using Node.js APIs](tutorial/application-architecture.md#using-nodejs-apis)
|
||||
- [Using Native Node.js Modules](tutorial/using-native-node-modules.md)
|
||||
- Adding Features to Your App
|
||||
- [Notifications](tutorial/notifications.md)
|
||||
- [Recent Documents](tutorial/recent-documents.md)
|
||||
- [Application Progress](tutorial/progress-bar.md)
|
||||
- [Custom Dock Menu](tutorial/macos-dock.md)
|
||||
- [Custom Windows Taskbar](tutorial/windows-taskbar.md)
|
||||
- [Custom Linux Desktop Actions](tutorial/linux-desktop-actions.md)
|
||||
- [Keyboard Shortcuts](tutorial/keyboard-shortcuts.md)
|
||||
- [Offline/Online Detection](tutorial/online-offline-events.md)
|
||||
- [Represented File for macOS BrowserWindows](tutorial/represented-file.md)
|
||||
- [Native File Drag & Drop](tutorial/native-file-drag-drop.md)
|
||||
- [Offscreen Rendering](tutorial/offscreen-rendering.md)
|
||||
- [Supporting macOS Dark Mode](tutorial/mojave-dark-mode-guide.md)
|
||||
- [Testing and Debugging](tutorial/application-debugging.md)
|
||||
- [Debugging the Main Process](tutorial/debugging-main-process.md)
|
||||
- [Debugging the Main Process with Visual Studio Code](tutorial/debugging-main-process-vscode.md)
|
||||
- [Using Selenium and WebDriver](tutorial/using-selenium-and-webdriver.md)
|
||||
- [Testing on Headless CI Systems (Travis, Jenkins)](tutorial/testing-on-headless-ci.md)
|
||||
- [DevTools Extension](tutorial/devtools-extension.md)
|
||||
- [Automated Testing with a Custom Driver](tutorial/automated-testing-with-a-custom-driver.md)
|
||||
- [Distribution](tutorial/application-distribution.md)
|
||||
- [Supported Platforms](tutorial/support.md#supported-platforms)
|
||||
- [Code Signing](tutorial/code-signing.md)
|
||||
- [Mac App Store](tutorial/mac-app-store-submission-guide.md)
|
||||
- [Windows Store](tutorial/windows-store-guide.md)
|
||||
- [Snapcraft](tutorial/snapcraft.md)
|
||||
- [Security](tutorial/security.md)
|
||||
- [Reporting Security Issues](tutorial/security.md#reporting-security-issues)
|
||||
- [Chromium Security Issues and Upgrades](tutorial/security.md#chromium-security-issues-and-upgrades)
|
||||
- [NodeGui Security Warnings](tutorial/security.md#NodeGui-security-warnings)
|
||||
- [Security Checklist](tutorial/security.md#checklist-security-recommendations)
|
||||
- [Updates](tutorial/updates.md)
|
||||
- [Deploying an Update Server](tutorial/updates.md#deploying-an-update-server)
|
||||
- [Implementing Updates in Your App](tutorial/updates.md#implementing-updates-in-your-app)
|
||||
- [Applying Updates](tutorial/updates.md#applying-updates)
|
||||
- [Getting Support](tutorial/support.md)
|
||||
|
||||
## Detailed Tutorials
|
||||
|
||||
These individual tutorials expand on topics discussed in the guide above.
|
||||
|
||||
- [Installing NodeGui](tutorial/installation.md)
|
||||
- [Proxies](tutorial/installation.md#proxies)
|
||||
- [Custom Mirrors and Caches](tutorial/installation.md#custom-mirrors-and-caches)
|
||||
- [Troubleshooting](tutorial/installation.md#troubleshooting)
|
||||
- NodeGui Releases & Developer Feedback
|
||||
- [Versioning Policy](tutorial/NodeGui-versioning.md)
|
||||
- [Release Timelines](tutorial/NodeGui-timelines.md)
|
||||
- [App Feedback Program](tutorial/app-feedback-program.md)
|
||||
- [Packaging App Source Code with asar](tutorial/application-packaging.md)
|
||||
- [Generating asar Archives](tutorial/application-packaging.md#generating-asar-archives)
|
||||
- [Using asar Archives](tutorial/application-packaging.md#using-asar-archives)
|
||||
- [Limitations](tutorial/application-packaging.md#limitations-of-the-node-api)
|
||||
- [Adding Unpacked Files to asar Archives](tutorial/application-packaging.md#adding-unpacked-files-to-asar-archives)
|
||||
- [Testing Widevine CDM](tutorial/testing-widevine-cdm.md)
|
||||
- [Using Pepper Flash Plugin](tutorial/using-pepper-flash-plugin.md)
|
||||
|
||||
---
|
||||
|
||||
- [Glossary of Terms](glossary.md)
|
||||
|
||||
## API References
|
||||
|
||||
- [Synopsis](api/synopsis.md)
|
||||
- [Process Object](api/process.md)
|
||||
- [Supported Chrome Command Line Switches](api/chrome-command-line-switches.md)
|
||||
- [Environment Variables](api/environment-variables.md)
|
||||
- [Breaking API Changes](api/breaking-changes.md)
|
||||
|
||||
### Custom DOM Elements:
|
||||
|
||||
- [`File` Object](api/file-object.md)
|
||||
- [`<webview>` Tag](api/webview-tag.md)
|
||||
- [`window.open` Function](api/window-open.md)
|
||||
- [`BrowserWindowProxy` Object](api/browser-window-proxy.md)
|
||||
|
||||
### Modules for the Main Process:
|
||||
|
||||
- [app](api/app.md)
|
||||
- [autoUpdater](api/auto-updater.md)
|
||||
- [BrowserView](api/browser-view.md)
|
||||
- [BrowserWindow](api/browser-window.md)
|
||||
- [contentTracing](api/content-tracing.md)
|
||||
- [dialog](api/dialog.md)
|
||||
- [globalShortcut](api/global-shortcut.md)
|
||||
- [inAppPurchase](api/in-app-purchase.md)
|
||||
- [ipcMain](api/ipc-main.md)
|
||||
- [Menu](api/menu.md)
|
||||
- [MenuItem](api/menu-item.md)
|
||||
- [net](api/net.md)
|
||||
- [netLog](api/net-log.md)
|
||||
- [powerMonitor](api/power-monitor.md)
|
||||
- [powerSaveBlocker](api/power-save-blocker.md)
|
||||
- [protocol](api/protocol.md)
|
||||
- [screen](api/screen.md)
|
||||
- [session](api/session.md)
|
||||
- [systemPreferences](api/system-preferences.md)
|
||||
- [TouchBar](api/touch-bar.md)
|
||||
- [Tray](api/tray.md)
|
||||
- [webContents](api/web-contents.md)
|
||||
|
||||
### Modules for the Renderer Process (Web Page):
|
||||
|
||||
- [desktopCapturer](api/desktop-capturer.md)
|
||||
- [ipcRenderer](api/ipc-renderer.md)
|
||||
- [remote](api/remote.md)
|
||||
- [webFrame](api/web-frame.md)
|
||||
|
||||
### Modules for Both Processes:
|
||||
|
||||
- [clipboard](api/clipboard.md)
|
||||
- [crashReporter](api/crash-reporter.md)
|
||||
- [nativeImage](api/native-image.md)
|
||||
- [shell](api/shell.md)
|
||||
|
||||
## Development
|
||||
|
||||
See [development/README.md](development/README.md)
|
||||
@@ -0,0 +1,89 @@
|
||||
# Developer Environment
|
||||
|
||||
NodeGui development is essentially Node.js development. To turn your operating
|
||||
system into an environment capable of building desktop apps with NodeGui,
|
||||
you will merely need Node.js, npm, a code editor of your choice, and a
|
||||
rudimentary understanding of your operating system's command line client.
|
||||
|
||||
## Setting up macOS
|
||||
|
||||
> NodeGui supports macOS 10.10 (Yosemite) and up. NodeGui currently only supports 64bit OS.
|
||||
|
||||
Currently supported Node.Js versions are 12.x and up.
|
||||
|
||||
We strongly suggest you use some kind of version manager for Node.Js. This would allow you to switch to any version of nodejs quite easily. We recommend `nvm`: https://github.com/nvm-sh/nvm
|
||||
|
||||
Confirm that both `node` and `npm` are available by running:
|
||||
|
||||
```sh
|
||||
# This command should print the version of Node.js
|
||||
node -v
|
||||
|
||||
# This command should print the version of npm
|
||||
npm -v
|
||||
```
|
||||
|
||||
If both commands printed a version number, you are all set! Before you get
|
||||
started, you might want to install a [code editor](#a-good-editor) suited
|
||||
for JavaScript development.
|
||||
|
||||
## Setting up Windows
|
||||
|
||||
> NodeGui supports Windows 7 and later versions – attempting to develop NodeGui
|
||||
> applications on earlier versions of Windows might not work. NodeGui currently only supports 64bit OS.
|
||||
|
||||
Currently supported Node.Js versions are 12.x and up.
|
||||
|
||||
We strongly suggest you use some kind of version manager for Node.Js. This would allow you to switch to any version of nodejs quite easily. We recommend `nvm`: https://github.com/nvm-sh/nvm
|
||||
|
||||
We strongly recommend Powershell as preferred terminal in Windows.
|
||||
|
||||
Confirm that both `node` and `npm` are available by running:
|
||||
|
||||
```powershell
|
||||
# This command should print the version of Node.js
|
||||
node -v
|
||||
|
||||
# This command should print the version of npm
|
||||
npm -v
|
||||
```
|
||||
|
||||
If both commands printed a version number, you are all set! Before you get
|
||||
started, you might want to install a [code editor](#a-good-editor) suited
|
||||
for JavaScript development.
|
||||
|
||||
## Setting up Linux
|
||||
|
||||
> NodeGui currently supports Ubuntu 12.04 and Debian 8 and up. Although other linux distributions can also be easily supported. NodeGui currently only supports 64bit OS.
|
||||
|
||||
Currently supported Node.Js versions are 12.x and up.
|
||||
|
||||
We strongly suggest you use some kind of version manager for Node.Js. This would allow you to switch to any version of nodejs quite easily. We recommend `nvm`: https://github.com/nvm-sh/nvm
|
||||
|
||||
We strongly recommend Powershell as preferred terminal in Windows.
|
||||
|
||||
Confirm that both `node` and `npm` are available by running:
|
||||
|
||||
```sh
|
||||
# This command should print the version of Node.js
|
||||
node -v
|
||||
|
||||
# This command should print the version of npm
|
||||
npm -v
|
||||
```
|
||||
|
||||
If both commands printed a version number, you are all set! Before you get
|
||||
started, you might want to install a [code editor](#a-good-editor) suited
|
||||
for JavaScript development.
|
||||
|
||||
## A Good Editor
|
||||
|
||||
We might suggest two free popular editors built in NodeGui:
|
||||
GitHub's [Atom][atom] and Microsoft's [Visual Studio Code][code]. Both of
|
||||
them have excellent JavaScript support.
|
||||
|
||||
If you are one of the many developers with a strong preference, know that
|
||||
virtually all code editors and IDEs these days support JavaScript.
|
||||
|
||||
[code]: https://code.visualstudio.com/
|
||||
[atom]: https://atom.io/
|
||||
@@ -0,0 +1,117 @@
|
||||
# Writing Your First NodeGui App
|
||||
|
||||
NodeGui enables you to create desktop applications with pure JavaScript. You could see it
|
||||
as a lightly modified variant of the Node.js runtime that is focused on desktop applications
|
||||
instead of web servers.
|
||||
|
||||
NodeGui is also an efficient JavaScript binding to a cross platform graphical user interface
|
||||
(GUI) library `Qt`. Qt is one of the most mature and efficient library for building desktop applications.
|
||||
This enabled NodeGui to be extrememly memory and CPU efficient as compared to other popular Javascript Desktop GUI solutions. A hello world app built with NodeGui runs on less than 20Mb of memory.
|
||||
|
||||
## Hello World
|
||||
|
||||
Clone and run the code in this tutorial by using the
|
||||
[`nodegui/nodegui-quick-start`][quick-start] repository.
|
||||
|
||||
**Note**: Running this requires [Git](https://git-scm.com) and [npm](https://www.npmjs.com/).
|
||||
|
||||
```sh
|
||||
# Clone the repository
|
||||
$ git clone https://github.com/nodegui/nodegui-quick-start
|
||||
# Go into the repository
|
||||
$ cd nodegui-quick-start
|
||||
# Install dependencies
|
||||
$ npm install
|
||||
# Run the app
|
||||
$ npm start
|
||||
```
|
||||
|
||||
As far as development is concerned, an NodeGui application is essentially a
|
||||
Node.js application. The starting point is a `package.json` that is identical
|
||||
to that of a Node.js module. A most basic NodeGui app would have the following
|
||||
folder structure:
|
||||
|
||||
```text
|
||||
your-app/
|
||||
├── package.json
|
||||
├── index.js
|
||||
```
|
||||
|
||||
## NodeGui Development in a Nutshell
|
||||
|
||||
NodeGui apps are developed in JavaScript using the same principles and methods
|
||||
found in Node.js development. All APIs and features found in NodeGui are
|
||||
accessible through the `@nodegui/nodegui` module, which can be required like any other
|
||||
Node.js module:
|
||||
|
||||
```javascript
|
||||
require("@nodegui/nodegui");
|
||||
```
|
||||
|
||||
The `@nodegui/nodegui` module exports features in namespaces. As examples, windows can be created
|
||||
using the `QMainWindow` class. A simple `main.js` file might open a window:
|
||||
|
||||
```javascript
|
||||
const {
|
||||
QMainWindow,
|
||||
QWidget,
|
||||
QLabel,
|
||||
FlexLayout
|
||||
} = require("@nodegui/nodegui");
|
||||
|
||||
const win = new QMainWindow();
|
||||
//-------------------------------
|
||||
const centralWidget = new QWidget();
|
||||
centralWidget.setObjectName("myroot");
|
||||
const rootLayout = new FlexLayout();
|
||||
centralWidget.setLayout(rootLayout);
|
||||
//--------------------------------------
|
||||
const label = new QLabel();
|
||||
label.setObjectName("mylabel");
|
||||
label.setText("Hello World");
|
||||
//--------------------------------------
|
||||
rootLayout.addWidget(label);
|
||||
win.setCentralWidget(centralWidget);
|
||||
win.setStyleSheet(
|
||||
`
|
||||
#myroot {
|
||||
background-color: #009688;
|
||||
}
|
||||
#mylabel {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
`
|
||||
);
|
||||
win.show();
|
||||
|
||||
global.win = win; // To prevent win from being garbage collected.
|
||||
```
|
||||
|
||||
The `index.js` should create windows and handle all the system events your
|
||||
application might encounter.
|
||||
|
||||
## Running Your App
|
||||
|
||||
You can try your app by running `npm start` from your application's
|
||||
directory.
|
||||
|
||||
## Trying this Example
|
||||
|
||||
Clone and run the code in this tutorial by using the
|
||||
[`nodegui/nodegui-quick-start`][quick-start] repository.
|
||||
|
||||
**Note**: Running this requires [Git](https://git-scm.com) and [npm](https://www.npmjs.com/).
|
||||
|
||||
```sh
|
||||
# Clone the repository
|
||||
$ git clone https://github.com/nodegui/nodegui-quick-start
|
||||
# Go into the repository
|
||||
$ cd nodegui-quick-start
|
||||
# Install dependencies
|
||||
$ npm install
|
||||
# Run the app
|
||||
$ npm start
|
||||
```
|
||||
|
||||
[quick-start]: https://github.com/nodegui/nodegui-quick-start
|
||||
Reference in New Issue
Block a user