Preparing a development environment

In this section, we are going to look at the setup process for each operating system. You can skip the sections that do not correspond to your current platform. Note, however, that you may still need to have multiple operating systems available in case you ever want to test how the packaging and deployment of your applications work across all platforms.

Keep in mind that most of the code for the application projects in this book are universal; the blocks or steps that are different for a particular system will be highlighted and explained.

Installing Visual Studio Code

We are going to be using Visual Studio Code for all the projects and examples in this book. It's a free, open-source, and cross-platform code editor based on Electron. However, feel free to use Atom, Sublime, Vim, or any other editor of your choice.

Setting up Visual Studio Code is very simple and, thanks to Electron's support, the process doesn't differ much across platforms. Let's get started:

1. Navigate to https://code.visualstudio.com/. An installation package will be suggested to you regarding your current operating system. It is also possible to choose from a list of available distributions:

2. Click the big Download button to get a .dmg installer for macOS, an .msi file for Windows, or a .deb package for Debian-based Linux distributions.
3. Run the corresponding file and follow the on screen instructions. You don't need to customize anything during the setup process.

If you are using or plan to use Ubuntu Linux for development purposes, the process is slightly easier than it is for other operating systems.

Installing Visual Studio Code for Ubuntu

If you are using Ubuntu Linux as your primary development machine, you can download Visual Studio Code from the Ubuntu Software Center. Just type code or visual studio code into the search box—you should get the link to the corresponding package.

Note that there is also an Insiders Version for Visual Studio Code. This version is updated daily and is for experienced developers that want to see the latest features. If you are getting started with Visual Studio Code, then it is better to stick to the regular version as it is usually more stable than the Insiders edition.

Setting up the environment for macOS

This section describes how to install and configure the required software for macOS. Feel free to skip this section if you are using a Linux or Windows platform.

Installing Git on macOS

Git comes preinstalled with all macOS versions. To verify this, launch the Terminal application and run the following command:

git --version

The output should be similar to the following:

git version 2.17.2 (Apple Git-113)

Please note that it isn't critical if your system's version of Git doesn't match the one in this example.

Installing Node.js on macOS

Next, let's install Node.js and NPM using the following steps. You can find the necessary installation packages by navigating to https://nodejs.org:

Note that Node.js typically comes in two flavors: the Long-Term Support (LTS) version, which is suitable for most users, and the Current version, which provides the most cutting-edge features and enhancements.

1. First, we need to download and install Node.js. The website automatically detects your browser and platform and suggests the appropriate packages for you to download. For macOS, you are going to see the Download for macOS (x64) label and two big download buttons, as shown in the following screenshot:

2. Choose any version and click the corresponding button to get the relevant installer package. The installation process for the macOS platform is pretty straightforward. Keep all the default settings; proceed with the wizard's steps until the setup is over.
3. In the Terminal application, run the following commands to verify that you have Node.js and NPM installed on your machine:

      node -v
      npm -v

4. The system's output should be similar to the following, though their versions may vary:

      v12.13.0
      6.12.1

Congratulations! You've successfully installed Node.js on your macOS.

Setting up the environment for Ubuntu Linux

In this section, we are going to use the latest Ubuntu desktop version, 18.10, though previous LTS versions should also run fine. You can skip this section and jump to the Windows or macOS setup section if you don't use Linux. However, you may find this section useful once you start testing cross-platform deployment for your Electron applications.

Installing Git on Ubuntu

You can check whether you have Git installed by running the following command:

git --version

Typically, Git is not present on fresh installations of Ubuntu. To get it, run the following command:

sudo apt install -y git

Please note that you need to enter the administrator password to proceed.

Installing Node.js on Ubuntu

Ubuntu usually doesn't ship with the Node.js and NPM tools out of the box. You need to install them separately.

To install Node.js, follow these steps:

1. Run the following command:

      sudo apt install -y nodejs

2. Now, we need to verify that Node.js has been installed. You can check the version that you've installed in the Terminal application by using the following command:

      node --version

The system's output, which will be the version's value, will be v8.11.4 or higher.

To install NPM, follow these steps:

1. Use the following command:

      sudo apt install -y npm

2. The fastest way to check that NPM has been installed is to check its version. You can do so by using the following command:

      npm --version

The version number should be 5.8.0 or higher.

Setting up the environment for Windows

In this section, we are going to walk through the installation process for Windows 10.

Installing Git on Windows

I recommend installing Git after Visual Studio Code because the Git setup wizard allows you to enable integration between the two.

The process of installing Git on Windows 10 is slightly different compared to macOS and Ubuntu. Follow these steps to install it:

1. Navigate to https://git-scm.com. The website will detect your platform and suggest a proper distribution.
2. Click the button that says Download 2.20.1 for Windows, wait for the file to download, and run the installer package.
3. The Git installer for Windows sets all the respective defaults for you. Just proceed with the questions until you reach the Select Components dialog.

4. I suggest checking the Use a TrueType font in all console windows option, as shown in the following screenshot:

This is optional, but it helps improve readability slightly.

5. Follow the installation steps and use the predefined settings until you get to the Choosing the default editor used by Git dialog.
6. If you have already installed Visual Studio Code, I strongly recommend selecting the Use Visual Studio Code as Git's default editor option from the drop-down list, as shown in the following screenshot:

7. Accept all the defaults in the subsequent dialogs until the setup is over.

Installing Node.js on Windows

Once Visual Studio Code and Git are ready, we can install Node.js and NPM on Windows:

1. Navigate to https://nodejs.org/en and get the corresponding installer. Note that the website detects your platform for you and suggests the corresponding installer package. For Windows, you are going to see the Download for Windows (x64) label and two buttons where you can select either the LTS, that is, the stable LTS version, or a current one, with the most recent cutting-edge features.
2. Download and run the installation file. Proceed with the setup wizard and use the default settings—these are usually pretty reasonable.

Optionally, in the Tools for Native Modules dialog, you can allow the automatic installation of a set of the tools so that you can compile native modules. This is shown in the following screenshot:

The option for the native module instructs the setup wizard to download and configure all the necessary tooling after the installation of Node.js is over.

Please note that the extra tools require about 3 GB of additional space on your disk and may take a few minutes to install. However, I recommend installing those tools as you may come across third-party modules and libraries for the system's integration that require those tools.

Alternatively, you can always download the latest copy of the Node.js installer again, go through the setup wizard steps, and check the Tools for Native Modules option if you forgot to do that previously.

Verifying the installation

Launch the Command Prompt utility and execute the following two commands to ensure that both Node.js and NPM are present on your machine:

node --version
npm --version

You should receive the following system output:

v12.13.0
6.12.1

Please note that your versions may vary, depending on the last published packages you downloaded. At the time of writing, it is essential to get any output for each command to prove the tool is there, rather than a version value.

In this section, we covered the installation of Node.js and NPM for the Windows, macOS, and Linux systems so that you can start creating a simple application project. In the next section, we are going to walk through the minimal configuration process to help you get started.