Web Application Development

Jakub Klinkovský

:: Czech Technical University in Prague
:: Faculty of Nuclear Sciences and Physical Engineering
:: Department of Software Engineering

Academic Year 2024-2025

Scripting Technologies

From Static Pages to Dynamic Applications

HTML was designed as a static language for providing unchanging content. Gradually, various scripting technologies have emerged that allow for the dynamic generation and/or modification of content.

Scripting Technologies

  • client-side (code is executed directly in the browser without server involvement, access to the object representation of the document)
    Use: changing the page in response to user input (mouse click, key press)

  • server-side (communication using forms and URL parameters, the server generates and sends the corresponding HTML document)
    Use: changing the page based on parameters, form data, database state, elapsed time, etc.

Static vs Dynamic Web Server

  1. Static web server:
    • sends only files stored on the disk (note: scripts for client-side processing are considered static files from the server's perspective)
    • URL is converted to a path in the file system
    • unnecessary input data (URL parameters, forms) are ignored
    • very simple, efficient, and secure
  2. Dynamic web server:
    • passes requests to a configured program, including all input data
    • complex configuration, large number of protocols and interfaces
    • risk of overload and security vulnerabilities
    • can take over the role of a static web server

Scripting Technologies on the Server Side

  1. Dynamic web server (software) – e.g. Apache, Nginx, Microsoft IIS
  2. Interface for running a program on the server
  3. Program in the given scripting language
  4. Database system, file system, operating system...
  • Options: full-fledged applications, working with forms, databases, files on the server, and email
  • Requisites: HTML, communication between HTML and server (URL, forms, HTTP protocol), programming experience, and potentially databases and OS

Most Common Operating System for Web Servers

System Share
Unix 88.6%
Windows 11.7%

Note:
Unix = Linux + BSD + Darwin + macOS + HP-UX + Solaris + Minix + Unknown

Most Common Web Servers

Server Share
Nginx 33.8%
Apache 26.8%
Cloudflare Server 23.3%
LiteSpeed 14.5%
Node.js 4.2%
Microsoft-IIS 4.1%
Envoy 1.2%

CGI (Common Gateway Interface)

  • an interface that defines how to run a program and pass data between the web server and a CGI script = a program that generates HTML documents
  • the format for passing parameters is complex
  • interpreted languages or Unix shell commands were used for writing scripts (typically Perl, but also C++, ...)
  • managing larger applications is challenging for programmers
  • replaced by "better" technologies – FastCGI, SCGI
  • currently, the most popular scripting languages have their own APIs, e.g. PHP FastCGI Process Manager, Python WSGI or ASGI, ASP.NET HTTP Handler, ...

SSI (Server Side Includes)

SSI is a simple scripting language where simple commands are placed in an HTML page (as HTML comments). It is one of the oldest scripting languages.

Example:

<!--# if expr="$name = /(.+)@(?P<domain>.+)/" -->
    <!--# echo var="1" -->
    <!--# echo var="domain" -->
<!--# endif -->
<!--# include file="footer.html" -->
  • typical extensions: .shtml, .stm, or .shtm
  • advantage: if the server was unable to process SSI, the user would see at least the uninterpreted content of the page
  • disadvantage: cannot process data from the user

Most Common Server Scripting Languages

Language Share 2022 Share 2023 Share 2024 Share 2025
PHP 78.1% 77.6% 76.5% 74.7%
Ruby 6.0% 5.1% 5.7% 6.2%
ASP.NET 7.9% 7.2% 6.4% 5.3%
Java 3.7% 4.7% 4.7% 5.1%
JavaScript 1.8% 2.0% 3.2% 4.2%
Scala 2.3% 2.9% 3.0% 4.0%
static files 1.5% 1.9% 1.8% 1.7%
Python 1.4% 1.4% 1.4% 1.3%

PHP

PHP = PHP: Hypertext Preprocessor is a scripting language designed specifically for web application development.

  • open-source, multiplatform
  • commands are placed in HTML between the <?php and ?> tags
  • fast development cycle, current version 8.3
  • advantages:
    • large number of available frameworks
    • built-in features focused on performance and security
  • disadvantages:
    • not suitable for developing desktop and mobile applications
    • lacks libraries compared to languages like Python or Ruby

ASP, ASP.NET, ASP.NET Core

ASP (Active Server Pages) is Microsoft's first server-side scripting language.

  • commands are placed in HTML between the <% and %> tags

ASP.NET is Microsoft's framework for web application development.

  • extends ASP with many new features: working with full-fledged languages and the .NET Framework – a large object model for working with databases, files, cookies, sessions, graphics, etc.
  • open-source

ASP.NET Core

  • modular reimplementation of the ASP.NET framework
  • open-source

Java, Scala

Java is a general-purpose, object-oriented programming language and its associated platform that combines various technologies for developing large applications. Currently, it is popular for developing web applications based on the client-server architecture.

  • disadvantage: complex system
  • advantage: allows running multiple servers within a single application
  • application servers are from various vendors

Scala is an object-oriented and functional programming language that can run on the Java platform. A popular framework for web development is Play!

JavaScript

The first attempts to use JavaScript on the server side: SSJS (server-side JavaScript) from Netscape, JScript and JScript.NET from Microsoft.

Currently, the most popular environment is Node.js:

  • powerful V8 engine from Google Chrome
  • open-source
  • multiplatform (MS Windows, GNU/Linux, macOS, Android, ...)
  • heavily utilizes the event model and asynchronous I/O operations (minimizing CPU overhead, maximizing performance)
  • large ecosystem of available libraries

Ruby on Rails

Ruby ("ruby") is a general-purpose, high-level, dynamic, interpreted programming language created in 1995 in Japan.

Ruby on Rails is a high-level framework for web application development that uses the MVC (model-view-controller) design pattern and the CRUD (create, read, update, delete) philosophy.

  • to run a web application, you only need a database and a web server
  • principle: convention over configuration (the programmer configures only those parts of the application that differ from the default settings)
  • another principle: don't repeat yourself

Python

Python is a general-purpose, high-level, dynamic, interpreted programming language designed with a focus on code readability. Its principles are summarized in the Zen of Python document.

Scripting Technologies on the Client Side

  • Examples: JavaScript, WebAssembly, VBScript, ActionScript, Flash, ...
  • Requirements: browser and user support (the user must not have disabled client-side scripts)
  • Options: same as server-side scripting (complete control over the object representation of the document, asynchronous resource loading)
  • Required Knowledge: HTML, programming basics, CSS

Web Application Architecture with Client-Side Scripts

  1. The client (user's browser) loads an HTML document, which has scripts attached to it.
  2. During the loading and rendering of the document, the client also loads and executes the scripts.
  3. The scripts work with the object model of the document (DOM), which they can modify.
  4. Scripts can utilize AJAX (Asynchronous JavaScript and XML)
    • the concept is based on technologies: HTML and CSS (presentation to the user), DOM (state representation), JSON or XML (data exchange), XMLHttpRequest (asynchronous communication with the server-side part of the application), JavaScript

Document Object Model (DOM)

center contain

Asynchronous JavaScript and XML (AJAX)

center contain

Representational State Transfer (REST)

REST is a description of software architecture that attempts to define the "standard" behavior of web applications. Not all services comply with it.

It is based on six constraints:

  1. communication between clients and servers – assumption of some API
    (separation of responsibilities: client handles presentation, server handles data)
  2. stateless communication – leads to efficiency (the server does not maintain information about session, it must be included in every request)
  3. caching – leads to efficiency and scalability (repeated requests can be eliminated for the duration of the validity of the resource)
  4. uniform interface (resource identification using URI, DOM, media type, HATEOAS)
  5. layered system (proxy, load balancer, content delivery network)
  6. code on demand (transfer of executable code – scripting on the client side)

REST in Practice

APIs that meet the requirements of the REST concept are referred to as "RESTful". For example, MediaWiki.

Counterexamples:

  • encoding user state data (session) into URLs violates REST and can negatively impact server-side application caching and scalability
  • HTTP cookies often violate REST and can become desynchronized
  • ignoring hypertext, media type, return codes, and other counterexamples

Disadvantages:

  • complex maintenance of state on the client side
  • does not address security