/build-a-desktop-app-with-electron

This is the GitHub repo to accompany the Egghead Course "Build a desktop application with Electron"

Primary LanguageJavaScript

Build a desktop application with Electron

Mentioned in Awesome Electron

This is the GitHub repo to accompany the Egghead Course "Build a desktop application with Electron". Watch it on egghead.io.


Electron is a framework that makes it easy to create cross-platform desktop apps with JavaScript, HTML, and CSS. Electron and open-source tools give you everything you need to create a compelling desktop app--native user interface elements like menus and dialogs, installers, auto-updates, and more. This course will teach you the core concepts of Electron so that you can leverage it to create your own desktop application for macOS and Windows.

We'll go over:

  • Creating user interfaces in Electron (both HTML based and native)
  • Understanding Electron's multi-process architecture
  • Shipping your app to users

Lessons

  1. Create a "Hello World" app using Electron

  2. Load CSS in a Electron BrowserWindow

  3. Load JavaScript in an Electron BrowserWindow

  4. Create a native desktop system menu with the Electron Menu module

  5. Display native desktop dialog windows with Electron

  6. Save/Open a file with an Electron dialog window

  7. Understand Electron’s main and renderer process architecture

  8. Communicate between Electron processes using IPC

  9. Communicate between Electron processes using the remote module

  10. Create an icon for your Electron app

  11. Package your Electron application into a executable file with electron-builder

  12. Code sign your Electron application with electron-builder

  13. Ship updates to your Electron app with autoUpdater (Mac)

  14. Ship updates to your Electron app with autoUpdater (Windows)


Usage

git clone https://github.com/ccnokes/build-a-desktop-app-with-electron.git

If you want to run each example, you may want to save disk space by symlinking the node_modules at the root of the project to each lesson. To do so:

npm install 
npm run symlink