Web Engineering :: Course Log

Lectures Log - A.Y. 2025/2026

Total lectures: 10, total lecture hours: 20 (41%) - First lecture: 2026-02-24, Last lecture: 2026-03-26

Lecture 1: Modern web: technologies, challenges and problems

2026-02-24, 14:30 (2 hours)

(1-1)

Course presentation
(1-2)

The origins of WWW
(1-3)

The client-server architecture
(1-4)

Web 2.0: Rich Internet Applications, Social Web
(1-5)

Today's web problems: accessibility, usability, cross-browser programming, security,...
(1-6)

Web technologies: client side (HTML5, CSS3 e responsive design, Javascript, AJAX)
(1-7)

Web technologies: server side (Java servlets, JDBC, Freemarker templates)
(1-8)

Creating a website with the MVC pattern: separation between data, business logic and presentation

Lecture 2: XML

2026-02-26, 14:30 (2 hours)
Slides XML

(2-1)

The HTTP protocol
(2-2)

Base concepts: URIs, URLs, media types...
(2-3)

What is and what is not XML
(2-4)

XML base syntax: the XML declaration
(2-5)

Example Character encoding problems
(2-6)

Character encoding: what is really UTF-8? (and UTF-16? and ISO-8859-1??)
(2-7)

Example Character encoding: can also be a security problem: the UTF-7 attack
(2-8)

XML base syntax: the DOCTYPE declaration
(2-9)

Example Correct declaration of the HTML version in use
(2-10)

Standards and Quirks modes
(2-11)

XML base syntax: elements and their syntactic rules
(2-12)

Example Common problems related to element syntax
(2-13)

XML base syntax: attributes and their syntcatic rules
(2-14)

Example Common problems related to attribute syntax
(2-15)

XML base syntax: namespaces
(2-16)

XML base syntax: text and character entities
(2-17)

Example XSS attacks and the correct use of entities for reserved characters
(2-18)

XML base syntax: CDATA sections
(2-19)

Example The problem with embedded scripts in HTML pages

Lecture 3: HTML /1

2026-03-03, 14:30 (2 hours)
Slides HTML

(3-1)

The HTML evolution
(3-2)

Keeping up to date with the living standard: reference sites
link https://developer.mozilla.org/en-US/docs/Web/HTML
link https://html.spec.whatwg.org
(3-3)

Check and fix your HTML: validators
link https://validator.w3.org
(3-4)

Standards and Quirks modes
(3-5)

Basic document structure for HTML4 and HTML5 documents
(3-6)

HTML: inline and block elements
(3-7)

The new element classification in HTML5
(3-8)

HTML: common attributes
(3-9)

New HTML5 common attributes: data, aria,...
material HTML_Examples - HTML5
(3-10)

Example Use of the ARIA attributes in complex, customized layouts
link https://www.w3.org/WAI/standards-guidelines/aria
link https://www.w3.org/WAI/ARIA/apg/patterns/
(3-11)

HTML: paragraphs and breaks (p, br)
(3-12)

Example Empty paragraphs, line breaks, etc.: the wrong ways to add vertical space
(3-13)

Marking the document base structure: the h elements
(3-14)

The semantic value of a correct markup
(3-15)

The new HTML5 sectioning elements
material HTML_Examples - HTML5
(3-16)

Example Actual rendering of the HTML elements
material HTML_Examples
(3-17)

HTML: the div and span containers (div, span)
(3-18)

HTML: semantic formatting (em, code, pre, ins, q,...)

Lecture 4: HTML /2

2026-03-05, 14:30 (2 hours)
Slides HTML

(4-1)

HTML: base formatting (i, b, tt,...)
(4-2)

Example New behaviour of some formatting elements in HTML5
link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i
(4-3)

Lists as semantic element in complex layouts
(4-4)

Example Creating a menu with graceful degradation using lists
material css_menu_multilev_static
(4-5)

HTML: lists (ol, ul, dl)
(4-6)

HTML: tables
material HTML_Examples - Tables
(4-7)

The table element attributes in HTML5
(4-8)

Base table structure: rows (tr), cells (td) and header cells (th)
(4-9)

The complete table structure: header (thead), body (tbody), footer (tfoot)
(4-10)

Example Watch out for the implicit tbody element...
(4-11)

Creating complex tables with colspan and rowspan
(4-12)

Images in web pages
material HTML_Examples - Images
(4-13)

Accessible images: the alt attribute
(4-14)

Client size image resizing
(4-15)

Server and client side image maps
(4-16)

Logical links between resources (link)
(4-17)

The rel(ation) attribute in links
link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel
(4-18)

Example Alternate documents
(4-19)

Example External stylesheets
(4-20)

Example Adding a RSS feed to a web page
(4-21)

Example Adding a shortcut icon to a web page

Lecture 5: HTML /3

2026-03-10, 14:30 (2 hours)
Slides HTML

(5-1)

Example Page loading optimization (speculative loading): preload and prefetch links
link https://developer.mozilla.org/en-US/docs/Web/Performance/Guides/Speculative_loading
link https://developer.mozilla.org/en-US/docs/Web/Performance/Speculative_loading
link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel/preload
(5-2)

Hyperlinks (a)
(5-3)

Anchors and fragment identifiers
(5-4)

Example Jump directly to the page content
(5-5)

Forms in HTML (form)
(5-6)

Important form attributes: action, method, enctype e accept-charset
link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form
(5-7)

Example Using accept-charset to solve further encoding issues (this time between client and server)
(5-8)

