Start with the idea

JavaScript connects values, calculations, and actions. Start with a named value and a console message.

Step-by-step lesson notes

What is JavaScript?

JavaScript is the programming language of the Web. It is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions.

JavaScript is used for:

• Making web pages interactive and dynamic
• Building web applications (front-end and back-end with Node.js)
• Mobile app development (React Native, Ionic)
• Desktop applications (Electron)
• Game development
• Server-side programming

Why Learn JavaScript?

• It is the primary scripting language used for browser page behaviour
• It is one of the most popular languages in the world
• Huge job market demand
• Versatile — works on frontend, backend, mobile, and desktop
• Large ecosystem with npm (1M+ packages)
• Active community and constant evolution (ES6, ES7, ES2023+)

How JavaScript Works

JavaScript runs directly in the browser's JavaScript engine (like V8 in Chrome or SpiderMonkey in Firefox). There is no compilation step needed — you write the code and the browser runs it.

Your First JavaScript Program

// Output to the browser console
console.log("Hello, World!");

// Show a popup
alert("Welcome to JavaScript!");

// Write to the page
document.write("<h1>Hello from JS!</h1>");

Where Does JavaScript Go?

JavaScript can be placed inside HTML in three ways:

<!-- 1. Inline (inside an element) -->
<button onclick="alert('Clicked!')">Click Me</button>

<!-- 2. Internal (inside a script tag) -->
<script>
  console.log("Internal script");
</script>

<!-- 3. External (best practice) -->
<script src="script.js"></script>

A complete example

Run this complete index.js program in the JavaScript console editor below. The earlier reference fragments may need a browser page or other surrounding setup.

const learner = "Coding Tamilan";
const lessons = 3;
console.log("Hello, " + learner + "!");
console.log("This week: " + lessons + " lessons");

Hello, Coding Tamilan!
This week: 3 lessons

Make one change. See what happens.

Load the example, change a value, predict the output, and run it again. Use the console output to check your reasoning.

Wait for the editor to load, then load this example and press Run.

Powered by the free OneCompiler editor. Code you run is sent to that external service. Keep personal data and secret keys out of your examples.

Put the idea to work

Your learning checkpoint

• Explain the example in your own words.
• Complete the challenge before revealing its answer.
• Describe the common mistake and how to avoid it.