• 4 hours
  • Easy

Free online content available in this course.

course.header.alt.is_video

course.header.alt.is_certifying

Got it!

Last updated on 4/19/24

Install Your Front-End Development Tools

In this chapter, you will be installing:

  • Visual Studio Code, one of the world's most popular free development environments.

  • Chrome and Firefox, the two most widely-used web browsers.

Install Visual Studio Code

The first tool you'll be installing is Visual Studio Code, or VS Code, which will be your main workhorse tool.

First, you'll need to download the installer from https://code.visualstudio.com.

On Windows:

Once the download is complete, launch the installer from where you downloaded it, and accept the User Agreement. You can go through the rest of the installation without changing the default configuration.

Accept the license agreement
Accept the license agreement
Default options
Default options
Ready to install
Ready to install

On macOS:

The app as you have downloaded it is ready to use. Drag it to your Applications folder to make it accessible via the Launchpad.

Drag VS Code to Applications
Drag VS Code to Applications

Open Visual Studio code to the Get Started page to ensure it has been installed correctly.

VS Code has been installed correctly
VS Code has been installed correctly

You will need to install Git on your computer if your screen looks like this.

Install Git if your screen looks like this
Install Git if your screen looks like this

If you do not see the Clone Git Repository option in the Start menu, follow the instructions in https://code.visualstudio.com/docs/editor/github to install Git and create a GitHub account.

Now that VS Code is installed correctly, it's time to install your web browsers!

Install Your Browsers

An essential part of any front-end developer's toolkit is multiple browsers. Different browsers can display your sites and apps in different ways, and you'll often have to modify your code slightly for it to be compatible. To test your projects, you will need, at the very least, the two most widely used browsers: Chrome and Firefox.

Install Chrome

Head over to https://www.google.com/chrome/ and download Google Chrome for your operating system.

On Windows:

Launch the downloaded installer: the installation is completely automatic.

On macOS:

Open the downloaded file. Drag and drop the Chrome icon into the Applications folder in the Chrome window.

Drag Chrome to Applications
Drag Chrome to Applications

Install Firefox

Go to https://www.mozilla.org/en-US/firefox/new/ and download the latest version of Firefox for your operating system.

On Windows:

Launch the downloaded installer: the installation is completely automatic.

On macOS:

Open the downloaded file. Drag and drop the Firefox icon into the Applications folder in the Firefox window.

Drag Firefox to Applications
Drag Firefox to Applications

Let's Recap!

You have now installed all of the tools you will need for this course:

  • Visual Studio Code

  • Your browsers: Chrome and Firefox

Let's start exploring them in the next chapter!

Example of certificate of achievement
Example of certificate of achievement