Setting up the Development Environment

5.1 Choosing an IDE

To write programs, you need to write programs. There's some logic in this quote. But to start writing programs, you need to install an IDE (a special program for writing programs) and create your first project.

There are many IDE options to choose from for learning web development. They're all pretty much equivalent, since your project's code will still run in the browser 😊

Here are the 4 most popular ones:

• Visual Studio Code by Microsoft
• Intellij IDEA Community Edition
• Atom by GitHub
• WebStorm Community Edition ()

I like WebStorm, but you can choose any other product and won't notice much difference. Below, I'll show some screenshots of key setup steps for the IDE.

5.2 Downloading WebStorm

Step 1. To install WebStorm, you first need to download it. Just type WebStorm into Google or just follow the link. You'll see a pretty picture like this:

Step 2. Go ahead and click the "Download" button, and the download will start immediately. If everything went smoothly, you'll see a message like this:

Step 3. Your operating system should be detected automatically. But if it doesn't, you can select it on this page — download WebStorm:

5.3 Installing WebStorm

After downloading the correct version of WebStorm, it needs to be installed. Here are a few key steps:

Step 1. Run the installer — you should see a window like this:

Step 2. Check a couple of boxes, like I did:

Step 3. No need to reboot anything:

5.4 WebStorm for Non-commercial Use

If you use these IDEs for non-commercial purposes, like learning, you can do it for free.

1. Launch WebStorm.
2. When it starts, a window will pop up where you can choose the non-commercial use option.
3. Log into your JetBrains account or create a new one.
4. Accept the "Toolbox Subscription Agreement for Non-commercial Use".
5. Enjoy the development.

If you've already started a trial or activated your IDE with a paid license, you can still switch to a non-commercial subscription by doing the following:

1. For WebStorm, go to the Help | Register section.
2. In the open window, click the Remove License button.
3. Select Non-commercial use.
4. Log into your JetBrains account or create a new one.
5. Accept the "Toolbox Subscription Agreement for Non-commercial Use".
6. Enjoy the development.

5.5 Creating Your First Project

After installing WebStorm, it's time to launch it and create your first project. Follow the instructions:

Step 1. Launch WebStorm. You'll get a window like this:

Step 2. Create a new project — click the New Project button.

Then you need to:

• Choose a name for your first project.
• Select a folder for your first project (the Location field). If WebStorm suggests the Admin folder by default, it's better to change it. Fewer problems later.

Mine looks like this:

Step 3. If you've done everything right, you'll see a picture like this: