JavaScript is the programming language of the web. Every interactive button, form validation, animation, and single-page application relies on JavaScript running in the browser. With Node.js, the same language also powers servers, CLI tools, and mobile apps.

What is JavaScript?

JavaScript was created by Brendan Eich in 1995 in just 10 days for Netscape Navigator. Originally meant to add interactivity to static HTML pages, it has grown into a full general-purpose language standardized as ECMAScript.

The three pillars of front-end web development:

Technology Role
HTML Structure and content
CSS Visual presentation
JavaScript Behavior and interactivity

Today JavaScript also runs on servers (Node.js), in mobile apps (React Native), and on embedded devices.

How JavaScript Runs

In the browser:

  HTML page loads → Browser parses HTML/CSS → Downloads JS → JS engine executes

On the server (Node.js):

  HTTP request → Node.js event loop → Your JS code → Response

Both environments share the same language syntax, but the available APIs differ. Browsers provide document and window; Node.js provides fs and http.

Your First JavaScript

Inline in HTML:

  <!DOCTYPE html>
<html>
<head><title>JS Demo</title></head>
<body>
  <button id="btn">Click me</button>
  <p id="output"></p>

  <script>
    document.getElementById('btn').addEventListener('click', () => {
      document.getElementById('output').textContent = 'Hello, JavaScript!';
    });
  </script>
</body>
</html>

In a separate file (preferred):

  <script src="app.js" defer></script>
  
  // app.js
const button = document.querySelector('#btn');
const output = document.querySelector('#output');

button.addEventListener('click', () => {
  output.textContent = `Clicked at ${new Date().toLocaleTimeString()}`;
});

Variables and Data Types

Modern JavaScript uses let and const (avoid var in new code):

  const PI = 3.14159;       // constant — cannot reassign
let count = 0;            // block-scoped, reassignable
count += 1;

const name = 'Alice';     // string
const age = 30;           // number
const isActive = true;    // boolean
const items = [1, 2, 3];  // array
const user = { id: 1, name: 'Alice' };  // object

Type checking:

  typeof name;     // "string"
typeof age;      // "number"
Array.isArray(items);  // true

Functions 

  // Function declaration
function add(a, b) {
  return a + b;
}

// Arrow function (common in modern code)
const multiply = (a, b) => a * b;

// Default parameters
function greet(name = 'World') {
  return `Hello, ${name}!`;
}

console.log(greet());        // Hello, World!
console.log(greet('Simon')); // Hello, Simon!

Control Flow 

  const scores = [85, 42, 91, 73, 58];
const passing = scores.filter(s => s >= 60);

for (const score of passing) {
  console.log(`Pass: ${score}`);
}

// Output: Pass: 85, Pass: 91, Pass: 73

Learning Path on GazeHub

This track is organized in stages:

Stage 1: JavaScript Language Fundamentals

Variables, data types, operators, functions, scope, closures, objects, arrays, and ES6+ features. No browser-specific APIs yet — pure language skills that apply everywhere.

After Stage 1 you can solve algorithmic problems and write Node.js scripts.

Stage 2: JavaScript in the Browser

DOM manipulation, events, fetch API, storage, and accessibility. This is front-end development — making web pages interactive and responsive.

Frameworks like React, Vue, and Angular build on these fundamentals. Learn the basics first; frameworks come later.

Stage 3: Server and Mobile

  • Node.js — backend APIs, file I/O, databases (Node.js track)
  • React Native / Ionic — cross-platform mobile apps

Practice Matters

Reading alone does not build fluency. Each section includes exercises. Type the examples yourself, break them intentionally, and fix the errors. Use the browser Console or Node.js REPL:

  node
> [1, 2, 3].map(x => x * 2)
[ 2, 4, 6 ]

JavaScript vs Other Languages

JavaScript vs Python: Both are dynamically typed. JavaScript is the only language native to browsers. Python dominates data science. Syntax differs but concepts (functions, objects, async) transfer between them.

JavaScript vs TypeScript: TypeScript is a superset of JavaScript that adds static types. It compiles to JavaScript and is standard in large front-end codebases. Learn JavaScript first, then TypeScript.

What Comes Next

Install your environment in Installing JavaScript, then proceed through variables, operators, control flow, and functions. By the end of this track you will build interactive web applications and understand the foundation every JavaScript framework relies on.