Scripting Languages

Scripting languages are generally dynamically typed, meaning variable types are determined at runtime rather than at compile time. You do not need to declare whether a variable holds a number, a string, or an object before using it. This flexibility speeds up development but shifts error detection from compile time to runtime.

wwww

Scripting Languages

1. Understanding Scripting Languages

1.1 What Is a Scripting Language?

A scripting language is a programming language designed to automate tasks, control other software, and manipulate data. Unlike compiled languages such as C, C++, or Java — where source code is translated into machine code before execution — scripting languages are typically executed by an interpreter, which reads and runs code line by line.

The term “script” comes from theater: just as a script tells actors what to say and do, a scripting language tells the computer what operations to perform. It is about giving instructions, not building the underlying machinery.

1.2 How Many Scripting Languages Are There?

There is no single official count. Dozens of languages fall under the scripting umbrella, ranging from widely adopted giants like JavaScript, Python, and PHP to domain-specific tools like Bash, PowerShell, Ruby, and Lua. For practical purposes in web and app development, the most influential scripting languages can be organized by where their code executes and what problems they solve.

1.3 Types of Scripting Languages

Scripting languages are classified by their execution environment and primary use case.

Category	Description	Common Languages
Client-Side Scripting	Runs inside the user’s browser; drives interactivity, form validation, and dynamic content updates without page reloads	JavaScript
Server-Side Scripting	Runs on the web server; processes form submissions, queries databases, manages sessions, and generates dynamic HTML	PHP, Python, Ruby
Shell Scripting	Automates operating system tasks such as file management, backups, and deployment workflows	Bash, PowerShell
Text-Processing Scripting	Specializes in scanning text, extracting information, and generating reports	Perl
Multi-Paradigm Scripting	Supports procedural, object-oriented, and functional styles within one language	Python

JavaScript is the only language that runs natively in all major browsers, making it the undisputed foundation of client-side scripting. On the server side, users never see the underlying script code — only its output.

---

2. The JavaScript Ecosystem

2.1 Overview

JavaScript is the only programming language that runs natively in every major web browser, making it the foundational technology of the interactive web. Its reach extends far beyond the browser: through runtimes like Node.js, Deno, and Bun, JavaScript also powers servers, APIs, mobile apps, and desktop applications.

The hierarchy below groups each technology under its true parent — a framework or library appears as a “child” only when it is actually built on top of its parent’s codebase (e.g., Next.js is built on React). Where a tool is framework-agnostic and simply popular with a given framework (such as Redux, TypeScript, or Vite), it is listed separately rather than nested, to avoid implying a dependency that doesn’t exist.

Hello World in JavaScript:

console.log("Hello, World!");

console.log() prints text to the browser’s developer console or, in a Node.js environment, to the terminal. Running this file with node hello.js produces the same output as viewing it in a browser console (accessible via F12).

2.2 Frontend JavaScript

Frontend JavaScript runs inside the browser, handling user interactions, updating the display, and communicating with servers.

2.2.1 React (Library) — UI Components

React is a JavaScript library developed by Meta for creating interactive user interfaces. Its core concept is the component — a self-contained, reusable piece of UI composed with other components into complex applications. Components are typically functions that return JSX, a syntax extension resembling HTML that compiles to JavaScript function calls. React uses a virtual DOM to update only the elements affected by changes, helping applications remain responsive and efficient as they become more complex.

function HelloWorld() {
  return <h1>Hello, World!</h1>;
}

export default HelloWorld;

2.2.1.1 Next.js (Framework) — Built on React

Next.js is a React-based full-stack framework designed for developing modern web applications. It adds server-side rendering (SSR), where the server generates HTML per request for better SEO and load speed, and static site generation (SSG), where pages are pre-built at deploy time. It also provides file-based routing, API routes, image optimization, and built-in TypeScript support.

export default function Home() {
  return <h1>Hello, World!</h1>;
}

