Electron: Start to Finish
What This Session is About
Getting up and running on Electron, a framework to build cross platform desktop apps with JavaScript, HTML, and CSS. You'll walk away with a fully functional Electron desktop app that you can take apart and customize, along with the knowledge to confidently start building your own Electron apps. This repository houses a series of introductory-to-intermediate exercises to Git familiar with Electron by manipulating and extending a prebuilt weather app.
Summary
Built with the photon user interface kit. Uses the Dark Sky Forecast API as a data source.
Table of Contents
Prerequisites
Install Git
macOS
Mac users, while you probably already have a version of Git on your system, it may be out-of-date. You can download an updated installer package here.
Advanced users might consider installing the latest stable version of Git with Homebrew, e.g.:
brew install gitWindows
Git for Windows provides both Git and a Bash emulation environment to use Git on the command line.
Linux
While some Linux distributions come with a version of Git installed, it's often out-of-date. This guide has recommended commands to install Git with your distribution's preferred package manager.
Get familiar with Git commands
You'll want to know how to fork and clone a Git repository, and how to check out a branch.
If you need a refresher, consider exploring our free on-demand training.
Install a text editor
Perhaps consider Atom if you're looking for an awesomely hackable text editor for the 21st century!
Install Node.js
Q: Why do we need to install Node.js if Electron includes Node.js?
A: While Electron does include its own internal version of Node.js, what we'll install first includes
npm, the Node Package Manager. NPM is what powers our dependency installation and build processes.
For all platforms, visit nodejs.org to download the installer package. For our purposes today, we recommend the "LTS" package.
For advanced users: if you later want to install multiple versions of node and npm on your system you can use tools like nvm or n.
Once you've got Node.js installed you will have the node and npm commands available in your terminal. You should be able to npm install packages now, without using sudo. If you see errors when installing packages with npm, you may need to fix your permissions.
Cheat-Sheets
The cheat sheets for each activity are linked here:
- Exercise 1: Getting Started
- Exercise 2: Diving In
- Exercise 3: Electron Defaults
- Exercise 4: Refactoring
- Exercise 5: Packaging
- Exercise 6: Packaging Extensions
- Exercise 7: Refresh
- Exercise 8: CYOA
End Product
At the end of all of our exercises, you should have an app that looks similar to this!
Extended Resources
https://github.com/universeworkshops/electron-weather/issues/1