JS Sketchbooksee JavaScript think ✏️
← back to the map
0

The Machine

foundation — everything stands on this

The big question: “What is a program, and how does JavaScript actually run?”

but why do we need this?

Why spend a whole phase before writing any code? Because everything confusing about programming becomes simple once you know what the machine actually does with your instructions. Learners who skip this end up memorizing spells that sometimes work; you’ll be giving orders you understand.

in plain words

Before writing a single line of code, meet the thing you’ll be talking to. A computer is incredibly fast, perfectly obedient, and has zero imagination — it does exactly what it’s told, nothing more. A program is simply a list of instructions for it, written down in advance.

JavaScript is one language for writing those instructions. When you open a website, your browser contains a little machine (called an engine) that reads JavaScript and performs it, line by line, top to bottom — millions of instructions per second.

In this phase there’s almost no code. Instead, you’ll watch how the machine thinks, so that later nothing it does feels like magic.

words you’ll own after this
program

A written list of instructions a computer follows, in order.

code

The text of those instructions, written in a language like JavaScript.

engine

The part of the browser that reads your JavaScript and actually performs it. Chrome’s is called V8.

console

A little window where your program can print messages to you — your first two-way conversation with the machine.

memory (RAM)

The machine’s short-term workspace: a huge wall of tiny numbered boxes where running programs keep things.

error

Not a failure — a message from the machine saying “I didn’t understand this part, here’s where I got stuck.”

after this phase, you can…
  • Explain to a friend what a program actually is
  • Say where JavaScript runs and what an engine does
  • Print a message with console.log
  • Read an error message calmly and find the line it points to
this phase’s lab — see it move

The bigger picture

Where your code goes and what happens to it. Step through with the buttons or ← → keys.

your codethe browser

Meet the cast. On the left: your code — an ordinary text file full of instructions you wrote. On the right: the browser, where everything will happen.

the lessons
  1. 0.1
    What is a program?

    A recipe of tiny instructions, executed stupidly fast.

  2. 0.2
    Where does JavaScript live?

    Browsers, engines, and what happens to your source code.

  3. 0.3
    Your first conversation with the machine

    console.log, and code running top to bottom.

  4. 0.4
    Memory: the wall of boxes

    RAM as a huge wall of numbered slots programs borrow.

  5. 0.5
    Errors are messages, not failures

    How to read an error like a note from the machine.