Skip to content

Introduction to JavaScript

💡
Before you start

You need nothing but the computer in front of you and about fifteen minutes. No account, no payment, no prior programming. JavaScript already runs in the browser you are reading this in — but you will also install Node, because running JavaScript from a file is how everything else on this site's JavaScript path works. This page is the starting point for all of them.

What is JavaScript?

JavaScript is the programming language of the web. Every website you visit uses JavaScript to create interactive experiences — from dropdown menus and form validation to complex web applications like Gmail, YouTube, and Google Maps.

Unlike Python which runs on your computer, JavaScript was originally designed to run inside web browsers. Today it also runs on servers (Node.js), mobile apps, and desktop applications.

💡
JavaScript is NOT Java

Despite the similar name, JavaScript and Java are completely different languages. JavaScript was named during the 1990s when Java was popular — it was a marketing decision, not a technical one.

Where JavaScript Runs

  • Browser: Every modern browser has a built-in JavaScript engine (Chrome uses V8, Firefox uses SpiderMonkey)
  • Server: Node.js lets you run JavaScript outside the browser
  • Mobile: React Native and similar frameworks build mobile apps with JavaScript
  • Desktop: Electron framework powers apps like VS Code and Discord

Your First JavaScript

Method 1: Browser Console (Fastest)

1
Open any web browser (Chrome, Firefox, Edge)
2
Open Developer Tools: Press F12 or Ctrl + Shift + J
3
Click the Console tab and type:
console.log("Hello, World!");

Press Enter and you'll see Hello, World! printed below. The console is JavaScript's equivalent of Python's interactive shell.

// Try some more
console.log(2 + 3);                    // 5
console.log("JavaScript" + " rocks");  // JavaScript rocks
alert("Welcome!");                     // Shows a popup dialog

Method 2: HTML File

JavaScript is typically embedded in HTML pages. Create a file called index.html:

<!DOCTYPE html>
<html>
<head>
    <title>My First JS Page</title>
</head>
<body>
    <h1 id="greeting">Hello!</h1>
    <button onclick="changeText()">Click Me</button>

    <script>
        function changeText() {
            document.getElementById("greeting").textContent = "You clicked the button!";
        }
    </script>
</body>
</html>

Open this file in your browser and click the button — the heading text changes! This is JavaScript manipulating the page in real time.

JavaScript vs Python: Key Differences

// JavaScript uses:
let name = "Alice";         // let/const for variables (not just name = )
console.log(name);          // console.log (not print)
// Semicolons at end of lines (optional but recommended)
// Curly braces {} for code blocks (not indentation)
// camelCase naming (not snake_case)

// Python equivalent:
// name = "Alice"
// print(name)

Comments

// Single-line comment

/* Multi-line
   comment */

// Comments are ignored by JavaScript
// Use them to explain your code

The console Object

console.log("Regular message");        // Standard output
console.warn("Warning message");       // Yellow warning
console.error("Error message");        // Red error
console.table(["apple", "banana"]);    // Display as table
console.time("timer");
// ...some code...
console.timeEnd("timer");             // Shows elapsed time

Now Do It Yourself: Five Steps

JavaScript runs in two places: inside a web page, and on your own machine through Node. You will use both, because they teach different halves of the same language. Every output below is exactly what Node printed.

1
Run JavaScript with no installation at all

Go: in the browser you are reading this in, press F12. On macOS use Cmd + Option + I. A panel opens; click the tab labelled Console.

Do: type 2 + 2 and press Enter. Then type alert("hello") and press Enter.

You should see: 4, and then a dialog box appear on the page. You just ran code inside a real web page — no editor, no installation, no file.

If not: if F12 does nothing, find Developer Tools in the browser's menu instead. If the console shows a warning about pasting, that is a scam protection — type the command rather than pasting it, which is exactly what the warning is asking for.

2
Check whether Node is already on your machine

Go: open a terminal. Windows: Start menu, type powershell. macOS: Cmd + Space, type terminal. Linux: Ctrl + Alt + T.

Do: type node --version and press Enter.

You should see: a version such as v22.23.1. Anything from v18 upward runs everything on this site.

If not: command not found means Node is not installed. Get it from nodejs.org and choose the LTS build — that stands for long-term support, and it is the one to use unless you have a specific reason otherwise. After installing, close the terminal and open a new one: a terminal already running does not notice a newly installed program.

3
Run one line without making a file

Go: same terminal.

Do: run this exactly, quotes included.

node -e 'console.log("Hello, world!")'

You should see: Hello, world!. -e means "evaluate this string" and is the quickest way to test one idea. Note it is console.log here, not alert — there is no page and no dialog box outside a browser.

If not: on Windows PowerShell the single quotes behave differently — use double quotes outside and single inside: node -e "console.log('Hello, world!')". Quoting is the most common reason a one-liner that works in a tutorial fails on your machine.

4
Write it in a file and run that

Go: open a plain text editor. Windows: Notepad. macOS: TextEdit, then Format → Make Plain Text. Linux: Text Editor.

Do: type these two lines and save the file as hello.js in your home folder. In Notepad's Save dialog set "Save as type" to "All Files" first, or it saves hello.js.txt and will not run. Then in the terminal run cd ~ and node hello.js.

console.log("Hello from a file");
console.log(2 + 2);

You should see: Hello from a file then 4. That is a program you wrote, saved and ran.

If not: an error mentioning Cannot find module means Node looked where the terminal is standing and found nothing — read the path in the message, then cd to where you actually saved the file. If your editor added .txt, rename it; the .js must be the last thing in the name.

5
Break it on purpose, so errors stop being frightening

Go: open hello.js again.

Do: delete the closing quotation mark from the first line so it reads console.log("Hello from a file);, save, and run node hello.js again.

You should see: SyntaxError: Invalid or unexpected token, with the file and line number above it. Put the quote back, save, and it works again.

If not: if it still prints normally, the file did not save — check your editor's title bar for a dot or the word "edited". An error is not damage: JavaScript is telling you which character confused it, and the line number is nearly always where to look first.

🎉
Check yourself before moving on

Without scrolling up: why does alert("hi") work in step 1 but not in step 4? Answer: alert belongs to the browser, not to JavaScript. Node has no page and no dialog box, so outside a browser you use console.log.

Now do it without the page: write about.js that prints your name on one line and the result of a sum on the next, and run it. Same five moves as step 4, your content — then move on to variables.

Summary

  • JavaScript is the language of the web — it makes pages interactive
  • It runs in browsers, servers (Node.js), mobile apps, and desktop apps
  • Use the browser console (F12) for quick experiments
  • console.log() is JavaScript's version of print()
  • JavaScript uses let/const for variables, curly braces for blocks, and camelCase naming
🎉
Welcome to JavaScript!

You've written your first JavaScript code. In the next tutorial, you'll learn about variables, data types, and how JavaScript handles different kinds of data.