Each file in the pages directory becomes a route; pages/index.js becomes the homepage.

2.2.1.2 Remix (Framework) — Built on React

Remix is a React-based full-stack framework that emphasizes web standards and progressive enhancement through features such as nested routing, server-side data loading, and forms that remain functional without JavaScript.

export default function Index() {
  return <h1>Hello, World!</h1>;
}

In Remix, this file — app/routes/index.jsx — becomes the homepage, with routing and data loading handled automatically.

2.2.1.3 React Native — Built on React

React Native extends React to build native mobile applications for iOS and Android. Rather than wrapping a web view, it renders actual native UI components, giving apps near-native performance and appearance.

import React from 'react';
import { Text, View } from 'react-native';

export default function App() {
  return (
    <View>
      <Text>Hello, World!</Text>
    </View>
  );
}

View and Text map directly to native platform components on both iOS and Android.

2.2.2 Angular (Framework) — Web Applications

Angular is a complete frontend framework maintained by Google, providing routing, forms, an HTTP client, dependency injection, and testing utilities in a single package. It uses TypeScript and organizes code into modules, components, services, and directives. Unlike React and Vue, Angular does not have a lighter meta-framework built on top of it in the same way — it is already a full, opinionated application framework.

import { Component } from '@angular/core';

@Component({
  selector: 'app-hello-world',
  template: '<h1>Hello, World!</h1>'
})
export class HelloWorldComponent {}

Note: Angular relies heavily on TypeScript and RxJS, covered in section 2.2.4, but neither tool is exclusive to Angular — both are listed separately because they are independent, framework-agnostic technologies.

2.2.3 Vue (Framework) — Web Applications

Vue, created by Evan You, emphasizes approachability and flexibility with HTML-based templates and an automatic reactivity system. It scales from a lightweight enhancement library to a full single-page-application framework.

<template>
  <h1>{{ message }}</h1>
</template>

<script>
export default {
  data() {
    return {
      message: "Hello, World!"
    };
  }
};
</script>

2.2.3.1 Nuxt.js (Framework) — Built on Vue

Nuxt is to Vue what Next.js is to React: a framework built directly on Vue that adds server-side rendering, static generation, and file-based routing for SEO-friendly applications.

<template>
  <h1>Hello, World!</h1>
</template>

2.2.3.2 Pinia (Library) — Vue-Specific State Management

Pinia is the official Vue 3 state management library, offering a simple API with full TypeScript support and Vue DevTools integration. It has replaced Vuex as Vue’s recommended state solution and, unlike Redux, is designed exclusively for Vue.

import { defineStore } from 'pinia';

export const useHelloStore = defineStore('hello', {
  state: () => ({
    message: "Hello, World!"
  })
});

2.2.4 Framework-Agnostic Frontend Tooling

The following tools are commonly associated with specific frameworks in practice, but are independently maintained and work across multiple frameworks. They are intentionally not nested under React, Vue, or Angular, since none of them are built on top of those frameworks.

2.2.4.1 Redux (Library) — State Management

Redux provides a single, centralized store for application state. Components dispatch actions, reducers process them, and the store updates predictably. Although best known in the React community, Redux itself has no dependency on React and can be used with Vue, Angular, or plain JavaScript.

import { createStore } from 'redux';

const initialState = { message: "Hello, World!" };

function reducer(state = initialState, action) {
  return state;
}

const store = createStore(reducer);
console.log(store.getState().message); // Hello, World!

2.2.4.2 TypeScript (Superset) — Typed JavaScript

TypeScript is a Microsoft-developed superset of JavaScript that adds static typing and compiles to plain JavaScript. It catches type mismatches at compile time and improves documentation, autocomplete, and refactoring safety. Angular is built with TypeScript, but TypeScript itself is a general-purpose language used across virtually every JavaScript framework and runtime.

function greet(name: string): string {
  return `Hello, ${name}!`;
}

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

