Introduction to JavaScript

To understand JavaScript better, it is important to first understand how a website actually works inside a web browser. JavaScript does not work alone; it works as part of the web ecosystem.


How Does a Website Open in a Browser?

When you open any website, you are not opening a single thing.
You are actually opening a collection of files that run inside your web browser such as Chrome, Edge, or Firefox.

A website is created using instructions written by humans. These instructions are written using web languages like:

  • HTML
  • CSS
  • JavaScript

Your browser is designed to understand only specific languages.
If a language is not supported by the browser, the website will not work or display correctly.

In simple terms:

  • A website is a set of files
  • A browser reads those files
  • The browser shows the website on your screen

This is how every website you visit works.


What Problem Existed Before JavaScript?

Before JavaScript was introduced, websites were static.

What does static mean?

Static websites behave in a fixed way:

  • The page loads once
  • The page stays the same
  • Nothing changes unless the page is reloaded

How older websites worked

In early websites:

  • You opened a page
  • You read text
  • You saw images
  • You clicked a link
  • The entire page reloaded again

There was:

  • No instant response
  • No interaction
  • No dynamic behavior

Websites felt like online newspapers.
You could read them, but you could not interact with them.


How JavaScript Works in a Web Browser

JavaScript is a programming language that runs inside the web browser and controls what a website does while it is open.

JavaScript starts working after the page is loaded.

What JavaScript can do

JavaScript can:

  • Detect when a user clicks a button
  • Detect what text a user types
  • Make decisions based on user actions
  • Change text, images, and styles instantly
  • Send and receive data without reloading the page

Because of JavaScript, websites feel fast, responsive, and interactive.


Role of JavaScript in Web Development

JavaScript is not responsible for how a website looks.
JavaScript is responsible for how a website behaves.

Each web technology has a clear role:

  • HTML – Structure of the page
  • CSS – Design and appearance
  • JavaScript – Interaction and behavior

Without JavaScript

Without JavaScript, a website would have:

  • No dynamic content
  • No instant updates
  • No modern web application features

Most modern websites depend on JavaScript to function properly.


Client-Side JavaScript vs Server-Side JavaScript

JavaScript can run in two different places:

  1. Inside the user’s browser
  2. Inside a server

Based on where it runs, JavaScript is divided into:

  • Client-Side JavaScript
  • Server-Side JavaScript

What Is Client-Side JavaScript?

Client-side JavaScript runs inside the user’s web browser such as Chrome, Edge, or Firefox.
This is the original and most common use of JavaScript.

What client-side JavaScript does

  • Runs after the web page is loaded
  • Responds to user actions like click, type, and scroll
  • Changes content without reloading the page
  • Shows popups, alerts, and messages
  • Validates forms before sending data to the server

Example

  • Click a button → text changes instantly
  • Type in a form → error message appears immediately

All of this happens inside the browser, without contacting the server.

What Is Server-Side JavaScript?

Server-side JavaScript runs on a server, not in the browser.
This is possible using technologies like Node.js, which allow JavaScript to run outside the browser.

What server-side JavaScript does

  • Handles user requests
  • Connects to databases
  • Saves and retrieves data
  • Manages authentication and authorization
  • Sends responses back to the browser

Example

  • User submits a login form
  • Server checks username and password
  • Server sends a success or error response

This logic runs on the server, not on the user’s device.


Difference Between Client-Side and Server-Side JavaScript

FeatureClient-Side JavaScriptServer-Side JavaScript
Runs whereUser’s browserServer
Main purposeInteraction and UI behaviorData and business logic
Database accessNoYes
Visible to userYesNo
Example toolsBrowser JavaScript, DOMNode.js, Express

📣 Follow us for more updates:

Follow on LinkedIn Join WhatsApp Channel
Scroll to Top