Values & Variables

Load the About Me page you just finished, and it does the same thing every time: nothing. It looks exactly as good five minutes from now as it does right this second. Nothing on it reacts to a click, a tap, or the time of day. That's about to change — welcome to The Wiring, the unit that makes a page actually do something.

The third pane: the script

Open the editor and there's a new pane next to html and css: the script. That's where JavaScript lives — the third material this course teaches, after a page's structure and its style. Real projects usually keep their JavaScript in its own separate file, loaded alongside the page; for this course, it lives right here in the script pane, wired straight to the page next to it.

A variable is a labeled wire

Think of your script as a wiring panel. Every value you want to use again — a score, a name, a count — needs a wire with a label on it, so your code can find it later. That labeled wire is a variable.

let power = 5;

let is the tool that installs a new wire. power is the label you're giving it. = 5 sends the value 5 down that wire. The semicolon just marks where the instruction ends — every JS instruction gets one.

Once a wire is installed, you can send a different value down it later:

power = 10;

No let the second time — that would try to install the same wire twice, and JavaScript won't allow it. You're not declaring a new wire, just sending new current through the one you already have.

Some wires you solder shut: const

Not every value should be reroutable. For a value that should never change, use const instead of let:

const deviceName = "porch-lamp";

const installs a wire and solders it in place. Try to send it a new value later — deviceName = "hallway-lamp"; — and the browser stops you with an error. That's not a bug. That's const doing exactly its job: guaranteeing this value stays put for the rest of the script.

Common mistake

= here doesn't mean "equals" the way it does in math class — it means "send this value down the wire." power = 10 doesn't ask whether power already equals 10; it just makes it so. (Lesson 4 has a different symbol, ===, for actually asking "are these equal?" — file that away for later.)

You've got two ways to wire a value into your script now: let for current that changes, const for current that doesn't. Next lesson looks at what actually flows through these wires — the different types of value JavaScript understands.

Install both in the lab first.