When you write some code, it does not start performing its required action then and there. The code performs its action when it is run or executed. You might be wondering where will you be running this JavaScript code. Let's find out the answer to this.

You've learned that JavaScript is the language of the web. Well if that’s the case, the browser (be it Mozilla Firefox, Google Chrome, Safari, Internet Explorer or any other) which we use to browse the web, must surely know how to run JavaScript, isn't it? If you are also thinking the same, then you are on the correct path. Browsers are the ones which execute the JavaScript code.

How do browsers execute JavaScript?

Computers understand everything in binary language i.e. in the form of zeroes and ones. Computers do not understand the English alphabets A, B, C, D. Saying “hello” in binary is like saying 01001000 011 and followed by a dozen zeroes and ones. This is the language computers understand. So any instruction you give has to be first converted to binary form and only then the computer can understand and process the instructions. Now it is very tough for the humans to give instructions in the form of 0s and 1s. This is where the programming languages like JavaScript come into the picture. We give instructions to the computer in these programming languages (which are quite understandable by us) and they are converted to the machine language (which is quite understandable by computer) by something called translators.

There are different types of translators and we will discuss only two of them - compilers and interpreters.

An interpreter processes each line in the program one by one and if an error is encountered on any line, it is reported then and there. On the other hand, a compiler processes the entire program at once and at the end, it reports all the errors (if any) in the entire program.

Please note that JavaScript is interpreted and not compiled. However, there are compilers too available for JavaScript.

$$/$$

Now you might be wondering how to move forward with that, well we’ll start by having you build your own first web page so that you can see how you can use JavaScript on this web page.

To start building your first web page, you first need to build the skeleton of your web page - something that you will be able to see on the web page. And you require HTML for that.

So let’s start by writing some code for it. But first, why don’t you create a new folder so that all your code can stay there? You can name this folder whatever you want and you can create this at any place you want to.

(I have created a new folder with the name 'Sample HTML Code' on Desktop.)

So have you created a new folder? Good. Now, let's open this new folder in VSCode by clicking on File menu and then clicking on the Open (macOS) or Open Folder (Windows).

Or you can also directly click on the 'Open Folder' button as shown in the screenshot below.

After opening this folder, the view must have changed something similar to this, which shows the name of the opened folder on the left panel. You can see SAMPLE HTML CODE (folder name) in the screenshot given below:

Now create a new file by clicking on the 'New File' icon, as shown in the screenshot given below:

Now name this file as index.html. This file will automatically be opened in the editor and the editor will look like this:

Now copy the code given below and paste it inside the index.html file and save this file using the shortcut Ctrl + S (Windows) and Cmd + S (macOS).

<!DOCTYPE html>
<head>
   <title>Basic JavaScript</title>
</head>
<body>
    <h2>Learning Basic JavaScript</h2>
    <script>
	// all JavaScript code resides here
    </script>
</body>
</html>

So, here we are with the sample code. Let’s try to understand what is contained inside this code.

The <title> tag inside <head> tags is responsible for the title of the webpage. The <body> tag shows the actual content of the webpage as you can see in the image given above. The heading 'Learning Basic JavaScript' comes from the <h2> tag inside <body> tags.

Please note that this is just to make you understand the code setup which we are using in the upcoming segments so that you don't feel surprised when you look at it. It is not at all required of you to understand and learn HTML or CSS written in this code. Our only aim is to learn JavaScript in next few sessions and not HTML and CSS.

Now you might be wondering what the <script> tag is for! Don’t worry. We will cover this in the next segment.