2.2.4.3 RxJS (Library) — Reactive Programming

RxJS composes asynchronous and event-based programs using observable sequences, treating streams like user input or HTTP responses as first-class objects. Angular integrates RxJS deeply for HTTP requests and form handling, but RxJS is a standalone library usable in any JavaScript environment.

import { of } from 'rxjs';
import { map } from 'rxjs/operators';

of("Hello, World!")
  .pipe(map(message => message.toUpperCase()))
  .subscribe(result => console.log(result));

// Output: HELLO, WORLD!

2.2.4.4 Vite (Build Tool) — Development Server & Application Bundling

Vite is a development server and build tool that leverages native ES modules for near-instant startup and hot module replacement. For production, it uses Rollup to bundle optimized assets. Vite is framework-agnostic and ships with official templates for React, Vue, and Svelte alike.

npm create vite@latest hello-world -- --template react
cd hello-world
npm install
npm run dev

2.2.5 Svelte (Compiler) — Full-Stack UI

Svelte takes a different approach from React and Vue: instead of shipping a framework runtime to the browser, Svelte compiles components into highly optimized vanilla JavaScript at build time. This results in smaller bundles and faster runtime performance.

<script>
  let message = "Hello, World!";
</script>

<h1>{message}</h1>

2.2.5.1 SvelteKit (Framework) — Built on Svelte

SvelteKit is the official full-stack framework built on top of Svelte, providing routing, server-side rendering, and API endpoints — the same relationship Next.js has to React.

2.2.6 Hybrid Mobile & Desktop (Independent Frameworks)

These tools use JavaScript and web technologies to target mobile and desktop platforms, but are independently built — not extensions of React, Vue, or Angular.

2.2.6.1 Ionic — Hybrid Mobile

Ionic builds hybrid mobile apps with HTML, CSS, and JavaScript, running inside a WebView and using Capacitor or Cordova to access native device features. It can optionally integrate with Angular, React, or Vue, but is not built on any of them.

<ion-header>
  <ion-toolbar>
    <ion-title>Hello, World!</ion-title>
  </ion-toolbar>
</ion-header>

2.2.6.2 NativeScript — Native Mobile

NativeScript gives JavaScript direct access to native APIs without a bridge, supporting Angular, Vue, and plain JavaScript for genuinely native performance.

<Page>
  <Label text="Hello, World!" />
</Page>

2.2.6.3 Electron.js — Cross-Platform Desktop

Electron builds desktop applications for Windows, macOS, and Linux using web technologies, bundling a Chromium browser and Node.js runtime. Applications such as Visual Studio Code, Slack, and Discord use Electron as their desktop application framework.

const { app, BrowserWindow } = require('electron');

app.whenReady().then(() => {
  const win = new BrowserWindow({ width: 800, height: 600 });
  win.loadURL('data:text/html,<h1>Hello, World!</h1>');
});

2.3 Backend JavaScript

JavaScript’s move to the server began with Node.js in 2009. Backend JavaScript now powers APIs, real-time applications, microservices, and command-line tools.

2.3.1 JavaScript Runtimes

Node.js, Deno, and Bun are siblings, not parent and child — each is an independent runtime for executing JavaScript outside the browser, built with different engines and design goals.

2.3.1.1 Node.js — Server-Side JavaScript

Node.js executes JavaScript using Chrome’s V8 engine. Its event-driven, non-blocking I/O model efficiently handles many concurrent connections, and npm gives access to millions of open-source packages.

console.log("Hello, World!");

Save as hello.js and run node hello.js.

2.3.1.2 Deno — Secure Server Runtime

Created by Ryan Dahl, Node.js’s original creator, Deno is secure by default — scripts need explicit permission to access the file system, network, or environment. It supports TypeScript natively and includes built-in testing, formatting, and linting tools.

console.log("Hello, World!");

Save as hello.ts and run deno run hello.ts.

2.3.1.3 Bun — Fast JavaScript Runtime

