JS Introduction

Think of a web page built with only HTML and CSS as a beautifully printed poster, it looks great, but it can never react to you. Nothing moves, nothing responds, nothing changes after it's printed. JavaScript is what turns that poster into something alive. It's the programming language that runs inside your browser and lets a page respond to clicks, validate a form before it's submitted, update content without reloading, and generally behave like a real application instead of a static document. Today JavaScript runs almost everywhere, not just in browsers on cookiescursor.com around the world, but also on servers, in mobile apps, and even on small devices, all using the same core language.

In this page:

What JavaScript Is
Why JavaScript Exists
What JavaScript Can Do
JavaScript in the Browser vs on the Server
JavaScript Versions

What JavaScript Is

JavaScript is a lightweight, interpreted programming language that browsers understand natively, letting developers control page behavior, respond to user actions, and update content dynamically.

Note: You don't need to install anything to try JavaScript, every modern browser has a built-in console where you can run it instantly.

Warning: JavaScript code placed directly in HTML runs as soon as the browser reaches it, so placement in the page matters for what elements are available yet.

Example: What JavaScript Is

javascript

document.body.style.backgroundColor = "lightyellow";
console.log("JavaScript updates the page without reloading it.");

Why JavaScript Exists

JavaScript was created to make web pages interactive without needing a full page reload for every action, letting a page validate input, animate elements, and fetch new data on the fly.

Note: Whenever a webpage responds to you instantly, whether it's a dropdown menu or a live search, that instant reaction is almost always JavaScript at work.

Warning: Overusing JavaScript for things HTML and CSS already handle well, like simple layout, can make a page slower and harder to maintain.

Example: Why JavaScript Exists

javascript

document.body.addEventListener("click", function () {
  // Print "Page responded instantly, no reload needed." to the console
  // Print "Page responded instantly, no reload needed." to the console
  console.log("Page responded instantly, no reload needed.");
});

What JavaScript Can Do

Beyond simple interactivity, JavaScript can manipulate every part of a webpage, fetch data from other servers, store information in the browser, and build entire applications that feel like desktop software.

Note: Start by exploring small, visible effects like toggling a menu, they build the foundation for larger applications later.

Warning: JavaScript has access to a lot of browser capability, so scripts from untrusted sources can pose real security risks, always review third party code carefully.

Example: What JavaScript Can Do

javascript

// Assign "<p>Content added dynamically by JavaScript.</p>" to `document.body.innerHTML`
// Assign "<p>Content added dynamically by JavaScript.</p>" to `document.body.innerHTML`
document.body.innerHTML = "<p>Content added dynamically by JavaScript.</p>";
// Call `localStorage.setItem("visited", "true")`
// Call `localStorage.setItem("visited", "true")`
localStorage.setItem("visited", "true");
// Print `"Stored data:", localStorage.getItem("visited")` to the console
// Print `"Stored data:", localStorage.getItem("visited")` to the console
console.log("Stored data:", localStorage.getItem("visited"));

JavaScript in the Browser vs on the Server

Client-side JavaScript runs inside a visitor's browser to control what they see and interact with, while server-side JavaScript, using environments like Node.js, runs on a server to handle requests, talk to databases, and prepare data before it ever reaches a browser.

Note: The same JavaScript syntax you learn for the browser transfers directly to server-side environments like Node.js, one language for both sides.

Warning: Browser JavaScript cannot directly access a visitor's file system or a private database, those tasks are handled by server-side code for security reasons.

Example: JavaScript in the Browser vs on the Server

javascript

// Client-side JavaScript runs inside the browser
console.log("Running in the browser, window exists:", typeof window !== "undefined");
// Server-side JavaScript (Node.js) runs on a server instead, with no window object

JavaScript Versions

JavaScript is standardized as ECMAScript, and the language has evolved through numbered editions, with ES6 (2015) introducing major features like let, const, arrow functions, and classes that are now considered standard modern JavaScript.

Note: When tutorials mention ES6 or 'modern JavaScript', they are referring to the syntax introduced in and after the 2015 ECMAScript update.

Warning: Very old browsers may not support the newest JavaScript syntax, for international audiences with varied devices, checking compatibility tables is worthwhile for critical features.

Example: JavaScript Versions

javascript

// ES6 (2015) introduced let, const, arrow functions, and classes
const greet = (name) => `Hello, ${name}!`;
console.log(greet("World"));

Live Example

Chapter Quiz — Complete all 12 topics to unlock

0/12 topics done

Complete these topics first:

Next Lesson → JS Where To

JS Introduction

What JavaScript Is

Why JavaScript Exists

What JavaScript Can Do

JavaScript in the Browser vs on the Server

JavaScript Versions

Chapter Quiz — Complete all 12 topics to unlock

Login to run this code