02. Environment Setup and Running Code.

02. Environment Setup and Running Code.

·

5 min read

This article explains how to execute JavaScript code on your machine by first installing VS Code and Node JS, and then printing ‘Hello World’ to the terminal. I will use a Windows machine throughout the series, but things should work in a very similar way across all operating systems.

Needless to say, this is an optional piece and is published to level the playing field for everyone reading the series.

What is VS Code?

You may have heard the definition of programming. If not, it is simply the process of writing instructions that direct computers to perform specific actions. To write these instructions (called source code in technical terms), we use text-based files with different file extensions and a significant number of these files combine to build sophisticated software.

VS Code (short for Visual Studio Code) is a lightweight, open-source code editor developed by Microsoft. It was released in 2015 and has since grown to become the most popular solution to manage files during software development. VS Code allows us to edit the contents of these files, debug our code, commit changes to GitHub and introduce third-party features into our development workflow.

There are some good alternatives to VS Code that you can explore, but I recommend you stick with it for this series.

Installing VS Code.

Now that we know what VS Code is, we must download and install it before proceeding. To get started, click here. The hyperlink leads you to the following page, where you must select the operating system installed on your current machine.

Selecting the operating system will download the installer on your computer. Upon completion, open the installer, accept the agreement, and run through the setup without modifying the defaults. After the installation, locate VS Code on your machine and open it up.

Depending on when you read the series, you may or may not see the following window. I prefer to click the close button pointed to by the arrow but feel free to poke around and get comfortable.

Installing Node JS.

Next, we need to download and install Node JS. To get started, click here. The hyperlink leads you to the following page, where you must select the operating system installed on your current machine. Make sure you download the LTS version and not the current version.

Selecting the operating system will download the installer on your computer. Upon completion, open the installer, accept the agreement, and run through the setup. Make sure you check the following option during the installation process.

To confirm if Node JS has successfully been installed on your machine, open up your terminal and run the following command. If the command lists a version number, it is a good thing and you can continue reading. Otherwise, try and install Node JS again before proceeding.

node -v

Writing and Running Code.

Now that we have VS Code and Node JS installed on our computers, we can move to the next step, which is to write and execute JavaScript code.

I recommend you create a folder on your desktop or some other location on your hard drive before proceeding. I created one on my desktop and named it ‘workspace’.

Then, open up your VS Code, drag the newly created folder to the VS Code window and drop it.

Upon dropping the folder, you may or may not see the following prompt. If you do, click the button that says Yes, I trust the authors to continue.

Once the folder opens up in your code editor, you will see the following user interface. From left to right, you have the activity bar, the primary sidebar and the editor. The primary sidebar currently shows the explorer but can change depending on what you select from the activity bar. You can read more about the user interface on the official website here if you are interested.

Remember how we write code in text-based files with different file extensions? Well, it is time to create a new file to write our JavaScript code. Right-click anywhere inside the primary sidebar and select the New File… option.

Now, you need to provide a name for your new file. It is important to remember that you must use js as the file extension to write JavaScript code inside the file. If you get the extension right, you can name the file anything you want. I recommend you follow the convention and name your file index.js for now.

Once created, click on the file to open it up in the editor. Then, edit the contents of the file to match those shown in the picture and save the file by pressing CTRL + s on Windows or CMD + s on MacOS.

If you do not feel like writing it yourself, copy the code below and paste it instead. Do not forget to save the file.

console.log("Hello World!");

Finally, find Terminal in the menu bar and click New Terminal to open up the one built into VS Code.

Once the terminal pops up, type the following command to execute code inside the index.js file. If you named your file something different, replace index.js with the filename you chose.

node index.js

The command above prints out Hello World! to the terminal. In the JavaScript universe, we say that we logged Hello World! to the console.

Wrapping Up.

You just wrote your first line of JavaScript code in this article. Taking the initiative to get started with something is arguably the hardest part, and if you made it this far, I can assure you that you are headed in the right direction.

Congratulations on taking the first step. I hope this series provides you with a good foundation and helps elevate your career to newer heights.

If you want to interact or extend support, you can find my socials here.