The GET and POST methods
(5-9)

Form data encoding
(5-10)

Example Choosing the right method/encoding combination for a form
(5-11)

Example The POST-Redirect-GET pattern for form submission
link https://en.wikipedia.org/wiki/Post/Redirect/Get
material Java_Example_Post_Redirect_Get
(5-12)

The input control element (input)
(5-13)

Example Rendering comparison for input controls on different browsers
material HTML_Examples - Forms
(5-14)

Example Values submitted by non-textual inputs: file, checkbox, radio,...

Lecture 6: Java Web Applications

2026-03-12, 14:30 (2 hours)
Slides HTML

(6-1)

Value validation attributes in HTML4 and HTML5 (maxlength, min, max, pattern,...)
(6-2)

Example How (and where) form data should be validated
(6-3)

Text editors (textarea)
(6-4)

Multiple choice selectors (select)
(6-5)

Example Option labels and values: which data should I send to the server?
(6-6)

Options and option groups
(6-7)

Different renderings of select controls
material HTML_Examples - Forms
(6-8)

Example Select controls used as menus on mobile devices
(6-9)

Accessible control labels (label)
(6-10)

Java/Jakarta Enterprise Edition (JEE/JakartaEE): versions and profiles
link https://www.oracle.com/java/technologies/java-ee-glance.html
link https://jakarta.ee/about/jakarta-ee/
(6-11)

(Private) Installation of a complete development environment (JDK, IDE, server) for Java web applications
(6-12)

Java web application deployment: from IDE to server
(6-13)

A new way to deploy Java web applications: JAR with embedded server

Lecture 7: Java Servlets /1

2026-03-17, 14:30 (2 hours)
Slides Servlets
Material JakartaEE Web Application tutorial

(7-1)

Example Different use cases for hidden inputs
(7-2)

Example The Cross-site request forgery
link https://owasp.org/www-community/attacks/csrf
(7-3)

Example Hidden inputs and CSRF tokens
link https://cheatsheetseries.owasp.org/cheatsheets/Cross-Site_Request_Forgery_Prevention_Cheat_Sheet.html
(7-4)

Apache Tomcat server installation and introduction
(7-5)

Netbeans IDE introduction
(7-6)

Example Some useful tips to link Netbeans and Tomcat
(7-7)

Servlets and containers
(7-8)

Introduction to servlet programming
(7-9)

The web application context and the url mapping
(7-10)

The web application base structure
(7-11)

The web application folder structure
(7-12)

Example How to create a new web application
material Java_WebApp_Base_T10
(7-13)

Example Compiling, deploying and executing a web application
(7-14)

The context configuration file (context.xml)
link https://tomcat.apache.org/tomcat-11.0-doc/appdev/deployment.html
(7-15)

Example How to add static resources (html, css, etc.) to a web application

Lecture 8: Java Servlets /2

2026-03-19, 14:30 (2 hours)
Slides Servlets
Material JakartaEE Servlet tutorial

(8-1)

Example How to add a new servlet in a web application
(8-2)

The deployment descriptor (web.xml)
material Java Servlet Specification, version 2.3, Chapter 13 - Deployment Descriptor
(8-3)

The servlet base interfaces: Servlet, ServletRequest, ServletResponse
(8-4)

The servlet lifecycle: initialization, service and finalization
(8-5)

Servlet initialization and finalization: init and destroy methods
(8-6)

The HttpServlet class and its doGet and doPost methods
(8-7)

Multithreading in the HttpServlet class: per-thread and shared variables
(8-8)

Writing data to the client: the HttpServletResponse class
(8-9)

Textual and binary output from a servlet
(8-10)

Example The "Hello World" servlet
(8-11)

Writing headers and payload of an HTTP response

Lecture 9: Java Servlets /3

2026-03-24, 14:30 (2 hours)
Slides Servlets

(9-1)

Example The project object model (POM) of a simple web application
(9-2)

Communication among application layers through request attributes
(9-3)

Effective error and exception handling in servlets
(9-4)

Returning HTTP error codes from a servlet
(9-5)

Getting user input through HttpServletRequest
(9-6)

Reading form GET parameters: getParameter and getParameterValues
(9-7)

Input validation to prevent attacks (like SQL Injection)
(9-8)

Output sanification to prevent XSS attacks
(9-9)

Example The "Hello World" servlet with a name parameter
material Java_Example_Servlet
(9-10)

Output logic (view) encapsulation and application layers
(9-11)

Example The restructured "Hello World" servlet
material Java_Example_Servlet_Fwk
(9-12)

Binary data download through servlets
(9-13)

Security issues: why we should use a download servlet and how we should write it

Lecture 10: Java Servlets /4

2026-03-26, 14:30 (2 hours)
Slides Servlets

(10-1)

Some interesting HTTP headers: Content-Type, Content-Disposition and Content-Length
(10-2)

Example An example of download servlet
material Java_Example_Downloader
(10-3)

Server-side generated images with Java
(10-4)

Example An image generation servlet
material Java_Example_Imager
(10-5)

Reading form POST parameters with url encoding
(10-6)

Handling multipart encoded forms
(10-7)

The multipart-config element
(10-8)

Handling uploaded files with getPart()
(10-9)

Example The 'Hello world' servlet with file upload
material Java_Example_Servlet_Multipart_7
(10-10)

Example Secure web applications accepting uploads
link https://cheatsheetseries.owasp.org/cheatsheets/File_Upload_Cheat_Sheet.html
(10-11)

Filenames sanitization