Electron Fundamentals
Electron pairs a Chromium window with a Node.js backstage, and everything about building it well follows from that split. This course walks the whole arc: the main/renderer process model, safe IPC through preload scripts and contextBridge, the native shell — menus, tray, dialogs, deep links — persisting app data and wiring auto-updates, and finally packaging, signing, notarizing, and publishing installers. Electron itself can't run in the browser sandbox, so every challenge is a runnable JS model of the concept — the IPC bridge, the settings store, the update feed — that you execute and poke at as you read.
5 lessons · ~2 hours
1. Web to Desktop
Main and renderer
Electron is two kinds of process — one Node.js "main" that owns the OS, and sandboxed Chromium renderers that own the pixels.
Preload & IPC
Preload scripts and contextBridge expose a narrow, hand-picked API to the page, and invoke/handle carries requests to main and answers back.
The native shell
Window options, application menus, tray icons, file dialogs, opening the browser, and deep links — the parts users recognize as "a real app."
App data & updates
Settings live as JSON in the userData directory — written atomically — and the autoUpdater keeps installed copies current without user effort.
Package & ship
electron-builder or Forge turns your project into signed, notarized platform installers — and publishes the update feed your app checks.