Blog

  •  

     

     

     

     

     

     

    Electron-React-Desktop app

     

     

    This Application is based on ReactReduxReact Router Technologies

    Electron Boilerplate Demo

    Install

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

    Firstly, clone the git repos.

    git clone --depth=1 https://github.com/chentsulin/electron-react-boilerplate.git 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
      win.loadURL('http://localhost:3000');
    
      // Show dev tools
      // Remove this line before distributing
      win.webContents.openDevTools()
    
      // Remove window once app is closed
      win.on('closed', function () {
        win = null;
      });
    }
    
    
    app.on('ready', function () {
    
      createWindow();
    
    });
    
    app.on('activate', () => {
      if (win === null) {
        createWindow()
      }
    })
    
    app.on('window-all-closed', function () {
      if (process.platform != 'darwin') {
        app.quit();
      }
    });

     

    Ref :

    1: https://medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c

    2:  https://medium.com/@kitze/%EF%B8%8F-from-react-to-an-electron-app-ready-for-production-a0468ecb1da3

    3:  https://github.com/chentsulin/electron-react-boilerplate

     

     

     

     

Tags: desktopapp

Mobile Applications

Video Content

Bigdata & NoSQL

SaaS Applications

Miscellaneous

Archives


Alexa Certified Site Stats for www.oodlestechnologies.com