Introduction to JavaScript

JavaScript (JS) is the programming language of the web. HTML gives a page its structure, CSS makes it look good, and JavaScript makes it do things — respond to clicks, validate forms, fetch data, animate, and power entire applications like Gmail, Figma and VS Code.

Despite the name, JavaScript has nothing to do with Java. The similar name was a 1990s marketing decision. The official standard is called ECMAScript; a new edition (ES2023, ES2024, ES2025…) is published every year.

In this course you'll go from your very first line of code to asynchronous programming, APIs, Node.js and TypeScript. Everything uses modern JavaScript (ES2023+), which every current browser and Node.js LTS supports.

Where JavaScript runs#

• In the browser — every modern browser contains a JS engine: V8 in Chrome and Edge, SpiderMonkey in Firefox, JavaScriptCore in Safari. Browser JS can change the page (the DOM), react to events and talk to servers.
• Outside the browser — runtimes like Node.js, Deno and Bun run JavaScript on servers and your laptop. They power web servers, command-line tools, build tools (like Vite) and desktop apps (like VS Code, built with Electron).

The language is the same everywhere. What changes is the set of built-in tools: browsers give you document and window; Node gives you file-system and networking modules like node:fs.

Try it right now: the browser console#

Open your browser's developer tools — press F12, or Ctrl+Shift+J (Windows/Linux) / Cmd+Option+J (Mac) in Chrome or Edge, Ctrl+Shift+K in Firefox — and click the Console tab. Type each line and press Enter:

console.log("Hello, Elephantoo!");
2 + 2;
"Java" + "Script";
Math.max(3, 17, 9);

Hello, Elephantoo!
4
'JavaScript'
17

The console evaluates each line and prints the result. It's the fastest way to experiment, and you'll use it constantly for debugging. Press the up arrow to recall earlier lines.

Tip: Pasting code into the console of a site you don't trust is a classic scam. Only run code you understand.

Adding JavaScript to a web page#

Real projects keep JavaScript in .js files. Create a folder with two files. First index.html:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>My first JS page</title>
    <script src="app.js" defer></script>
  </head>
  <body>
    <h1 id="title">Hello!</h1>
  </body>
</html>

And app.js beside it:

console.log("app.js loaded");
const title = document.querySelector("#title");
title.textContent = "Hello from JavaScript!";

Open index.html in your browser: the heading changes, and the console shows app.js loaded.

Why defer?

Without it, the browser stops building the page to download and run the script — and if the script runs before <h1> exists, querySelector returns null. defer downloads the file in parallel and runs it after the HTML has been parsed. Alternatives:

Running JavaScript with Node.js#

Install Node.js LTS (Long-Term Support). The official site, nodejs.org, has installers for Windows and macOS. On Linux, use your distribution's packages or a version manager:

# Ubuntu / Debian (may be an older version)
sudo apt install nodejs npm

# Fedora
sudo dnf install nodejs

# Any OS: nvm lets you install and switch versions
nvm install --lts

Check it works:

node --version
npm --version

Save this as hello.js:

const name = "Elephantoo";
const year = new Date().getFullYear();
console.log(`Hello from Node, ${name}!`);
console.log(`It is ${year}.`);

And run it:

node hello.js

Hello from Node, Elephantoo!
It is 2026.

Typing just node opens a REPL (Read-Eval-Print Loop) — an interactive console like the browser's. Type .exit or press Ctrl+D to leave.

Statements, semicolons and comments#

A program is a list of statements, run top to bottom:

// A single-line comment
/*
  A multi-line comment
*/
const language = "JavaScript"; // statements usually end with ;
console.log(`I am learning ${language}`);
console.log("Line two runs after line one");

I am learning JavaScript
Line two runs after line one

Semicolons are mostly optional thanks to automatic semicolon insertion (ASI), but ASI has corner cases. This course uses semicolons everywhere; whichever style you choose, let a formatter such as Prettier enforce it.

JavaScript is case-sensitive: console.log works, Console.Log throws an error.

Reading error messages#

Mistakes are normal. Try this in the console:

consol.log("oops");

Uncaught ReferenceError: consol is not defined

The error type (ReferenceError), the message and the line number tell you exactly where to look. Learning to read errors calmly is one of the most valuable skills in programming — there's a whole lesson on debugging later.

Common beginner mistakes#

• Opening the wrong file. Edit app.js, then refresh the browser (Ctrl+R/Cmd+R) to see changes.
• Forgetting defer and getting Cannot read properties of null.
• Using curly "smart quotes" copied from a word processor. Code needs straight quotes: " or '.
• Mixing up browser and Node APIs. document doesn't exist in Node, and require("fs") doesn't exist in the browser.

What's next#

You can now run JavaScript in the console, in a web page and with Node.js. Next, you'll learn how to store data in variables and meet JavaScript's types.