What JavaScript actually does
JavaScript runs directly in the browser, on the same page you built with HTML and CSS. It can change text, styles, and structure after the page has already loaded — something HTML and CSS alone can't do on their own. Every dropdown menu, live form validation, and "like" button you've ever clicked was JavaScript running behind the scenes.
Adding JavaScript to a page
Same pattern as CSS in Lesson 2 of the HTML & CSS course: you can write it inline, internally, or in an external file. External is standard for anything beyond a quick test.
Variables: storing information with a name
A variable is a labeled container for a piece of data. Modern JavaScript gives you two ways to create one:
Use const by default — it's safer because it prevents accidental reassignment. Only use let when you genuinely expect the value to change, like a counter or a running total.
var instead of let/const. It still works, but it has confusing quirks that modern JavaScript avoids entirely — there's no good reason to use it in new code today.
The core data types
| Type | Example | Used for |
|---|---|---|
| String | "hello" | Text — always in quotes |
| Number | 42, 3.14 | Any number — no separate type for decimals |
| Boolean | true, false | Yes/no, on/off logic |
| Array | ["a", "b", "c"] | An ordered list of values |
| Object | { name: "Alex", age: 25 } | Labeled data grouped together |
We'll go deep on arrays and objects in Lesson 3 — for now, just recognize them when you see them.
console.log: your best debugging friend
This is the single most-used line in every JavaScript developer's workflow. It prints a value where you can see it — open your browser's dev tools (right-click → Inspect → Console tab) to see it in action. When something isn't working, sprinkling console.log() around your code to see what's actually happening is the standard first move, not a beginner crutch.
Basic operators
= assigns a value. A triple === compares two values. Mixing these up is one of the most common bugs beginners write — if (age = 18) silently sets age to 18 instead of checking it, and doesn't throw an error, which makes it sneaky to spot.
Comments: notes JavaScript ignores
Try it yourself
<script> tags right before </body>. Inside, create three variables — your name, your age, and whether you're currently learning to code (true/false) — and console.log() each one. Open the browser console and confirm you see all three values.
Level up: build a mini profile
const variable that combines your name and age into one sentence using +, like "Alex is 25 years old", and log it. This is your first taste of building dynamic text from separate pieces of data — exactly what powers things like personalized greetings on real websites.
let or const, JavaScript has five core data types you'll use constantly, and console.log() is how you see what your code is actually doing. Everything else in this course builds on these basics.