Bun is a modern runtime built on JavaScriptCore and written in Zig, bundling a package manager, bundler, and test runner into a single binary, often outperforming Node.js.

console.log("Hello, World!");

Save as hello.js and run bun run hello.js.

2.3.2 Node.js Web Frameworks

These frameworks run on top of the Node.js runtime, but are not all built on top of each other. Express and Koa were created by the same team but are architecturally independent; Fastify is a separate, ground-up project; Nest.js is the one genuine framework-on-framework relationship in this group, since it wraps Express by default.

2.3.2.1 Express.js (Framework) — Server & API

Express is the most widely used Node.js framework, providing a thin, unopinionated layer of routing, middleware, and request/response handling on top of Node’s built-in HTTP module.

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('Hello, World!');
});

app.listen(3000);

2.3.2.1.1 Nest.js (Framework) — Built on Express (or Fastify)

Nest.js is a progressive, TypeScript-based meta-framework that wraps Express as its default underlying HTTP engine, layering on Angular-style modules, decorators, and dependency injection. It can be reconfigured to run on Fastify instead via an official adapter, but out of the box it is genuinely built on top of Express — making this the one clear parent-child relationship among Node.js frameworks.

import { Controller, Get } from '@nestjs/common';

@Controller()
export class AppController {
  @Get()
  getHello(): string {
    return 'Hello, World!';
  }
}

2.3.2.2 Koa (Framework) — Independent, Not Built on Express

Koa was created by the same team behind Express, but it is not built on top of Express — it is its own HTTP library with a separate codebase, and its middleware is not compatible with Express’s. Koa uses async/await natively, eliminating callback-based error handling in favor of a single ctx context object.

const Koa = require('koa');
const app = new Koa();

app.use(async ctx => {
  ctx.body = 'Hello, World!';
});

app.listen(3000);

2.3.2.3 Fastify (Framework) — Independent, Ground-Up Design

Fastify is a separate Node.js framework focused on speed and low overhead, built from scratch rather than on top of Express. It uses schema-based validation and serialization to improve both performance and security, and consistently benchmarks as one of the fastest Node.js frameworks available. Notably, Fastify can also serve as Nest.js’s underlying engine in place of Express.

const fastify = require('fastify')();

fastify.get('/', async (request, reply) => {
  return 'Hello, World!';
});

fastify.listen({ port: 3000 });

2.4 Full-Stack JavaScript Combinations

Full-stack JavaScript stacks combine a database, a backend framework, and a frontend library under one language. These are combinations of the technologies above, not new frameworks in their own right.

2.4.1 MERN Stack — MongoDB, Express, React & Node

MongoDB stores JSON-like documents, Express handles routing and APIs, React manages the UI, and Node.js provides the runtime — an all-JavaScript stack.

// Backend (Express + Node)
app.get('/api/hello', (req, res) => {
  res.json({ message: "Hello, World!" });
});

// Frontend (React)
useEffect(() => {
  fetch('/api/hello')
    .then(res => res.json())
    .then(data => console.log(data.message));
}, []);

2.4.2 PERN Stack — PostgreSQL, Express, React & Node

PERN swaps MongoDB for PostgreSQL, a relational database favored when applications need structured data, transactions, and entity relationships.

-- PostgreSQL
SELECT 'Hello, World!' AS message;

// Express + Node
app.get('/api/hello', async (req, res) => {
  const result = await pool.query("SELECT 'Hello, World!' AS message");
  res.json(result.rows[0]);
});

2.4.3 Salesforce Commerce Cloud (SFRA) — Full-Stack Commerce

Salesforce Commerce Cloud is an enterprise e-commerce platform; SFRA (Storefront Reference Architecture) is its Node.js-based storefront framework, providing reference patterns for product listings, cart management, and checkout.

// controllers/Hello.js
server.get('Hello', (req, res, next) => {
  res.render('hello', { message: 'Hello, World!' });
  next();
});

