An Intro To Electron - Desktop Apps with JavaScript

Traversy Media · 355K views · 2017 · 24:10

Open on YouTube

Web developmentPython, Ruby & scripting languagestutorialdated

Why Stack Overflow recommends it

Stack Overflow users cite it as the tutorial they followed when their Electron code failed, and answerers reference its sysinfo example when fixing errors like undefined `process` or `require`.

Recommended by 0 people across 0 different months, 2017 to 2020.

What it is

Brad Traversy gives a 24-minute introduction to Electron, the framework for building desktop apps with HTML, CSS and JavaScript. He starts from the official quick-start repo and builds a simple system info app. It is the free teaser for his longer Udemy Electron course.

What people said

Cites Avi · 2017-09 · Stack Overflow · on “Electron - Can't initialize program”

I followed a few video tutorials (such as this one [LINK] and this one [this video] ), which use a very similar code, which throws up an error. My files: package.json { "name": "steamcmd-gui", "version": "0.0.1", "author": "avi12", "main": "main.js", "scripts": { "start": "electron ." }, "dependencies": { "electron": "^1.7.5" } } main.js const electron = require("electron"); const url = require("url"); const path = require("path"); let win; function createWindow() { win = new electron.BrowserWindow(); win.loadURL(url.format({ pathname: path.join(__dirname, "index.html"), protocol: "file", slashes: true }); ); win.on("closed", () => win = null); electron.app.on("ready", createWindow); electron.app

Cites Zeghra · 2019-07 · Stack Overflow · on “Uncaught ReferenceError: process is not defined”

I had same problem when I tried to do this node js app: [this video] The require in html was reached from a < script> and was undefined, like <script> require('./renderer.js');</script> I changed it to: <script src="./renderer.js"></script> The process in html script was also undefined. I included the webPreferences: nodeIntegration in the js file: win = new BrowserWindow({ width: 800, height:600, icon: __dirname+'/img/sysinfo.png', webPreferences: { nodeIntegration: true } }); I hope it helped.

Cites Kristi Begaj · 2020-05 · Stack Overflow · on “How build an Electron 9 app with Angular 9?”

Well I tried this on linux: [this video] and didnt work! I'd like to know the right way to build it, if it doesnt work then any work-around that.