Introduction to JavaScript

JavaScript is a lightweight, interpreted programming language that runs directly in web browsers. It is one of the three core technologies of the web — alongside HTML and CSS — and it brings web pages to life by making them interactive and dynamic.

Whether a button click opens a dropdown menu, an image slider moves automatically, or a form validates input before submission — all of that is powered by JavaScript.

What is JavaScript?

JavaScript (often abbreviated as JS) was created in 1995 by Brendan Eich while working at Netscape Communications. Originally designed to add simple interactivity to web pages, it has grown into one of the most popular and widely used programming languages in the world.

Today, JavaScript runs not just in browsers but also on servers (using Node.js), in mobile applications, desktop software, and even IoT (Internet of Things) devices.

Why Learn JavaScript?

It is the language of the web — Every modern browser understands JavaScript natively. No installation required.
Beginner-friendly — Getting started with JavaScript requires just a browser and a text editor.
Highly versatile — JavaScript can handle front-end (what users see) and back-end (server logic) development.
Huge community — Millions of developers use JavaScript, which means endless tutorials, libraries, and support.
High demand — JavaScript developers are among the most hired in the tech industry worldwide.

What Can JavaScript Do?

JavaScript can perform a wide range of tasks on a web page:

Change HTML content and styles dynamically
Respond to user actions like clicks, typing, and scrolling
Validate form data before sending it to the server
Fetch data from a server without refreshing the page (AJAX)
Create animations and visual effects
Store data locally in the browser
Build full-featured web applications

JavaScript vs HTML vs CSS

These three technologies work together to build a complete web page:

Technology	Role	Example
HTML	Structure of the page	Headings, paragraphs, buttons
CSS	Visual styling	Colors, fonts, layout
JavaScript	Behavior and interactivity	Click actions, form validation, animations

How JavaScript Works in a Browser

When a browser loads a web page, it reads the HTML file from top to bottom. When it encounters a JavaScript code block, it passes that code to the JavaScript engine (like V8 in Chrome or SpiderMonkey in Firefox). The engine interprets and executes the code, producing the desired result on the page.

This entire process happens within milliseconds, making web pages feel instant and responsive.

Where to Write JavaScript

JavaScript code can be written in three different places:

1. Inline (inside an HTML tag)

<button onclick="alert('Hello!')">Click Me</button>

2. Internal Script (inside a <script> tag in the HTML file)

<script>
  alert("Welcome to JavaScript!");
</script>

3. External File (a separate .js file linked to HTML)

<!-- In HTML file -->
<script src="script.js"></script>

// In script.js file
alert("JavaScript loaded from external file!");

For real projects, using an external file is the best approach. It keeps the HTML clean and the JavaScript reusable across multiple pages.

First JavaScript Program

Let's write the classic first program that every programmer writes — displaying a message.

<!DOCTYPE html>
<html>
  <head>
    <title>My First JavaScript</title>
  </head>
  <body>
    <h1>Hello World</h1>

    <script>
      console.log("Hello, World!");
    </script>
  </body>
</html>

What happens here? The console.log() statement sends the text "Hello, World!" to the browser's developer console. To see it, press F12 in your browser and click on the "Console" tab.

Tools Needed to Get Started

No special software is needed to start learning JavaScript. Here is what's required:

A web browser — Google Chrome, Firefox, or Edge. Chrome is highly recommended for its excellent developer tools.
A code editor — VS Code (Visual Studio Code) is the most popular and free choice. Notepad also works for simple experiments.
Browser Developer Tools — Press F12 in any browser to open the developer tools. The Console tab is where JavaScript output appears.

JavaScript Versions (ECMAScript)

JavaScript follows a standard called ECMAScript (ES). Different versions have introduced new features over the years:

ES5 (2009) — The widely supported baseline version
ES6 / ES2015 — A major update that introduced let, const, arrow functions, classes, and more
ES2016 to ES2024 — Yearly updates with smaller but useful additions

Modern JavaScript development primarily uses ES6 and above. Throughout this tutorial, ES6+ syntax will be covered alongside the basics.

Key Points to Remember

JavaScript is a programming language that runs in the browser
It is used to make web pages interactive and dynamic
JavaScript code can be written inline, internally, or in an external file
The browser console is the best place to test and debug JavaScript code
JavaScript follows the ECMAScript standard, with ES6 being a major milestone

Back to courses

Next lessons