<!-- templates/hello.isml -->
<h1>${message}</h1>

---

3. The PHP Ecosystem

3.1 Overview

PHP (PHP: Hypertext Preprocessor) was created in 1994 and has powered a significant share of the web ever since, running on roughly one-third of all web domains by 2003. It is embedded directly into HTML, executes on the server, and sends only rendered output to the browser. PHP supports both procedural and object-oriented programming.

<?php
echo "Hello, World!";
?>

The <?php ... ?> tags mark the boundaries of server-processed code; a user viewing the page source sees only the resulting output, never the PHP itself.

3.2 WordPress (CMS) — Web & Blogging

WordPress is a PHP-based content management system powering over 40% of all websites. Its visual editor, plugin architecture, and theme system let non-developers build and manage sites, while the PHP codebase remains extensible through custom themes and plugins.

// In a theme's functions.php or a plugin file
add_shortcode('hello', function() {
  return 'Hello, World!';
});

3.3 Laravel (Framework) — Web & API

Laravel is a modern PHP framework known for clean syntax and developer-friendly tooling: an ORM (Eloquent), templating engine (Blade), routing, authentication, queues, and the Artisan CLI, following the MVC pattern.

// routes/web.php
Route::get('/', function () {
    return 'Hello, World!';
});

3.4 Magento (Framework) — E-Commerce

Magento (now Adobe Commerce) is a PHP-based e-commerce platform offering multi-store management, customizable catalogs, complex pricing rules, and extensive APIs for large-scale retailers.

// In a custom module controller
public function execute()
{
    echo 'Hello, World!';
}

WordPress, Laravel, and Magento are independent PHP projects — none is built on top of another — so they remain siblings under PHP rather than nested.

---

4. The Python Ecosystem

4.1 Overview

Python was released in 1991 with a design philosophy centered on readability, using indentation instead of braces to define code blocks. It is dynamically typed and interpreted, supporting procedural, object-oriented, and functional styles, and is widely used in web development, data science, machine learning, and automation.

print("Hello, World!")

Python executes this line immediately when run with python hello.py — there is no compilation step.

4.2 Django (Framework) — Web & API

Django is a high-level, “batteries-included” Python framework offering an ORM, authentication system, admin interface, form handling, and security features out of the box. It follows the MVC pattern (called MTV in Django terms) and powers products at companies like Instagram, Pinterest, and Mozilla.

# views.py
from django.http import HttpResponse

def hello(request):
    return HttpResponse("Hello, World!")

# urls.py
from django.urls import path
from . import views

urlpatterns = [
    path('', views.hello, name='hello'),
]

---

5. Perl — Scripting & Text Processing

Perl was created in 1987 by Larry Wall as a tool for scanning text files, extracting information, and generating reports — its name is often expanded as “Practical Extraction and Report Language.” Its syntax borrows from C, sed, awk, and shell scripting, and its strength in regular expressions made it a longtime standard for system administration, bioinformatics, and early web CGI scripts.

print "Hello, World!\n";

Perl requires an explicit newline character (\n), since it does not add one automatically. Save as hello.pl and run perl hello.pl.

---

6. Conclusion

Scripting languages form the connective tissue of modern software. JavaScript drives interaction in the browser and powers servers through Node.js, Deno, and Bun. PHP remains the backbone of content management and e-commerce. Python bridges web development and artificial intelligence. Perl continues to serve text-processing and system administration needs.

Every technology in this guide — from React components to Django views, from Express routes to Laravel controllers — shares a common trait: it uses a dynamically typed scripting language to turn instructions into working software. Where one technology is genuinely built on another (Next.js on React, Nest.js on Express), the hierarchy reflects that. Where tools merely tend to be used together (Redux with React, TypeScript with Angular), they are presented as independent peers, so the structure of this guide matches the actual architecture of the ecosystem rather than just common usage patterns.