Course Syllabus
Obiettivi
Gli obiettivi principali dell'insegnamento sono:
- Fornire una solida conoscenza fondamentale delle tecnologie web, inclusi HTML, CSS e JavaScript.
- Introdurre concetti avanzati di sviluppo front-end utilizzando React, con un focus su architettura a componenti, gestione dello stato e hook.
- Dotare gli studenti di abilità nella gestione degli stili tramite librerie come Reactstrap e nell'integrazione di API esterne attraverso esempi specifici.
- Familiarizzare gli studenti con le pratiche moderne di sviluppo, inclusa la gestione delle versioni con Git/GitHub, l'interazione con API RESTful e l'architettura MVC.
In aggiunta a conoscenze e competenze specifiche, il corso intende supportare lo sviluppo di autonomia di giudizio e la capacità di apprendere tramite attività progettuali in itinere ed opzionali di approfondimento per punti extra. In questo modo si propone anche di permettere lo sviluppo di abilità comunicative, per quanto concerne la documentazione e discussione di quanto realizzato.
Contenuti sintetici
- Fondamenti dello Sviluppo di Applicazioni Web: Impara i principi base per lo sviluppo di applicazioni web, inclusa l'acquisizione delle tecnologie essenziali come HTML, CSS e JavaScript per costruire interfacce utente interattive.
- Basics of React: Approfondisci React per comprendere componenti e gestione dello stato, abilitando esperienze web dinamiche e reattive con tecniche avanzate di sviluppo front-end.
- Tecniche Avanzate di React: Impara a gestire il routing, il rendering condizionale e l'API Context in React, oltre alla gestione degli stili visivi utilizzando librerie come Reactstrap per interfaccie utente più sofisticate.
- Pratiche di Sviluppo Moderno: Acquisisci competenze nella comunicazione con i server tramite JSON e HTTP, comprendi il pattern di design MVC e adotta strumenti e pratiche moderne come Git/GitHub per il controllo delle versioni e l'integrazione di API RESTful.
Programma esteso
- Basi dello sviluppo di applicazioni web
- JavaScript per applicazioni web interattive
- basi di React
- componenti e gestione dello stato in React
- gestione di stili visivi in React
- Routing, rendering condizionale, Context API
- MVC design pattern
- Interazione con server con JSON e HTTP
- strumenti e pratiche di sviluppo moderno
Prerequisiti
L'insegnamento è pensato per studenti di TTC del secondo anno, e richiede:
- conoscenze e competenze di base in area web
- basi di programmazione
Modalità didattica
Il corso sarà erogato attraverso una combinazione di lezioni e laboratori pratici.
Le lezioni si concentrano sulla comprensione teorica e sono accompagnate da laboratori pratici per consolidare l'apprendimento.
Gli studenti svolgeranno lavori progettuali, in particolare sull'applicazione To-do List durante tutto il corso, che sarà progressivamente sviluppata settimana dopo settimana.
Questa struttura è pensata per far sì che gli studenti acquisiscano sia la conoscenza teorica sia le competenze pratiche necessarie per lo sviluppo web utilizzando tecnologie moderne.
Materiale didattico
Slide e materiale condiviso dal docente. Si sta cercando di individuare un libro di supporto a temi avanzati per lo sviluppo di applicazioni in React.
Periodo di erogazione dell'insegnamento
Primo semestre
Modalità di verifica del profitto e valutazione
Scritto e orale facoltativo (su richiesta del docente o dello studente) su temi discussi e presentati durante il corso; saranno oggetto di valutazione la conoscenza dei concetti, tecniche, e problematiche discusse, l'abilità nella risoluzione di esercizi discussi durante il corso, la capacità di scegliere tecniche discusse in relazione alla loro adeguatezza a situazioni specifiche. È apprezzata la capacità di sintesi. Per la parte di laboratorio, sarà valutata la partecipazione attiva degli studenti. Verrà inoltre proposto un progetto facoltativo di gruppo (2-3 persone) con una sola possibilità di consegna annuale (che verrà fissata nella parte finale del corso, e sarà indicativamente collocata nei mesi di gennaio o febbraio) che potrà portare a dei punti extra, previa una discussione di quanto realizzato.
Orario di ricevimento
Mercoledì mattina, su appuntamento, eventualmente anche per via telematica.
Sustainable Development Goals
Aims
The main teaching objectives are:
- To provide a solid foundational knowledge of web technologies, including HTML, CSS, and JavaScript.
- To introduce advanced front-end development concepts using React, focusing on component-based architecture, state management, and hooks.
- To equip students with skills in managing styles through libraries such as Reactstrap and integrating external APIs via specific examples.
- To familiarize students with modern development practices, including version control with Git/GitHub, interaction with RESTful APIs, and MVC architecture.
In addition to specific knowledge and skills, the course aims to support the development of independent judgment and the ability to learn through ongoing project activities and optional deep-dive tasks for extra credit. This approach also seeks to facilitate the development of communication skills, particularly in documenting and discussing completed work.
Contents
- Web Application Foundations: Learn the basics of developing web applications, including essential technologies like HTML, CSS, and JavaScript for building interactive user interfaces.
- React Fundamentals: Dive into React to understand components and state management, enabling dynamic and responsive web experiences with advanced front-end development techniques.
- Advanced React Techniques: Master routing, conditional rendering, and context API in React, along with managing visual styles using libraries like Reactstrap for more sophisticated user interfaces.
- Modern Development Practices: Gain skills in server interaction through JSON and HTTP, understand the MVC design pattern, and adopt modern tools and practices such as Git/GitHub for version control and RESTful APIs integration.
Detailed program
- Basics of web application development
- JavaScript for interactive web applications
- Fundamentals of React
- Components and state management in React
- Management of visual styles in React
- Routing, conditional rendering, Context API
- MVC design pattern
- Server interaction with JSON and HTTP
- Modern development tools and practices
Prerequisites
The course is designed for second-year students of Theory and Technology of Communication (TTC), and it requires:
- Basic knowledge and skills in the web domain
- Fundamentals of programming
Teaching form
The course will be delivered through a combination of lectures and hands-on labs.
Lectures focus on theoretical understanding and are accompanied by practical labs to reinforce learning.
Students will engage in project work, particularly the To-do List app throughout the course, which will be incrementally built upon each week.
This structured approach ensures that students gain both theoretical knowledge and practical skills essential for web development using modern technologies.
Textbook and teaching resource
Slides and further materials shared by the teacher. A reference book for React is currently being selected.
Semester
First semester
Assessment method
Written and optional oral examination on topics discussed during the course; knowledge about concepts, techniques, issues discussed in the course, as well as the ability to solve exercises proposed, and the ability to choose solutions based on their appropriateness to the context of the problem will also be evaluated. The ability to convey knowledge and abilities in a compact and effective way will be appreciated. For the laboratory part of the cvourse, active participation of students will be assessed. An optional group project (2-3 members) will be proposed; a single possibility to carry out the project will be defined, plausibly close to the end of the course, with assignment due in the months of January/February. It could lead to extra points for the final evaluation, provided the project is discussed.
Office hours
Wednesday morning, by appointment, potentially also via teleconferencing systems.
Sustainable Development Goals
Staff
-
Giuseppe Vizzari
