CoursePart 0 — The On-RampLesson 0.4
Lesson 0.4Part 0 — The On-Ramp

Install everything

Node.js, VS Code, and your first project folder — hand-held for Windows and macOS.

Lesson 0.4of 24
Next

Step 1

The idea

01

Before a chef can cook, they need a kitchen — an oven, a knife, a chopping board. Before you can write automation, you need three things on your computer:

  • Node.jsThe engine that runs JavaScript on your computer (outside of a browser).
  • VS CodeThe editor where you write your code — like Microsoft Word, but for code.
  • A project folderThe place where all your files live together.

This lesson installs all three. Take your time — you only do this once.

Step 2

See it run

02

By the end of this lesson, you'll type this command and see a version number — proof that Node.js is installed and ready:

Terminal — your target
$ node --version
v22.x.x        ← you'll see something like this

That output means your computer can now run JavaScript. Everything else follows from this.

Step 3

Now you try

03

Follow every step below for your operating system. Each step has a screenshot placeholder — those images will guide you exactly where to click.

🪟 Windows

Step 1 — Download Node.js

  1. Open your browser and go to nodejs.org
  2. Click the big green LTS button (Long Term Support — the stable version)
  3. A .msi file will download
📸

[SCREENSHOT: nodejs.org homepage with the LTS download button highlighted]

Step 2 — Install Node.js

  1. Double-click the downloaded .msi file
  2. Click Next on every screen — the defaults are fine
  3. Click Install, then Finish
📸

[SCREENSHOT: Node.js Windows installer showing the Next button]

Step 3 — Verify Node.js

  1. Press Win + R, type cmd, press Enter
  2. In the black window that opens, type: node --version
  3. Press Enter — you should see v22.x.x
📸

[SCREENSHOT: Windows Command Prompt showing node --version output]

Step 4 — Download VS Code

  1. Go to code.visualstudio.com
  2. Click Download for Windows
  3. Run the installer — click Next/Install/Finish as before
📸

[SCREENSHOT: VS Code download page for Windows]

Step 5 — Create your project folder

  1. Open VS Code
  2. Click File → Open Folder
  3. Navigate to Desktop (or Documents), click New Folder, name it playwright-course
  4. Click Select Folder
📸

[SCREENSHOT: VS Code with the playwright-course folder open in the sidebar]

🍎 macOS / Linux

Step 1 — Install Node.js via the official installer

  1. Go to nodejs.org and download the LTS .pkg for macOS
  2. Open the downloaded file and follow the installer steps
  3. Linux: run sudo apt install nodejs npm in the terminal
📸

[SCREENSHOT: nodejs.org LTS download button for macOS]

Step 2 — Verify Node.js

  1. Open Terminal (search Spotlight with Cmd+Space, type Terminal)
  2. Type node --version and press Enter
  3. You should see v22.x.x
📸

[SCREENSHOT: macOS Terminal showing node --version output]

Step 3 — Install VS Code

  1. Go to code.visualstudio.com and download for macOS
  2. Open the .dmg, drag VS Code to Applications
📸

[SCREENSHOT: macOS VS Code installation — drag to Applications]

Step 4 — Create your project folder

  1. Open VS Code → File → Open Folder
  2. Create a new folder called playwright-course on your Desktop
  3. Select it
📸

[SCREENSHOT: VS Code on macOS with playwright-course folder open]

🎉Win!
If you see a version number after running node --version and VS Code opens with your folder — you're done! Your kitchen is ready.

Step 4

Why a tester cares

04

Everything in this course runs through Node.js and VS Code. When you reach Lesson 1.18 and install Playwright, you'll type:

Terminal — inside VS Code
$ npm init playwright@latest

That command only works because Node.js (and its package manager npm) is installed. Without this setup, nothing else in the course works.

Recap

3 key points
  • 1Node.js lets your computer run JavaScript files outside of a browser.
  • 2VS Code is the editor where you'll write every file in this course.
  • 3Your playwright-course folder is your workspace — everything lives here.

Up next

Lesson 0.5 — The terminal, demystified
Previous
What a website is made of
Next
The terminal, demystified