The course, taught in English in the second semester of the first year of the Master of Science in Cybersecurity, aims at presenting the main techniques for creating distributed web applications, focusing in particular on the front-end programming, using the JavaScript language and a client-side programming framework. The main programming paradigms useful for the needs of the front-end of a modern web application will be considered, both by analyzing their impact in term of native JavaScript code, and by studying the approaches provided by a dominant framework. The topics presentation will enable the student to gain the basic skill to manage the main design choices within the mentioned topics, with additional attention to security aspects of web applications.
The course, taught in English in the second semester of the first year of the Master of Science in Cybersecurity, aims to present the main techniques for creating distributed web applications, focusing particularly on front-end programming using JavaScript and a client-side programming framework. The main programming paradigms useful for the needs of the front-end of a modern web application will be considered, both by analyzing their impact in terms of native JavaScript code and by studying the approaches provided by a dominant framework. The topics presentation will give the student the essential skill to manage the main design choices within the mentioned topics, with additional attention to the security aspects of browser-based web applications.
- Knowledge of the main aspects of HTML, CSS, modern JavaScript
- Ability to use a JavaScript at an advanced level for creating web applications at the front-end layer.
- Basic knowledge of a framework for creating web applications in JavaScript
- Ability to create complete web applications, also in the “single page application” modality, by using a simple back-end API server.
- Knowledge of the security risks in the development of browser-based web applications and the ability to enforce and implement best practices to mitigate such issues.
- Understanding of the main issues regarding, robustness, interoperability, and performance of the studied applications.
- Knowledge of the main aspects of HTML, CSS, and modern JavaScript
- Ability to use JavaScript at an advanced level to create web applications at the front-end layer.
- Basic knowledge of a framework for creating web applications in JavaScript
- The ability to create complete web applications, also in the “single page application” modality, using a simple back-end API server.
- Knowledge of the security risks in developing browser-based web applications and the ability to enforce and implement best practices to mitigate such issues.
- Knowledge of the main issues regarding robustness, interoperability, and performance of the studied applications.
- Ability to program in procedural languages and object-oriented languages, and corresponding debugging skills.
- Basic knowledge of HTML.
- Basic knowledge of web architectures and of the HTTP protocol
- Basic understanding of public-key cryptography, digital signature and certificates
- Practical skills with relational Data Bases and SQL
- Ability to program in procedural and object-oriented languages and corresponding debugging skills.
- Basic knowledge of HTML.
- Basic knowledge of web architectures and the HTTP protocol
- Basic understanding of public-key cryptography, digital signatures and certificates
- Practical skills with relational databases and SQL
- Recall of web architectures, HTML5, CSS.
- Complex layouts, CSS frameworks. Notions of web design.
- JavaScript as a language. Variables and objects. Execution in the browser and in nodejs.
- Handling forms and tables. DOM. Events. Callbacks. Closures.
- Web servers and ExpressJS. Package managers and related security issues.
- JSON. HTTP API. Asynchronous programming (async/await, Promise, Fetch).
- Single Page Applications. Reactive programming. Introduction to ReactJS.
- React applications. Components. JSX.
- Identification, authentication and API authorization mechanisms. Tokens, signatures, server-side validation.
- Architecture of a complex application. Event routing. State management.
- Web related security issues and best practices.
- Deployment and publication of applications.
- Application examples.
- Recall of web architectures, HTML5, CSS.
- Complex layouts, CSS frameworks. Notions of web design.
- JavaScript as a language. Variables and objects. Execution in the browser and nodejs.
- Handling forms and tables. DOM. Events. Callbacks. Closures.
- Web servers and ExpressJS. Package managers and related security issues.
- JSON. HTTP API. Asynchronous programming (async/await, Promise, Fetch).
- Single Page Applications. Reactive programming. Introduction to ReactJS.
- React applications. Components. JSX.
- Identification, authentication and API authorization mechanisms. Tokens, signatures, server-side validation.
- Architecture of a complex application. Event routing. State management.
- Web-related security issues and best practices.
- Deployment and publication of applications.
- Application examples.
In addition to classes, that include both lectures and exercises in classroom (5.3 credits), the course includes laboratory exercises (2.7 credits) on the application of the presented techniques. The laboratories will consist in the application of the techniques learnt during the classes, by incrementally building a web application of increasing complexity. During the labs the students will discuss with the teachers on their solutions to the assigned exercises. The lab material will be managed through a Git-based platform.
In addition to classes, including both lectures and exercises in the classroom (5.3 credits), the course includes laboratory exercises (2.7 credits) on the application of the presented techniques. The laboratories will consist of the application of the techniques learnt during the classes by incrementally building a web application of increasing complexity. The students will discuss their solutions to the assigned exercises during the labs with the teachers. The lab material will be managed through a Git-based platform. The activities will be carried out with particular attention to the use of innovative teaching methodologies that, when employed, will be adequately presented to the students during the course, including how they will eventually contribute to the final mark. Just as an example, the activities could include experimentation with code generated using machine learning approaches (e.g., LLM-based) followed by a critical evaluation by students and/or groups or a teacher-guided cross-group evaluation of the outcome of laboratory activities.
The teacher will provide the material (copy of slides and links to on-line resources) on the website of the course. Many useful resources are also freely available on the web (https://developer.mozilla.org, https://reactjs.org/, https://javascript.info/, etc).
Some suggested textbooks for personal in-depth study:
- M. Haverbeke, Eloquent Javascript (https://eloquentjavascript.net/)
- A. Accomazzo, A. Lerner, N. Murray, C. Allsopp, D. Guttman, T. McGinnis, Fullstack React, 2019
The teacher will provide the material (copy of slides and links to on-line resources) on the website of the course. Many useful resources are also freely available on the web (https://developer.mozilla.org, https://reactjs.org/, https://javascript.info/, etc).
Some suggested textbooks for personal in-depth study:
- M. Haverbeke, Eloquent Javascript (https://eloquentjavascript.net/)
- A. Accomazzo, A. Lerner, N. Murray, C. Allsopp, D. Guttman, T. McGinnis, Fullstack React, 2019
Slides; Esercitazioni di laboratorio risolte; Video lezioni dell’anno corrente;
Lecture slides; Lab exercises with solutions; Video lectures (current year);
Modalità di esame: Prova orale obbligatoria; Elaborato progettuale individuale;
Exam: Compulsory oral exam; Individual project;
...
Exam modality: development of an individual project and oral discussion. The exam consists in the verification of the above described expected knowledge and practical skills, through a practical project (to be implemented individually), followed by an oral discussion. The project consists in creating a web application using the knowledge gained in the course. For the test, an exercise will be assigned 20 days in advance of each exam date. Only students who submit their solution before the deadline are admitted to the oral test. The web application is evaluated by the teacher, by verifying the functionality of the web application, the adopted programming techniques, with particular attention to security practices, according to a checklist that depends on the test. The detailed knowledge of the submitted source code by the student is checked during the oral test, alongside with his/her ability to discuss the project in light of the course topics. All the process of project assignment, development, and submission will be managed through the GitHub platform. The oral check will be performed in a classroom or in a lab.
Gli studenti e le studentesse con disabilità o con Disturbi Specifici di Apprendimento (DSA), oltre alla segnalazione tramite procedura informatizzata, sono invitati a comunicare anche direttamente al/la docente titolare dell'insegnamento, con un preavviso non inferiore ad una settimana dall'avvio della sessione d'esame, gli strumenti compensativi concordati con l'Unità Special Needs, al fine di permettere al/la docente la declinazione più idonea in riferimento alla specifica tipologia di esame.
Exam: Compulsory oral exam; Individual project;
Exam modality: development of an individual project and oral discussion. The exam is aimed to verify the ability to understand the main issues regarding robustness, interoperability, security risks and performance of web applications, in particular when developed in the form of a “single page application”, also considering the implications of such issues on the server side. The exam consists of the development of a practical project (to be implemented individually), followed by an oral discussion. Automatic similarity checks will be run offline after project submission. In case of high similarity, after a manual review assessment by the teacher, the submissions might be voided. The project consists of creating a web application using the knowledge gained in the course. For the test, an exercise will be assigned 20 days in advance of each exam date. Only students who submit their solutions before the deadline are admitted to the oral test. The web application is evaluated by the teacher by verifying the functionality of the web application and the adopted programming techniques, with particular attention to security practices, according to a checklist that depends on the test. The detailed knowledge of the submitted source code by the student is checked during the oral test, alongside his/her ability to discuss the project in light of the course topics. All the process of project assignment, development, and submission will be managed through the GitHub platform. The oral exam will be performed in a classroom or in a lab. There is no separate evaluation of the project and oral exam since the oral exam is only meant to discuss the project, which is the objective of the evaluation. This part already allows achieving the maximum mark (i.e., cum laude) if everything has been developed in a clear and correct manner. Some additional points on the final mark might be available for the students who took part in the optional innovative teaching activities described in the course organization section. The detailed rules will depend on the specific activity, which could be different for each year, and will be promptly communicated to the students before the activities themselves.
In addition to the message sent by the online system, students with disabilities or Specific Learning Disorders (SLD) are invited to directly inform the professor in charge of the course about the special arrangements for the exam that have been agreed with the Special Needs Unit. The professor has to be informed at least one week before the beginning of the examination session in order to provide students with the most suitable arrangements for each specific type of exam.