1.4 Running Your First Code — The Complete JavaScript Course

Your workshop is set up — time to actually run some JavaScript. In this lesson you'll execute code three different ways, learn the two kinds of "sentence" the language is made of, and read your first error message without flinching. By the end, the mystery is gone: you'll know exactly what happens between pressing Enter and seeing an answer.

The DevTools console is a REPL

Open the DevTools Console (Cmd+Option+I / F12 — lesson 1.3) on any page and you have a REPL: a Read–Eval–Print Loop. It reads what you type, evaluates it, prints the result, and loops back for more. It's a conversation with the engine:

› 2 + 2
  4
› "java" + "script"
  'javascript'

Notice you didn't ask it to print anything — a REPL automatically echoes the value of whatever you type. This page's playgrounds work the same way, and that instant question → answer rhythm is the fastest learning tool you own. Professionals keep a console open for quick experiments their whole careers.

"Hello, world" three ways

The same one-line program, run in the three places JavaScript lives:

1 — In the console. Type it into the DevTools Console (or the playground below):

console.log("Hello, world!");

→ Hello, world! — console.log(...) is the "print this" tool you'll use ten thousand times. Unlike a bare expression, it works in every environment, not just a REPL.

2 — In a web page. JavaScript's original home is inside HTML, via a <script> tag. Save this as hello.html in your learn-js folder and double-click it, then check the DevTools Console:

<!doctype html>
<title>My first program</title>
<script>
  console.log("Hello from a web page!");
</script>

3 — With Node. Save the one-liner as hello.js and run it from the terminal:

node hello.js
# Hello from a web page? No — this one prints: Hello, world!

Three environments, one language. This course's playgrounds are environment #1, live on the page.

Statements vs. expressions

JavaScript programs are built from two kinds of pieces, and telling them apart pays off for years:

An expression is anything that produces a value: 2 + 2, "java" + "script", 7 * 6. Ask "does this become a value?" — yes means expression.
A statement is a complete instruction, a sentence of the program: console.log(42); — "do this thing."

A REPL echoes expressions. Statements are for making things happen. Most statements contain expressions — console.log(7 * 6) is a statement wrapping the expression 7 * 6.

And the period at the end of the sentence? The semicolon. Here's the honest story: JavaScript has automatic semicolon insertion (ASI) — the engine will quietly add most missing semicolons for you, and it usually guesses right. "Usually" is doing dangerous work in that sentence, so professionals pick a lane and stay in it. This course always writes semicolons — it's the most common professional convention, and it means you never have to memorize ASI's edge cases.

Try it — a conversation with the engine

Run the script, then keep the conversation going: type an expression like 6 * 7 or "ba" + "nana" at the › prompt below the console and press Enter. The value echoes back — that's the REPL loop in action.

javascript — live consolereal engine

⌘/Ctrl + Enter to run

Reading your first error message without panic

Type a typo on purpose — in the playground above, change console to consol and run it. You'll get:

consol.log("Hello, world!");

→ Uncaught ReferenceError: consol is not defined — plus the line number where it happened.

Untrained eyes see a scary red wall. Trained eyes see a structured report, read in three steps:

The name — ReferenceError = "you used a name I've never heard of." (Grammar mistakes are SyntaxError; using things the wrong way is usually TypeError. You'll collect the full set in Section 9.)
The message — consol is not defined: the engine literally tells you which name it couldn't find.
The location — the line (and file) where it happened, so you know where to look.

Errors aren't the machine scolding you — they're the machine helping you, with surprising precision. Making friends with them now is one of the highest-leverage habits in this whole course.

Next lesson, the real language begins: values, and the two little keywords — let and const — that hold them.

Checkpoint

Answer all three to mark this lesson complete

Running Your First Code