Create Desktop App With Electron And React

Posted By : Shashwat Gupta | 27-Mar-2018








Electron-React-Desktop app



This Application is based on ReactReduxReact Router Technologies

Electron Boilerplate Demo


  •  node version requires bigger than 7 and an npm version requires bigger than 4.

Firstly, clone the git repos.

git clone --depth=1 project-name

And then you must  install dependencies with yarn or npm

$ cd project-name
$ yarn

Note: If you are not useing yarn, run npm install.



 To Run this application


$ npm run dev

Alternatively, and manully way to run app

$ npm run start-renderer-dev
$ npm run start-main-dev



Make build of app

To package apps for the local platform:

$ npm run package

To package apps for Linux platforms:


$ npm run package-linux


To package apps for Mac platforms:

$ npm run package-mac


To package apps for Windows platforms:

$ npm run package-win

To run End-to-End Test

$ npm run build
$ npm run test-e2e


DEBUG_PROD=true npm run package


Manually Way


You have to install create-react-app template via terminal

npm install -g create-react-app
create-react-app your-app
cd your-app


create main.js file .. put below content into there

// ./main.js
const {app, BrowserWindow} = require('electron')

let win = null;

function createWindow() {
  // Initialize the window to our specified dimensions
  win = new BrowserWindow({width: 1000, height: 600});

  // Specify entry point

  // Show dev tools
  // Remove this line before distributing

  // Remove window once app is closed
  win.on('closed', function () {
    win = null;

app.on('ready', function () {



app.on('activate', () => {
  if (win === null) {

app.on('window-all-closed', function () {
  if (process.platform != 'darwin') {


Ref :








Request for Proposal

Recaptcha is required.

Sending message..