Electron is an open source library developed by GitHub for building cross-platform desktop applications with HTML, CSS, and JavaScript. Electron accomplishes this by combining Chromium and Node.js into a single runtime and apps can be packaged for Mac, Windows, and Linux.
An Electron application is essentially a Node.js application. The starting point is a package.json
that is identical to that of a Node.js
module.
-
Step 1: Installing Electron
npm install --save electron
This will install electron dependancy in your machine.
-
Step 2. Create The Browser Window and load index.html
BrowserWindow()
generate an desktops application with height and width specifiedloadFile()
will load the view file for the desktop applicationwebContents.opendevTools()
open the developer tools for development purpose in desktop application.
There are no. of events associted with app. Some of them are listed below.
ready
event fires when app loads first i.e. why createWindow() associated to it to create desktop appwindow-all-closed
event fires when all windows closed i.e. whyapp.quit()
is called at that time
-
Step 3: Running Electron Application
command is used to run electron application.
we can update
scripts
part of ourpackage.json
to run it throughnpm
."scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "electron ." }
npm start
use this command to run elctron application after updatingpackage.json
. -
Step 4: Create Build