Getting started with JavaScript

This is the first video from a beginners tutorial series on JavaScript. In this video, you will learn how to set up an HTML document to use JavaScript code and how to display a message in the web browser using JavaScript. You will also learn how to write the code in a suitable text editor program and how to test your code using the JavaScript console in Google Chrome.

You will need a code editor to write your code. Some suggested code editors are:

It will be best to have at least a basic knowledge of HTML and CSS so if you don’t, then please watch the tutorials on HTML5 and CSS3 here first and then come back to the JavaScript videos.

Watch the video below for an introduction to JavaScript programming.

The code below can be copied to an HTML file. The HTML code contains JavaScript code which will basically display a “Hello world” message in the browser window and the browser console (in Chrome, right-click the page and then click Inspect to access developer tools, then click the Console tab). The console can also be used to view any error messages if there are problems with your code.

The code also shows an example of placing JavaScript code in a separate JS file and examples of using single-line and multi-line comments to add comments (notes) to your code. Simply copy and paste the code snippet into a text editor and save the file as yourfilename.html .

Example of a HTML file called index.html containing both HTML and JavaScript code in one file:

<html>
    <head>
        <title>Intro to JavaScript</title>

        <script>
            // This code will display a Hello World message
            console.log("Hello world");
            document.write("Hello world");
        </script>
    </head>

    <body>
        
    </body>
</html>

Example of an HTML file called index.html which is linked to a separate JavaScript (.js) file containing the JavaScript code:

<html>
    <head>
        <title>Intro to JavaScript</title>

        <script src="script.js"></script>
    </head>

    <body>
        
    </body>
</html>

And the script.js file code:

// This code will display a Hello World message
console.log("Hello world");
document.write("Hello world");

// This is a single line comment

/*
 This is
 a multi-line
 comment.
*/

Next tutorial: Variables and data types

Leave a Reply