JavaScript Basics for Beginners

Why JavaScript, and where it runs

HTML gives a page structure and CSS gives it style, but JavaScript (JS) gives it behaviour. Every browser has a built-in JS engine, so you need nothing installed: press F12, open the Console tab, and you can run JavaScript right now. Later, the same language also runs on servers with Node.js — one language, everywhere.

Variables and data types

let name = "Ali";
let semester = 3;
const site = "Tahmeer Tech";
let isStudent = true;

Use let for values that change, const for values that should not. The main beginner types are strings (text), numbers, and booleans (true/false).

Decisions and loops

if (semester >= 3) {
  console.log(name + " can start building projects");
} else {
  console.log("Focus on foundations first");
}

for (let i = 1; i <= 3; i++) {
  console.log("Lesson " + i);
}

The if block chooses a path; the for loop repeats with a counter. These two ideas, plus variables, already cover most beginner programs in any language.

Functions and the DOM — your first interactive page

The DOM is the browser’s live model of your page. JavaScript can find elements and change them:

function sayHello() {
  let box = document.getElementById("msg");
  box.textContent = "Hello from JavaScript!";
}

Connect a button with onclick="sayHello()" and a paragraph with id="msg" — click, and the text changes. That single moment is the foundation of every interactive website.

Practice task (1 hour)

Build a marks calculator page: two input boxes (marks obtained, total marks), one button, and a result line. On click, calculate the percentage with a function and show a message — “Excellent” above 80, “Good” above 60, otherwise “Keep practising”. Style it with the CSS you already know.

Common mistakes to avoid

• Confusing = (assign) with === (compare) — in JS, always compare with ===
• Forgetting that values typed by the user are strings — convert with Number() before maths
• Writing JS before the HTML exists on the page — put scripts at the end of the body