Computer and Control Engineering

LORENZO MARCONI

General objectives.
The main objectives are: knowing HTML and XML, the standard languages for the representation of information on the World Wide Web; knowing standards, methods and tools for processing such languages, specifically HTML stylesheets (CSS), DOM HTML, libraries and frameworks for HTML (Bootstrap), XML stylesheets; knowing client-side Web programming (JavaScript, JSON, JQuery); knowing the basics of server-side Web programming (PHP, Node.js).

Specific objectives.
Knowledge and understanding:
The main standards for representing and processing information in the World Wide Web. The techniques for developing the client side of a Web application.

Applying knowledge and understanding:
Being able to design the client side of a Web application.

Making judgements:
Being able to evaluate the quality of a Web application, in particular its client side.

Communication skills:
The practical activities and the exercises allow the student to be able to communicate and share the requirements of a Web application, as well as the design choices and methodologies of the client side of such an application.

Learning skills:
Besides the classical learning skills provided by the theoretical study of the teaching materials, the practical activities stimulate the student to autonomously deepen her/his knowledge about some of the course topics, to teamwork, and to the practical application of the notions and techniques learned during the course.

1. Understand the fundamental principles of the World Wide Web and the HTTP protocol: describe the architecture of the Web, the role of the client and server, and the main HTTP methods and status codes.
2. Understand markup languages and HTML5 specifications: recognize and apply HTML5 semantic constructs to structure accessible and semantically correct pages.
3. Design and implement complete and validatable HTML forms: know how to build forms with appropriate fields and client-side and server-side validation mechanisms.
4. Design responsive layouts with CSS: use style sheets, selectors, box models, flexbox/grid, and media queries to create adaptive interfaces on mobile and desktop devices.
5. Understand and manipulate the Document Object Model (DOM): navigate and modify the structure of a page using the DOM API, updating content, attributes, and style in response to events.
6. Program client interactions with JavaScript: write JavaScript code for event handling, dynamic validation, code modularity, and correct use of callbacks/Promises/async-await.
7. Use JavaScript libraries and frameworks (e.g., jQuery) and AJAX techniques: integrate a library to simplify DOM manipulation and use AJAX/fetch for asynchronous communication with the server.
8. Develop server-side components with PHP or Node.js: implement endpoints, handle HTTP requests, sessions, and form submissions, and understand basic security concepts (e.g., input sanitization).
9. Understand XML and related technologies (DOM XML, XPath, XSLT): read and transform XML documents using XPath and XSLT for integration and presentation purposes.
10. Design and implement a complete client-server flow: integrate front-end (HTML/CSS/JS) and back-end (PHP/Node.js) to create functional, testable, and maintainable web applications.

Knowledge of at least one high-level programming language.

1. World Wide Web and HTML:
World Wide Web, HTTP
Markup languages
HTML and XHTML
HTML5
CSS stylesheets
2. Client-side Web programming:
The HTML Document Object Model
JavaScript
Frameworks and libraries for JavaScript
JQuery
AJAX
3. Server-side Web Programming:
PHP
Node.js
4. XML:
XML
DOM
XPath, XSL stylesheets, XSLT

1) Lecture notes
2) D. Haverbeke: JavaScript - Guida completa per lo sviluppatore (Eloquent JavaScript, 2nd edition). Hoepli, 2016. The fourth edition of the manual (2024) is available online in English.

Lectures are held in presence and streamed online.

No attendance obligation.

The exam consists of a written exam with questions and exercises on the course topics.

There is also the possibility of presenting a practical project to be carried out in a group of two or three people.

To pass the exam, students must obtain a grade of at least 18/30.
Students must demonstrate that they have acquired sufficient knowledge of all the topics covered in the program and are able to put the concepts learned into practice in the development of an entire web application (in the case of a practical project) or specific parts of it (in the case of a written test).
To achieve a score of 30/30 with honors ("lode"), students must demonstrate that they have acquired excellent knowledge of all the topics covered during the course and are able to connect them in a logical and coherent manner.

The proposed exercises mainly cover the following topics:
- creation and validation of HTML forms
- creation of responsive layout using CSS
- dynamic manipulation of the contents of a Web page using its document-object model
- handling of events in JavaScript
- (synchronous and asynchronous) interaction between Web clients and Web servers
- applications of XSL for XML document transformation