Tutorial 4: JavaScript Introduction

What Is JavaScript?

JavaScript is the programming language of the web. HTML creates the structure, CSS styles it, and JavaScript brings everything to life.

With JavaScript, you can:

respond to clicks
change HTML on the page
animate things
build full web apps
create games
talk to servers (APIs)

Your First JavaScript Code

The easiest way to run JavaScript is inside the browser console.

console.log("Hello from JavaScript!");

This prints text into the console.

Running JavaScript in an HTML Page

Put your JS inside a <script> tag:

<!DOCTYPE html>
<html>
<body>

  <h1>My First JS Page</h1>

  <script>
    console.log("JS is working!");
    alert("Hello!");
  </script>

</body>
</html>

Changing Text on the Page

JavaScript can edit HTML live:

<h1 id="title">Old Text</h1>

<script>
document.getElementById("title").innerText = "New Text!";
</script>

Handling Events (Clicks, Key Presses, etc.)

<button onclick="clicked()">Click Me</button>

<script>
function clicked() {
  alert("Button clicked!");
}
</script>

Variables in JavaScript

Used to store values:

let name = "Kaloyan";
let age = 12;

console.log(name);
console.log(age);

Simple Math Example

let a = 10;
let b = 5;

console.log(a + b);   // 15
console.log(a * b);   // 50

Why JavaScript Is Important

All modern websites rely on it. If you want to build dashboards, tools, animations, games, or apps — JavaScript is required.

What’s Next?

The next tutorial teaches you the basics of CSS, the language used to style your HTML pages.