bradtraversy / electronshoppinglist Goto Github PK

View Code? Open in Web Editor NEW

218.0 12.0 136.0 221 KB

Shopping list desktop app built on electron

HTML 43.75% JavaScript 56.25%

electronshoppinglist's Introduction

Electron ShoppingList Desktop App

This is a cross platform shoppinglist desktop application built on electron

Version

1.0.0

Usage

Installation

Install the dependencies

$ npm install

Serve

To run electron

$ npm start

To Package & Build

For Windows

$ npm run package-win

For Mac

$ npm run package-mac

For Linux

$ npm run package-linux

electronshoppinglist's People

Stargazers

Watchers

Forkers

musbell d0ng4667 aivazovskiiroman javascript-indonesias pereiradaniel mahedi2014 mkrnaqeebi farid18baku crimsonsaber jdcrecur fuyajun1983cn j0a0liveiraa mahmoudrizk lmx99 liadidan kitayamanoriaki eliemugenzi sangohan wooodhead heera sharafakinremi sndineshan rnulens jasenmichael sky8652 s949492225 joroni saintkarlsbad nirikshan 1966-535 dawidpolakowskiqa bahodursaidov nisalavira smsmzero superswanz donedolio kieranz odargm aebenw 123xeuphoriia stevezaxz ppremk theship vladwoguer thehydrogen 3rwinn olympikesofts mascot200 nikhilchennakeshava noklam oskygh dalalsunil1986 asralf90 ahmad-rameez treycottingham rafael46 syedsohanahmed mychidarko leahgarbri psychozipz nathandsimpson tanujvyas10 sarangan b0tdev stevetan123 yjprakash vangeytedvg wilybox kjleone19 abechoi ozkanerdogmus jinil8 tc2h osama-usuf songtian17 justincletus haodaohong stephensmitchell-forks sudharba andreamobilia nk095291 oleh10hoba hsvu akinhwan demersjd dpouls daviddurv85 ashrafulsbmcbd alextoronto1 ibeeliot tommotaku pkcry smsalaken visualsynk josephjlee originalankit elb5465 ngaboindev bospetersen katrinyordanova

electronshoppinglist's Issues

Error

I have followed your instructions precisely as shown in your video, yet I always get an error saying-
TypeError: Cannot read property 'on' of undefined
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: electron .
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.

I am very confused because it worked yesterday, but won't work today. I feel like it has something to due with the packages. Maybe you can't install the same package 2x's? Please help and thank you for your time!

Index.js File -

const electron = require('electron');
const path = require('path');
const url = require('url');

const {app, BrowserWindow} = electron;

let mainWin;

// Listen for app to be ready
app.on('ready', function(){
// Create new window
mainWin = new BrowserWindow({});

mainWin.loadURL(url.format({
pathname: path.join(__dirname, 'app', 'index.html'),
protocol: 'file:',
slashes: true
}));

mainWin.on('closed', function(){
app.quit();
});
});

Package.json File -

{
"name": "calculator",
"version": "1.0.0",
"description": "Simple Calculator",
"main": "index.js",
"scripts": {
"start": "electron ."
},
"author": "Carter Snook",
"license": "ISC",
"dependencies": {
"electron": "^4.1.1"
}
}

Menu is not working on MacOS

I had to modify the code in main.js to make the app working on macOS :

// If OSX, add empty object to menu
if(process.platform == 'darwin'){
  mainMenuTemplate.unshift({label: app.getName()});
}

addWindow.html: require is not defined

Hi Brad, First of all thank you for your awesome course!

Currently when we click on add item button on add window we get an error as require is not defined.

Robb and Israel had proposed a solution in your video to enable nodeIntegration in browserWindow with a parameter as:

new BrowserWindow(
        {
            webPreferences: {
                nodeIntegration: true
            }
        }
)

Adding this as an issue for tracking. :)

npm start is not working

i tried even with npm start electron its not working :(

TypeError: Cannot read propert 'on' of undefined.

This happened when I had to close all other windows when we close the main window. Couldn't find a solution to this. The error is for mainWindow.on("closed", function () { app.quit(); });

Below is my code.

const electron = require("electron");
const url = require("url");
const path = require("path");

const { app, BrowserWindow, Menu } = electron;

let mainWindow;
let addWindow;

//Listen for app to be ready
app.on("ready", function () {
  //Create new window
  mainwindow = new BrowserWindow({});

  //Load the html file
  mainwindow.loadURL(
    url.format({
      pathname: path.join(__dirname, "mainWindow.html"),
      protocol: "file:",
      slashes: true,
    })
  );

  // Quit app when closed
  mainWindow.on("closed", function () {
    app.quit();
  });

  //Build the menu from template
  const mainMenu = Menu.buildFromTemplate(mainMenuTemplate);

  //Insert the menu
  Menu.setApplicationMenu(mainMenu);
});

//Handle create add window
function createAddWindow() {
  addWindow = new BrowserWindow({
    width: 300,
    height: 200,
    title: "Add shopping list item",
  });

  //Load the html file
  addWindow.loadURL(
    url.format({
      pathname: path.join(__dirname, "addWindow.html"),
      protocol: "file:",
      slashes: true,
    })
  );
}

//Create menu template
const mainMenuTemplate = [
  {
    label: "File",
    submenu: [
      {
        label: "Add Item",
        click() {
          createAddWindow();
        },
      },
      {
        label: "Clear Items",
      },
      {
        label: "Quit",
        accelerator: process.platform == "darwin" ? "Command+Q" : "Ctrl+Q",
        click() {
          app.quit();
        },
      },
    ],
  },
];

electron-packager complaining about node version

CANNOT RUN WITH NODE 12.4.0
Electron Packager requires Node 4.0 or above.

C:\Users\aaron\Examples\electronshoppinglist>npm run package-win

> [email protected] package-win C:\Users\aaron\Examples\electronshoppinglist
> electron-packager . --overwrite --asar=true --platform=win32 --arch=ia32 --icon=assets/icons/win/icon.ico --prune=true --out=release-builds --version-string.CompanyName=CE --version-string.FileDescription=CE --version-string.ProductName="Shopping List"

CANNOT RUN WITH NODE 12.4.0
Electron Packager requires Node 4.0 or above.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] package-win: `electron-packager . --overwrite --asar=true --platform=win32 --arch=ia32 --icon=assets/icons/win/icon.ico --prune=true --out=release-builds --version-string.CompanyName=CE --version-string.FileDescription=CE --version-string.ProductName="Shopping List"`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] package-win script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\aaron\AppData\Roaming\npm-cache\_logs\2019-07-11T22_33_19_783Z-debug.log```

require is not defined

Getting require not defined error