Introduction to JavaScript

What Is JavaScript?

JavaScript is a high-level, interpreted, dynamically typed programming language. It was originally designed to add interactivity to web pages but has since grown into one of the most versatile languages in existence — running in browsers, on servers, in mobile apps, and even on embedded devices.

Every website you visit almost certainly runs JavaScript. It is the only programming language that runs natively in web browsers, which gives it unmatched reach. Unlike most languages that dominate in a single domain, JavaScript is genuinely full-stack: the same language handles button clicks in the browser and database queries on the server.

A Brief History

JavaScript was created by Brendan Eich at Netscape Communications in just 10 days in 1995. It shipped in Netscape Navigator 2.0 under the name Mocha, then LiveScript, and finally JavaScript — timed to ride the hype of Sun’s Java. Despite its rushed origins, the language has evolved dramatically through a standardization body called ECMA International, which publishes annual updates to the specification.

The annual release cadence since ES2015 means the language evolves steadily without the decade-long gaps of the early years.

How JavaScript Runs

Every modern browser ships a JavaScript engine: Chrome uses V8, Firefox SpiderMonkey, Safari JavaScriptCore. They compile JavaScript to machine code while it runs (JIT, just-in-time compilation), which is why a dynamically typed language is fast enough for the web. In 2009 Ryan Dahl embedded V8 in a C++ runtime called Node.js, giving JavaScript the filesystem, the network and the OS — so the same language now runs on both sides of the wire.

Throughout this series every example is a complete file you run with node (the next lesson installs it), followed by exactly what it printed.

console.log("Hello, World!");
console.log("2 + 2 =", 2 + 2);
console.log("Running on Node", process.version, "on", process.platform);
console.log(typeof window === "undefined" ? "no browser window here" : "in a browser");

$ node hello.js
Hello, World!
2 + 2 = 4
Running on Node v22.22.2 on linux
no browser window here

console.log accepts any number of arguments and prints them separated by spaces. process exists only in Node, and window exists only in browsers — the language is the same, but each environment provides different built-in objects. (Paste the first two lines into your browser’s DevTools console, F12 → Console, and they work there too.)

A Web Server in Ten Lines

Node’s standard library includes an HTTP server, so a working backend needs no framework.

const http = require("node:http");

const server = http.createServer((req, res) => {
  res.writeHead(200, { "Content-Type": "text/plain" });
  res.end(`Hello from Node.js — you asked for ${req.url}\n`);
});

server.listen(3000, () => {
  console.log("Server running at http://localhost:3000");
});

$ node server.js & sleep 1; curl -s http://localhost:3000/about; kill $!
Server running at http://localhost:3000
Hello from Node.js — you asked for /about

The command starts the server in the background, requests /about with curl, then stops it. The server’s own log line prints first, then curl prints the response body. Normally you’d run just node server.js and visit the URL in a browser; the process keeps running — waiting for requests — until you press Ctrl+C. That “stay alive while there’s something to wait for” behaviour is the event loop, which later lessons explain.

Where JavaScript Is Used

The same core language underlies all of these, so what you learn here transfers:

• Frontend web — React, Vue, Svelte, or plain DOM code for interactive UIs
• Backend / APIs — Node.js with Express, Fastify or NestJS; also Deno and Bun
• Mobile apps — React Native, Expo
• Desktop apps — Electron powers VS Code, Slack and Discord
• Serverless / edge — Cloudflare Workers, AWS Lambda, Vercel Functions
• Build tooling — Vite, ESLint, Prettier, webpack

The Ecosystem: npm

npm ships with Node.js and is the package registry nearly every JavaScript project depends on. A project is described by its package.json:

$ mkdir my-app && cd my-app && npm init -y >/dev/null && cat package.json
{
  "name": "my-app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

npm init -y accepts every default and writes this file. npm install <package> adds an entry under dependencies and downloads the code into node_modules/; "scripts" holds commands you run with npm run <name>. The generated test script deliberately fails until you replace it with a real one.

A Taste of Modern JavaScript

This fetches a list of users over HTTP, keeps two fields from each, and prints them. So that it runs offline, it first starts a tiny local server to fetch from.

import http from "node:http";

const users = [
  { id: 1, name: "Ada Lovelace", email: "ada@example.com", phone: "555-0100" },
  { id: 2, name: "Alan Turing", email: "alan@example.com", phone: "555-0101" },
  { id: 3, name: "Grace Hopper", email: "grace@example.com", phone: "555-0102" },
];
const server = http.createServer((req, res) => res.end(JSON.stringify(users))).listen(0);

const fetchUserNames = async (limit = 2) => {
  const response = await fetch(`http://localhost:${server.address().port}/users`);
  const all = await response.json();
  return all.slice(0, limit).map(({ name, email }) => ({ name, email }));
};

const picked = await fetchUserNames();
picked.forEach((user) => console.log(`${user.name} — ${user.email}`));
console.log(picked);
server.close();

$ node taste.mjs
Ada Lovelace — ada@example.com
Alan Turing — alan@example.com
[
  { name: 'Ada Lovelace', email: 'ada@example.com' },
  { name: 'Alan Turing', email: 'alan@example.com' }
]

Even if the syntax is new, the shape reads plainly: fetch, parse the JSON, keep the fields you need, print. async/await makes network code read top to bottom; ({ name, email }) => ({ name, email }) destructures each user and builds a smaller object, dropping id and phone. The file ends in .mjs so Node treats it as an ES module, which allows import and a top-level await. You’ll be writing code like this within a few lessons.

JavaScript vs. TypeScript

TypeScript adds type annotations to JavaScript and is checked before the code runs. Recent Node versions can run a .ts file directly by stripping the types.

function greet(name: string): string {
  return `Hello, ${name}!`;
}

console.log(greet("Ada"));
console.log(greet(42 as any));

$ node greet.ts
Hello, Ada!
Hello, 42!

The second call prints happily: Node only removes the annotations — it does not check them. Catching greet(42) is the job of the TypeScript compiler (tsc) or your editor, before you run anything; here as any was needed just to get past that check. At runtime, TypeScript is JavaScript, which is why learning JavaScript first pays off.

Practice

console.log("Ada");
console.log(new Date().getFullYear());
console.log(7 * 6);

$ node p1.js
Ada
2026
42

const http = require("node:http");

http.createServer((req, res) => {
  if (req.url === "/") {
    res.end("home\n");
  } else {
    res.writeHead(404);
    res.end("not found\n");
  }
}).listen(3000);

$ node p2.js & sleep 1; curl -s -w "%{http_code}\n" localhost:3000/; curl -s -w "%{http_code}\n" localhost:3000/x; kill $!
home
200
not found
404

const all = [
  { id: 1, name: "Ada Lovelace", email: "ada@example.com", phone: "555-0100" },
  { id: 2, name: "Alan Turing", email: "alan@example.com", phone: "555-0101" },
  { id: 3, name: "Grace Hopper", email: "grace@example.com", phone: "555-0102" },
];
const picked = all.slice(0, 3).map(({ name, email, phone }) => ({ name, email, phone }));
picked.forEach((u) => console.log(`${u.name} — ${u.email} — ${u.phone}`));

$ node p3.js
Ada Lovelace — ada@example.com — 555-0100
Alan Turing — alan@example.com — 555-0101
Grace Hopper — grace@example.com — 555-0102

What’s Next

The next lesson sets up your environment — installing Node.js, configuring an editor, and running your first scripts.